package.json

@@ -17,9 +17,7 @@
     "@astrojs/rss": "^4.0.1",
     "@astrojs/sitemap": "^3.3.1",
     "@fontsource-variable/jetbrains-mono": "^5.2.5",
-    "artalk": "^2.9.1",
     "astro": "^5.2.5",
-    "giscus": "^1.6.0",
     "ico-endec": "^0.1.6",
     "katex": "^0.16.22",
     "rehype-katex": "^7.0.1",

pnpm-lock.yaml

@@ -26,15 +26,9 @@ importers:
       '@fontsource-variable/jetbrains-mono':
         specifier: ^5.2.5
         version: 5.2.5
-      artalk:
-        specifier: ^2.9.1
-        version: 2.9.1(marked@14.1.4)
       astro:
         specifier: ^5.2.5
         version: 5.7.10(@azure/identity@4.9.1)(@types/node@22.15.3)(rollup@4.40.1)(typescript@5.8.3)(yaml@2.7.1)
-      giscus:
-        specifier: ^1.6.0
-        version: 1.6.0
       ico-endec:
         specifier: ^0.1.6
         version: 0.1.6
@@ -801,12 +795,6 @@ packages:
   '@jridgewell/trace-mapping@0.3.9':
     resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
 
-  '@lit-labs/ssr-dom-shim@1.4.0':
-    resolution: {integrity: sha512-ficsEARKnmmW5njugNYKipTm4SFnbik7CXtoencDZzmzo/dQ+2Q0bgkzJuoJP20Aj0F+izzJjOqsnkd6F/o1bw==}
-
-  '@lit/reactive-element@2.1.1':
-    resolution: {integrity: sha512-N+dm5PAYdQ8e6UlywyyrgI2t++wFGXfHx+dSJ1oBrg6FAxUj40jId++EaRm80MKX5JnlH1sBsyZ5h0bcZKemCg==}
-
   '@mdx-js/mdx@3.1.0':
     resolution: {integrity: sha512-/QxEhPAvGwbQmy1Px8F899L5Uc2KZ6JtXwlCgJmjSTBedwOZkByYcBG4GceIGPXRDsmfxhHazuS+hlOShRLeDw==}
 
@@ -1046,9 +1034,6 @@ packages:
   '@types/tmp@0.0.33':
     resolution: {integrity: sha512-gVC1InwyVrO326wbBZw+AO3u2vRXz/iRWq9jYhpG4W8LXyIgDv3ZmcLQ5Q4Gs+gFMyqx+viFoFT+l3p61QFCmQ==}
 
-  '@types/trusted-types@2.0.7':
-    resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
-
   '@types/unist@2.0.11':
     resolution: {integrity: sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==}
 
@@ -1132,11 +1117,6 @@ packages:
   array-iterate@2.0.1:
     resolution: {integrity: sha512-I1jXZMjAgCMmxT4qxXfPXa6SthSoE8h6gkSI9BGGNv8mP8G/v0blc+qFnZu6K42vTOiuME596QaLO0TP3Lk0xg==}
 
-  artalk@2.9.1:
-    resolution: {integrity: sha512-IFo9XqWDalsHy8BsmMA5SSB9bozBa/sBhTm/+O5KwA6DnC95lFKv7C6ScMx/Xa4ue5qSQ7VV5vxRgCh/raohkQ==}
-    peerDependencies:
-      marked: ^14.1.0
-
   as-table@1.0.55:
     resolution: {integrity: sha512-xvsWESUJn0JN421Xb9MQw6AsMHRCUknCe0Wjlxvjud80mU4E6hQf1A6NzQKcYNmYw62MfzEtXc+badstZP3JpQ==}
 
@@ -1759,9 +1739,6 @@ packages:
     resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==}
     engines: {node: '>=10'}
 
