update

TODO.md

@@ -25,15 +25,13 @@
  - [ ] Add Integrations:
     - [ ] Analytics for:
          - [x] Amplitude
-         - [ ] Aptabase
-         - [ ] Burst Statistics
-         - [ ] Fathom
+         - [x] Fathom
          - [x] Matomo (aka Piwik)
-         - [ ] Metrical
-         - [ ] Minimalanalytics
+         - [x] Metrical
+         - [x] Minimalanalytics
          - [x] Plausible
-         - [ ] Simple Analytics
-         - [ ] Swetrix Analytics
+         - [x] Simple Analytics
+         - [x] Swetrix Analytics
          - [ ] Tianji
          - [x] Umami
     - [ ] Feedback:

config.json

@@ -1,4 +1,18 @@
 {
+    "HeaderItems": [
+        {
+            "text": "Link",
+            "link": "#"
+        },
+        {
+            "text": "Link",
+            "link": "#"
+        },
+        {
+            "text": "Link",
+            "link": "#"
+        }
+    ],
     "SidebarItems": [
         {
             "heading": "Heading"

package.json

@@ -32,6 +32,8 @@
     "docker:push": "docker push ark.sudovanilla.org/korbs/butterlyvu:arm64"
   },
   "dependencies": {
+    "@aptabase/react": "^0.3.3",
+    "@aptabase/web": "^0.4.2",
     "@astrojs/mdx": "^3.0.1",
     "@astrojs/node": "^8.2.5",
     "@astrojs/partytown": "^2.1.0",

src/components/Sidebar.astro

@@ -1,5 +1,5 @@
 ---
-import { SidebarItems } from '../../sidebar.json'
+import { SidebarItems } from '../../config.json'
 ---
 
 <div class="sidebar">

src/components/global/Analytics.astro

@@ -8,7 +8,15 @@ import {
     PLAUSIBLE_SRC,
     UMAMI_ID,
     UMAMI_SRC,
-    AMPLITUDE_APIKEY
+    AMPLITUDE_APIKEY,
+    METRICAL_APP,
+    FATHOM_SITE,
+    FATHOM_SRC,
+    MINIAML_ID,
+    SWETRIX_SRC,
+    SWETRIX_API,
+    SWETRIX_PROJECT_ID,
+    SIMPLEANALYTICS_DOMAIN
 } from '@utils/GetConfig'
 
 // Get Astro Analytics
@@ -21,22 +29,40 @@ import {
     Amplitude,
     Matomo,
     MinimalAnalytics
-} from 'astro-analytics';
+} from 'astro-analytics'
 ---
 
 <!-- https://gist.sudovanilla.org/Korbs/fac0f5b99a6e43679c1d38d614721b5e -->
 { 
-    ()=> {
-      if (ANALYTICS === "None") {
-        return null
-      } else if (ANALYTICS === "Plausible") {
-        <Plausible domain={PLAUSIBLE_DOMAIN} src={PLAUSIBLE_SRC + "/yoursript.js"} />
-      } else if (ANALYTICS === "Umami") {
-        <Umami id="4fb7fa4c-5b46-438d-94b3-3a8fb9bc2e8b" src={UMAMI_SRC + "/umami.js"} />
-      } else if (ANALYTICS === "Amplitude") {
-        <Amplitude apiKey={AMPLITUDE_APIKEY} />
-      } else if (ANALYTICS === "Matomo") {
-        <Matomo id={MATOMO_ID} src={MATOMO_SRC} />
-      }
+  ()=> {
+    if (ANALYTICS === "None") {
+      return null
+    } else if (ANALYTICS === "Plausible") {
+      <Plausible domain={PLAUSIBLE_DOMAIN} src={PLAUSIBLE_SRC + "/yoursript.js"} />
+    } else if (ANALYTICS === "Umami") {
+      <Umami id="4fb7fa4c-5b46-438d-94b3-3a8fb9bc2e8b" src={UMAMI_SRC + "/umami.js"} />
+    } else if (ANALYTICS === "Amplitude") {
+      <Amplitude apiKey={AMPLITUDE_APIKEY} />
+    } else if (ANALYTICS === "Matomo") {
+      <Matomo id={MATOMO_ID} src={MATOMO_SRC} />
+    } else if (ANALYTICS === "Metrical") {
+      <Metrical app={METRICAL_APP} />
+    } else if (ANALYTICS === "Fathom") {
+      <Fathom site={FATHOM_SITE} src={FATHOM_SRC} />
+    } else if (ANALYTICS === "MinimalAnalytics") {
+      <MinimalAnalytics id={MINIAML_ID} />
+    } else if (ANALYTICS === "Swetrix") {
+      <script is:inline src={SWETRIX_SRC} defer></script>
+      <script is:inline>
+        document.addEventListener('DOMContentLoaded', function () {
+          swetrix.init({SWETRIX_PROJECT_ID})
+          swetrix.trackViews()
+        })
+      </script>
+      <noscript><img src={SWETRIX_API + '/log/noscript?pid=' + SWETRIX_PROJECT_ID} alt="" referrerpolicy="no-referrer-when-downgrade" /></noscript>
+    } else if (ANALYTICS === "Simple Analytics") {
+      <script is:inline async defer data-hostname={SIMPLEANALYTICS_DOMAIN} src="https://scripts.simpleanalyticscdn.com/latest.js"></script>
+      <noscript><img src={'https://queue.simpleanalyticscdn.com/noscript.gif?hostname=' + SIMPLEANALYTICS_DOMAIN} alt="" referrerpolicy="no-referrer-when-downgrade" /></noscript>
     }
   }
+}

src/components/global/Head.astro

@@ -12,6 +12,7 @@ import Analytics from "@components/global/Analytics.astro"
 
   <!-- tells dark reader that the site has a dark theme and to turn itself off -->
   <meta name="darkreader-lock" />
+  
   <!-- Options -->
   <meta charset="UTF-8" />
   <meta name="theme-color" content="#000000" />

src/components/global/Header.astro

@@ -1,11 +1,11 @@
 ---
 // Environment Variables
 import {
-    SITE_NAME,
-    META_COLOR,
-    COLOR,
-    THEME
+    SITE_NAME
 } from '@utils/GetConfig'
+
+// Configuration
+import { HeaderItems } from '../../../config.json'
 ---
 
 <header>
@@ -14,9 +14,9 @@ import {
             <h2><a style="text-decoration: none;" href="/">{SITE_NAME}</a></h2>
         </div>
         <div class="end">
-            <a href="#">Link</a>
-            <a href="#">Social</a>
-            <a href="#">Status</a>
+            {HeaderItems.map((item) => (
+                <a href={item.link}>{item.text}</a>
+            ))}
         </div>
     </div>
 </header>

src/utils/GetConfig.js

@@ -25,3 +25,11 @@ export var PLAUSIBLE_SRC = import.meta.env.PLAUSIBLE_SRC;
 export var UMAMI_ID = import.meta.env.UMAMI_ID;
 export var UMAMI_SRC = import.meta.env.UMAMI_SRC;
 export var AMPLITUDE_APIKEY = import.meta.env.AMPLITUDE_APIKEY;
+export var METRICAL_APP = import.meta.env.METRICAL_APP;
+export var FATHOM_SITE = import.meta.env.FATHOM_SITE;
+export var FATHOM_SRC = import.meta.env.FATHOM_SRC;
+export var MINIAML_ID = import.meta.env.MINIAML_ID;
+export var SWETRIX_SRC = import.meta.env.SWETRIX_SRC;
+export var SWETRIX_API = import.meta.env.SWETRIX_API;
+export var SWETRIX_PROJECT_ID = import.meta.env.SWETRIX_PROJECT_ID;
+export var SIMPLEANALYTICS_DOMAIN = import.meta.env.SIMPLEANALYTICS_DOMAIN;