chore: use test app host

apps/frontend/web/app/root.tsx

@@ -1,18 +1,21 @@
 import { Links, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react';
 
 import { Provider } from 'jotai';
+import { kebabCase } from 'scule';
 import { useState, useEffect } from 'react';
 
+import global from '~/layouts/global.js?raw';
+import { Toaster } from '~/components/ui/sonner';
+import { MaxPaddingTop, MaxPaddingBottom } from '~/layouts/Layout';
+
+import Tags from '~analytics/scripts';
+
 import 'virtual:uno.css';
 
 import './styles/main.css';
 import './styles/sonner.css';
 import './layouts/layout.css';
 
-import global from '~/layouts/global.js?raw';
-import { Toaster } from '~/components/ui/sonner';
-import { MaxPaddingTop, MaxPaddingBottom } from '~/layouts/Layout';
-
 export function Layout({ children }: { children: React.ReactNode }) {
   const [isClient, setIsClient] = useState(false);
 
@@ -34,6 +37,28 @@ export function Layout({ children }: { children: React.ReactNode }) {
         <link rel="mask-icon" color="#FFFFFF" href="/favicon.svg" />
         <meta name="msapplication-TileColor" content="#FFFFFF" />
         <meta name="theme-color" content="#ffffff" />
+        {Tags.slice(0, 1).map((t) =>
+          'src' in t ? (
+            <script
+              suppressHydrationWarning={true}
+              key={t.src}
+              src={t.src}
+              {...Object.fromEntries(
+                Object.entries(t.dataset ?? {}).map(([k, v]) => ['data-' + kebabCase(k), v])
+              )}
+            ></script>
+          ) : (
+            <script
+              suppressHydrationWarning={true}
+              key={t.children}
+              type={t.type}
+              dangerouslySetInnerHTML={{ __html: t.children }}
+              {...Object.fromEntries(
+                Object.entries(t.dataset ?? {}).map(([k, v]) => ['data-' + kebabCase(k), v])
+              )}
+            ></script>
+          )
+        )}
         <Meta />
         <Links />
       </head>

apps/frontend/web/env.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="unplugin-info/client" />
+/// <reference types="unplugin-analytics/client" />
 
 import type * as CSS from 'csstype';
 

apps/frontend/web/package.json

@@ -43,6 +43,7 @@
     "react-dom": "^18.3.1",
     "remix-hono": "^0.0.16",
     "remix-sitemap": "^3.2.0",
+    "scule": "^1.3.0",
     "sonner": "^1.5.0",
     "swagger-ui-react": "^5.17.14",
     "tailwind-merge": "^2.5.2",
@@ -68,8 +69,8 @@
     "unocss-preset-animations": "^1.1.0",
     "unocss-preset-flowind": "^0.0.5",
     "unocss-preset-shadcn": "^0.3.1",
-    "unplugin-analytics": "^0.0.11",
+    "unplugin-analytics": "^0.0.12",
     "unplugin-info": "^1.2.1",
     "vite-tsconfig-paths": "^4.2.1"
   }
-}
+}

apps/frontend/web/vite.config.ts

@@ -9,7 +9,7 @@ import Analytics from 'unplugin-analytics/vite';
 
 const KEEPSHARE = 'gv78k1oi';
 
-const APP_HOST = process.env.APP_HOST ?? `garden.breadio.wiki`;
+const APP_HOST = process.env.APP_HOST ?? `garden.test.breadio.wiki`;
 
 const SERVER_HOST = process.env.SERVER_HOST;
 const SERVER_PORT = process.env.SERVER_PORT;

packages/app/package.json

@@ -69,7 +69,7 @@
     "unocss": "^0.62.3",
     "unocss-preset-animations": "^1.1.0",
     "unocss-preset-shadcn": "^0.3.1",
-    "unplugin-analytics": "^0.0.11",
+    "unplugin-analytics": "^0.0.12",
     "unplugin-info": "^1.2.1"
   }
 }