Umami setup for mifi-links

src/lib/config.ts

@@ -2,6 +2,8 @@
  * App config: own-property hostnames for UTM attribution, variant hostnames, GA IDs.
  */
 
+import { ContentVariant } from './data/constants';
+
 export const OWN_PROPERTY_HOSTS = [
     'mifi.ventures',
     'cal.mifi.ventures',
@@ -9,20 +11,25 @@ export const OWN_PROPERTY_HOSTS = [
     'mifi.bio',
 ] as const;
 
-export const VARIANT_HOSTS: Record<'dev' | 'bio', string> = {
+export const VARIANT_HOSTS: Record<ContentVariant, string> = {
-    dev: 'mifi.dev',
+    [ContentVariant.DEV]: 'mifi.dev',
-    bio: 'mifi.bio',
+    [ContentVariant.BIO]: 'mifi.bio',
 };
 
-export const GA_MEASUREMENT_IDS: Record<'dev' | 'bio', string> = {
+export const GA_MEASUREMENT_IDS: Record<ContentVariant, string> = {
-    dev: 'G-P8V832WDM8',
+    [ContentVariant.DEV]: 'G-P8V832WDM8',
-    bio: 'G-885B0KYWZ1',
+    [ContentVariant.BIO]: 'G-885B0KYWZ1',
+};
+
+export const UMAMI_MEASUREMENT_IDS: Record<ContentVariant, string> = {
+    [ContentVariant.DEV]: 'ac7e751b-4ce3-49f2-80e0-f430b292b72a',
+    [ContentVariant.BIO]: 'cf44669d-10c1-4982-ad79-282aed4237e5',
 };
 
 /** theme-color meta values per variant (match tokens-{variant}.css --color-bg) */
-export const THEME_COLORS: Record<'dev' | 'bio', { light: string; dark: string }> = {
+export const THEME_COLORS: Record<ContentVariant, { light: string; dark: string }> = {
-    dev: { light: '#f5f4f8', dark: '#131118' }, // hsl(260 20% 98%) / hsl(260 18% 8%)
+    [ContentVariant.DEV]: { light: '#f5f4f8', dark: '#131118' }, // hsl(260 20% 98%) / hsl(260 18% 8%)
-    bio: { light: '#f4f6f9', dark: '#111318' }, // hsl(220 22% 98%) / hsl(220 18% 8%)
+    [ContentVariant.BIO]: { light: '#f4f6f9', dark: '#111318' }, // hsl(220 22% 98%) / hsl(220 18% 8%)
 };
 
 export const UTM_MEDIUM = 'link';

src/routes/+layout.server.ts

@@ -1,5 +1,10 @@
 import contentData from '$lib/data/links.json';
-import { VARIANT_HOSTS, GA_MEASUREMENT_IDS, THEME_COLORS } from '$lib/config';
+import {
+    VARIANT_HOSTS,
+    GA_MEASUREMENT_IDS,
+    THEME_COLORS,
+    UMAMI_MEASUREMENT_IDS,
+} from '$lib/config';
 import type { Site, ContentData, ProcessedLink } from '$lib/data/types';
 import type { LayoutServerLoad } from './$types';
 import { ContentVariant, HeroLayout } from '$lib/data/constants';
@@ -18,6 +23,7 @@ export type LayoutServerDataOut = {
     };
     variant: string;
     gaMeasurementId: string;
+    umamiMeasurementId: string;
     /** theme-color meta values for current variant */
     themeColorLight: string;
     themeColorDark: string;
@@ -67,6 +73,7 @@ export const load: LayoutServerLoad<LayoutServerDataOut> = (): LayoutServerDataO
         links: { sections },
         variant,
         gaMeasurementId: GA_MEASUREMENT_IDS[variant],
+        umamiMeasurementId: UMAMI_MEASUREMENT_IDS[variant],
         themeColorLight: themeColors.light,
         themeColorDark: themeColors.dark,
     };

src/routes/__tests__/layout.server.test.ts

@@ -1,5 +1,6 @@
 import { describe, it, expect, vi, afterEach } from 'vitest';
 import { load } from '../+layout.server';
+import { UMAMI_MEASUREMENT_IDS } from '$lib/config';
 import { ContentVariant } from '$lib/data/constants';
 import type { ContentData } from '$lib/data/types';
 
@@ -95,7 +96,9 @@ describe('+layout.server', () => {
     it('gaMeasurementId matches variant', () => {
         process.env.CONTENT_VARIANT = ContentVariant.DEV;
         expect(load().gaMeasurementId).toMatch(/^G-/);
+        expect(load().umamiMeasurementId).toBe(UMAMI_MEASUREMENT_IDS[ContentVariant.DEV]);
         process.env.CONTENT_VARIANT = ContentVariant.BIO;
         expect(load().gaMeasurementId).toMatch(/^G-/);
+        expect(load().umamiMeasurementId).toBe(UMAMI_MEASUREMENT_IDS[ContentVariant.BIO]);
     });
 });

src/routes/__tests__/layout.test.ts

@@ -15,9 +15,12 @@ describe('+layout (LayoutData)', () => {
             links: { sections: [] },
             variant: 'dev',
             gaMeasurementId: 'G-xxx',
+            umamiMeasurementId: 'UM-xxx',
         };
         expect(mockData.site).toHaveProperty('title');
         expect(mockData.site).toHaveProperty('url');
+        expect(mockData).toHaveProperty('umamiMeasurementId');
+        expect(mockData).toHaveProperty('gaMeasurementId');
         expect(mockData).toHaveProperty('variant');
         expect(mockData.links).toHaveProperty('sections');
     });