feat: Add env vars to configure plausible

.github/workflows/deploy.yml

@@ -20,6 +20,9 @@ jobs:
           cache: yarn
 
       - name: Build & Deploy
+        env:
+          MERMAID_DOMAIN: 'mermaid.live'
+          MERMAID_ANALYTICS_URL: 'https://p.mermaid.live'
         run: |
           export DEPLOY=true
           [ "$GITHUB_EVENT_NAME" != "pull_request" ] && rm -rf docs/_app/

Dockerfile

@@ -16,6 +16,8 @@ FROM mermaid-live-editor-dependencies AS mermaid-live-editor-builder
 
 ARG MERMAID_RENDERER_URL
 ARG MERMAID_KROKI_RENDERER_URL
+ARG MERMAID_ANALYTICS_URL
+ARG MERMAID_DOMAIN
 
 COPY . ./
 

README.md

@@ -37,6 +37,12 @@ Default is `https://mermaid.ink`
 When building set the MERMAID_KROKI_RENDERER_URL build argument to your Kroki instance.
 Default is `https://kroki.io`
 
+### To configure Analytics
+
+When building set the MERMAID_ANALYTICS_URL build argument to your plausible instance, and MERMAID_DOMAIN to your domain.
+
+Default is empty, disabling analytics.
+
 ### Development
 
 ```bash

netlify.toml

@@ -0,0 +1,3 @@
+[build.environment]
+	MERMAID_ANALYTICS_URL = 'https://p.mermaid.live'
+  MERMAID_DOMAIN = 'mermaid.live'

src/env.d.ts

@@ -3,6 +3,8 @@
 interface ImportMetaEnv {
   readonly MERMAID_RENDERER_URL?: string;
   readonly MERMAID_KROKI_RENDERER_URL?: string;
+  readonly MERMAID_ANALYTICS_URL?: string;
+  readonly MERMAID_DOMAIN?: string;
   // more env variables...
 }
 

src/lib/util/env.ts

@@ -1,4 +1,6 @@
 export const env = {
   rendererUrl: import.meta.env.MERMAID_RENDERER_URL ?? 'https://mermaid.ink',
-  krokiRendererUrl: import.meta.env.MERMAID_KROKI_RENDERER_URL ?? 'https://kroki.io'
-};
+  krokiRendererUrl: import.meta.env.MERMAID_KROKI_RENDERER_URL ?? 'https://kroki.io',
+  analyticsUrl: import.meta.env.MERMAID_ANALYTICS_URL ?? '',
+  domain: import.meta.env.MERMAID_DOMAIN ?? 'mermaid.live'
+} as const;

src/lib/util/stats.ts

@@ -1,5 +1,6 @@
 import { browser } from '$app/environment';
 import type { AnalyticsInstance } from 'analytics';
+import { env } from './env';
 export let analytics: AnalyticsInstance | undefined;
 
 export const initAnalytics = async (): Promise<void> => {
@@ -13,10 +14,10 @@ export const initAnalytics = async (): Promise<void> => {
         app: 'mermaid-live-editor',
         plugins: [
           plausible({
-            domain: 'mermaid.live',
+            domain: env.domain,
             hashMode: false,
             // All tracked stats are public and available at https://p.mermaid.live/mermaid.live
-            apiHost: 'https://p.mermaid.live'
+            apiHost: env.analyticsUrl
           })
         ]
       });