@seriphxyz/astro 0.1.7 → 0.1.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seriphxyz/astro",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "Astro components and content loader for Seriph widgets (forms, comments, reactions, posts)",
   "repository": {
     "type": "git",
@@ -41,7 +41,7 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@seriphxyz/core": "0.1.7"
+    "@seriphxyz/core": "0.1.8"
   },
   "peerDependencies": {
     "astro": "^5.0.0"

package/src/Comments.astro

@@ -96,6 +96,17 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
     replies: Comment[];
   }
 
+  // Get or create a visitor ID for anonymous users
+  const VISITOR_KEY = "seriph_visitor_id";
+  function getVisitorId(): string {
+    let id = localStorage.getItem(VISITOR_KEY);
+    if (!id) {
+      id = crypto.randomUUID();
+      localStorage.setItem(VISITOR_KEY, id);
+    }
+    return id;
+  }
+
   // Store form load timestamps for spam detection
   const formTimestamps = new WeakMap<Element, number>();
 
@@ -113,6 +124,12 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
 
     if (!endpoint || !siteKey || !pageId || !list || !form || !template) return;
 
+    const visitorId = getVisitorId();
+    const headers = {
+      "X-Seriph-Key": siteKey,
+      "X-Seriph-Visitor": visitorId,
+    };
+
     // Record when form was loaded (for time-based spam detection)
     formTimestamps.set(form, Math.floor(Date.now() / 1000));
 
@@ -130,9 +147,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
       try {
         const response = await fetch(
           `${endpoint}/comments/${encodeURIComponent(pageId!)}`,
-          {
-            headers: { "X-Seriph-Key": siteKey! },
-          },
+          { headers },
         );
         if (!response.ok) return;
         const data = await response.json();
@@ -207,8 +222,8 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
           {
             method: "POST",
             headers: {
+              ...headers,
               "Content-Type": "application/json",
-              "X-Seriph-Key": siteKey!,
             },
             body: JSON.stringify({
               authorName: formData.get("authorName"),

package/src/Form.astro

@@ -66,6 +66,17 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
     message: string;
   }
 
+  // Get or create a visitor ID for anonymous users
+  const VISITOR_KEY = "seriph_visitor_id";
+  function getVisitorId(): string {
+    let id = localStorage.getItem(VISITOR_KEY);
+    if (!id) {
+      id = crypto.randomUUID();
+      localStorage.setItem(VISITOR_KEY, id);
+    }
+    return id;
+  }
+
   // Store form load timestamps for spam detection
   const formTimestamps = new WeakMap<Element, number>();
 
@@ -121,6 +132,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
           headers: {
             "Content-Type": "application/json",
             "X-Seriph-Key": siteKey,
+            "X-Seriph-Visitor": getVisitorId(),
           },
           body: JSON.stringify(data),
         });

package/src/Reactions.astro

@@ -87,6 +87,17 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
 </div>
 
 <script>
+  // Get or create a visitor ID for anonymous users
+  const VISITOR_KEY = "seriph_visitor_id";
+  function getVisitorId(): string {
+    let id = localStorage.getItem(VISITOR_KEY);
+    if (!id) {
+      id = crypto.randomUUID();
+      localStorage.setItem(VISITOR_KEY, id);
+    }
+    return id;
+  }
+
   document.querySelectorAll("[data-seriph-reactions]").forEach((container) => {
     const endpoint = (container as HTMLElement).dataset.endpoint;
     const siteKey = (container as HTMLElement).dataset.siteKey;
@@ -94,6 +105,12 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
 
     if (!endpoint || !siteKey || !pageId) return;
 
+    const visitorId = getVisitorId();
+    const headers = {
+      "X-Seriph-Key": siteKey,
+      "X-Seriph-Visitor": visitorId,
+    };
+
     // Track which reactions the user has made (stored in localStorage)
     const storageKey = `seriph-reactions-${pageId}`;
     const userReactions = new Set<string>(
@@ -112,9 +129,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
       try {
         const response = await fetch(
           `${endpoint}/reactions/${encodeURIComponent(pageId!)}`,
-          {
-            headers: { "X-Seriph-Key": siteKey! },
-          },
+          { headers },
         );
         if (!response.ok) return;
         const data = await response.json();
@@ -146,8 +161,8 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
             {
               method: isReacted ? "DELETE" : "POST",
               headers: {
+                ...headers,
                 "Content-Type": "application/json",
-                "X-Seriph-Key": siteKey!,
               },
               body: JSON.stringify({ reactionType: type }),
             },

package/src/Subscribe.astro

@@ -87,6 +87,17 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
     message: string;
   }
 
+  // Get or create a visitor ID for anonymous users
+  const VISITOR_KEY = "seriph_visitor_id";
+  function getVisitorId(): string {
+    let id = localStorage.getItem(VISITOR_KEY);
+    if (!id) {
+      id = crypto.randomUUID();
+      localStorage.setItem(VISITOR_KEY, id);
+    }
+    return id;
+  }
+
   document.querySelectorAll("[data-seriph-subscribe]").forEach((form) => {
     form.addEventListener("submit", async (e) => {
       e.preventDefault();
@@ -127,6 +138,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
           headers: {
             "Content-Type": "application/json",
             "X-Seriph-Key": siteKey,
+            "X-Seriph-Visitor": getVisitorId(),
           },
           body: JSON.stringify(data),
         });

package/src/SubscribeForm.astro

@@ -76,6 +76,17 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
     message: string;
   }
 
+  // Get or create a visitor ID for anonymous users
+  const VISITOR_KEY = "seriph_visitor_id";
+  function getVisitorId(): string {
+    let id = localStorage.getItem(VISITOR_KEY);
+    if (!id) {
+      id = crypto.randomUUID();
+      localStorage.setItem(VISITOR_KEY, id);
+    }
+    return id;
+  }
+
   document.querySelectorAll("[data-seriph-subscribe-form]").forEach((form) => {
     form.addEventListener("submit", async (e) => {
       e.preventDefault();
@@ -105,6 +116,7 @@ const baseUrl = endpoint.replace(/\/+$/, "") + API_PATH;
           headers: {
             "Content-Type": "application/json",
             "X-Seriph-Key": siteKey,
+            "X-Seriph-Visitor": getVisitorId(),
           },
           body: JSON.stringify(data),
         });