-  giscus@1.6.0:
-    resolution: {integrity: sha512-Zrsi8r4t1LVW950keaWcsURuZUQwUaMKjvJgTCY125vkW6OiEBkatE7ScJDbpqKHdZwb///7FVC21SE3iFK3PQ==}
-
   github-from-package@0.0.0:
     resolution: {integrity: sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==}
 
@@ -2068,15 +2045,6 @@ packages:
     resolution: {integrity: sha512-7W0vV3rqv5tokqkBAFV1LbR7HPOWzXQDpDgEuib/aJ1jsZZx6x3c2mBI+TJhJzOhkGeaLbCKEHXEXLfirtG2JA==}
     engines: {node: '>=18'}
 
-  lit-element@4.2.1:
-    resolution: {integrity: sha512-WGAWRGzirAgyphK2urmYOV72tlvnxw7YfyLDgQ+OZnM9vQQBQnumQ7jUJe6unEzwGU3ahFOjuz1iz1jjrpCPuw==}
-
-  lit-html@3.3.1:
-    resolution: {integrity: sha512-S9hbyDu/vs1qNrithiNyeyv64c9yqiW9l+DBgI18fL+MTvOtWoFR0FWiyq1TxaYef5wNlpEmzlXoBlZEO+WjoA==}
-
-  lit@3.3.1:
-    resolution: {integrity: sha512-Ksr/8L3PTapbdXJCk+EJVB78jDodUMaP54gD24W186zGRARvwrsPfS60wae/SSCTCNZVPd1chXqio1qHQmu4NA==}
-
   lodash.includes@4.3.0:
     resolution: {integrity: sha512-W3Bx6mdkRTGtlJISOvVD/lbqjTlPPUDTMnlXZFnVwi9NKJ6tiAk6LVdlhZMm17VZisqhKcgzpO5Wz91PCt5b0w==}
 
@@ -2124,11 +2092,6 @@ packages:
   markdown-table@3.0.4:
     resolution: {integrity: sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==}
 
-  marked@14.1.4:
-    resolution: {integrity: sha512-vkVZ8ONmUdPnjCKc5uTRvmkRbx4EAi2OkTOXmfTDhZz3OFqMNBM1oTTWwTr4HY4uAEojhzPf+Fy8F1DWa3Sndg==}
-    engines: {node: '>= 18'}
-    hasBin: true
-
   math-intrinsics@1.1.0:
     resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
     engines: {node: '>= 0.4'}
@@ -4048,12 +4011,6 @@ snapshots:
       '@jridgewell/resolve-uri': 3.1.2
       '@jridgewell/sourcemap-codec': 1.5.0
 
-  '@lit-labs/ssr-dom-shim@1.4.0': {}
-
-  '@lit/reactive-element@2.1.1':
-    dependencies:
-      '@lit-labs/ssr-dom-shim': 1.4.0
-
   '@mdx-js/mdx@3.1.0(acorn@8.14.1)':
     dependencies:
       '@types/estree': 1.0.7
@@ -4291,8 +4248,6 @@ snapshots:
 
   '@types/tmp@0.0.33': {}
 
-  '@types/trusted-types@2.0.7': {}
-
   '@types/unist@2.0.11': {}
 
   '@types/unist@3.0.3': {}
@@ -4354,10 +4309,6 @@ snapshots:
 
   array-iterate@2.0.1: {}
 
-  artalk@2.9.1(marked@14.1.4):
-    dependencies:
-      marked: 14.1.4
-
   as-table@1.0.55:
     dependencies:
       printable-characters: 1.0.42
@@ -5090,10 +5041,6 @@ snapshots:
 
   get-stream@6.0.1: {}
 
-  giscus@1.6.0:
-    dependencies:
-      lit: 3.3.1
-
   github-from-package@0.0.0: {}
 
   github-slugger@2.0.0: {}
@@ -5502,22 +5449,6 @@ snapshots:
     dependencies:
       package-json: 10.0.1
 
-  lit-element@4.2.1:
-    dependencies:
-      '@lit-labs/ssr-dom-shim': 1.4.0
-      '@lit/reactive-element': 2.1.1
-      lit-html: 3.3.1
-
-  lit-html@3.3.1:
-    dependencies:
-      '@types/trusted-types': 2.0.7
-
-  lit@3.3.1:
-    dependencies:
-      '@lit/reactive-element': 2.1.1
-      lit-element: 4.2.1
-      lit-html: 3.3.1
-
   lodash.includes@4.3.0: {}
 
   lodash.isboolean@3.0.3: {}
@@ -5557,8 +5488,6 @@ snapshots:
 
   markdown-table@3.0.4: {}
 
-  marked@14.1.4: {}
-
   math-intrinsics@1.1.0: {}
 
   md5@2.3.0:

src/components/Comments.astro

@@ -2,17 +2,55 @@
 import {siteConfig} from "../config";
 import FediverseComments from "./helper/comments/Fediverse.astro";
 import HatsuComments from "./helper/comments/Hatsu.astro";
-import Artalk from "./helper/comments/Artalk.astro";
-import Giscus from "./helper/comments/Giscus.astro";
 
 const method = siteConfig.comments.type
-
+const ArtalkConfig = siteConfig.comments.artalk
+const giscusConfig = siteConfig.comments.giscus
 const FediverseConfig = siteConfig.comments.fediverse
+interface Props {
+    path?: string;
+}
 
+let { path='/' } = Astro.props;
 ---
-{method === 'artalk' && <Artalk />}
+{method === 'artalk' &&
-{method === 'giscus' && <Giscus />}
+    <div>
+        <!-- CSS -->
+        <link href={`https://${ArtalkConfig.instanceDomain}/dist/Artalk.css`} rel="stylesheet">
+
+        <!-- JS -->
+        <script src={`https://${ArtalkConfig.instanceDomain}/dist/Artalk.js`}></script>
+
+        <!-- Artalk -->
+        <div id="Comments"></div>
+        <script define:vars={{ instanceDomain: ArtalkConfig.instanceDomain, pagePath: path }}>
+                Artalk.init({
+                    el: '#Comments',
+                    pageKey: pagePath, // Using the passed variable
+                    server: `https://${instanceDomain}`, // Using the passed variable
+                })
+        </script>
+    </div>
+}
+{method === 'giscus' && (
+    <script
+      src="https://giscus.app/client.js"
+      data-repo={giscusConfig.repo}
+      data-repo-id={giscusConfig.repoId}
+      data-category={giscusConfig.category}
+      data-category-id={giscusConfig.categoryId}
+      data-mapping={giscusConfig.mapping}
+      data-strict={giscusConfig.strict}
+      data-reactions-enabled={giscusConfig.reactionsEnabled}
+      data-emit-metadata={giscusConfig.emitMetadata}
+      data-input-position={giscusConfig.inputPosition}
+      data-theme={giscusConfig.theme}
+      data-lang={giscusConfig.lang}
+      crossorigin="anonymous"
+      async
+    ></script>
+)}
 <!-- if prerender === true is set then render from client -->
-{(method === 'fediverse' && !FediverseConfig.renderOnServer ) && <FediverseComments /> }
+{(method === 'fediverse' && !FediverseConfig.renderOnServer ) && <FediverseComments path={path} /> }
-{(method === 'fediverse' && FediverseConfig.renderOnServer ) && <FediverseComments server:defer><p>Loading comments...</p></FediverseComments> }
+{(method === 'fediverse' && FediverseConfig.renderOnServer ) && <FediverseComments server:defer path={path} ><p>Loading comments...</p></FediverseComments> }
 {method === 'hatsu' && <HatsuComments /> }

src/components/helper/comments/Artalk.astro

@@ -1,20 +0,0 @@
----
-import {siteConfig} from "../../../config";
-import 'artalk/Artalk.css';
-const ArtalkInstanceDomain = siteConfig.comments.artalk.instanceDomain
----
-<div>
-    <!-- Artalk -->
-    <div id="comments" data-path={Astro.url.pathname} data-server={ArtalkInstanceDomain}></div>
-    <script>
-        import Artalk from "artalk";
-        const atkElement = document.querySelector('#comments');
-        Artalk.init({
-            el: '#comments',
-            pageKey: atkElement?.getAttribute('data-path') || window.location.pathname,
-            server: `https://${atkElement?.getAttribute('data-server')}`,
-            darkMode: "auto",
-            versionCheck: false
-        });
-    </script>
-</div>

src/components/helper/comments/Fediverse.astro

@@ -14,8 +14,15 @@ const {
 
 const serverRender = fediverseConfig.renderOnServer
 
+interface Props {
+  path: string;
+}
+
+const { path } = Astro.props;
+
 // Create the full URL to search for
-const postUrl = Astro.url.href;
+const fullSiteUrl = Astro.url.host;
+const postUrl = `https://${fullSiteUrl}${path.startsWith('/') ? path : '/' + path}`;
 
 // Define the search API endpoint based on configuration
 let searchEndpoint: string;

src/components/helper/comments/Giscus.astro

@@ -1,24 +0,0 @@
----
-import {siteConfig} from "../../../config";
-
-const giscusConfig = siteConfig.comments.giscus
----
-<giscus-widget
-        repo={giscusConfig.repo}
-        repoid={giscusConfig.repoId}
-        category={giscusConfig.category}
-        categoryid={giscusConfig.categoryId}
-        mapping={giscusConfig.mapping}
-        strict={giscusConfig.strict}
-        term={giscusConfig.term}
-        reactionsEnabled={giscusConfig.reactionsEnabled}
-        emitMetadata={giscusConfig.emitMetadata}
-        inputPosition={giscusConfig.inputPosition}
-        theme={giscusConfig.theme}
-        lang={giscusConfig.lang}
-        crossorigin="anonymous"
-        loading="lazy"
-></giscus-widget>
-<script>
-    import 'giscus';
-</script>

src/config.ts

@@ -54,7 +54,6 @@ export const siteConfig = {
             category:"[ENTER CATEGORY NAME HERE]",
             categoryId:"[ENTER CATEGORY ID HERE]",
             mapping:"pathname",
-            term: "Welcome to comment powered by @giscus",
             strict:"0",
             reactionsEnabled:"1",
             emitMetadata:"0",

src/pages/blog/[...slug].astro

@@ -62,7 +62,7 @@ const cover = customFeaturedImage || matchedImage_src?.src || firstImageURL || `
     <ReplyViaEmail title={entry.data.title} email={authorInfo.email} />
         <br>
     <a href="/blog">&larr; Back to posts</a>
-    {!noscript && <h2>Comments</h2> <Comments />}
+    {!noscript && <h2>Comments</h2> <Comments path={`blog/${slug}`} />}
     {!noscript &&
         <script>
             import "katex/dist/contrib/copy-tex.js"