fix(apollo-vertex): address Copilot review on dashboard template

- glow-config: import the CSSProperties type from react instead of relying
  on a global React namespace.
- DashboardLoading: type children as ReactNode (explicit import) and clear
  the nested exit timer on cleanup to avoid state updates after unmount.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Author: frankkluijtmans

apps/apollo-vertex/templates/dashboard/DashboardLoading.tsx

@@ -1,12 +1,12 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { type ReactNode, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 type Phase = "logo" | "skeleton" | "done";
 
 interface DashboardLoadingProps {
-  children: React.ReactNode;
+  children: ReactNode;
   triggerReplay?: number;
 }
 
@@ -86,33 +86,39 @@ function SkeletonPhase({ exiting }: { exiting: boolean }) {
 // Plays the logo → skeleton → content intro once, then renders children.
 // It owns its phase state from mount; to replay, the parent gives it a new
 // `key` so it remounts — no resetting state in response to a prop change.
-function LoadingSequence({ children }: { children: React.ReactNode }) {
+function LoadingSequence({ children }: { children: ReactNode }) {
   const [phase, setPhase] = useState<Phase>("logo");
   const [exiting, setExiting] = useState(false);
 
   useEffect(() => {
     if (phase === "done") return;
 
+    let exitTimer: ReturnType<typeof setTimeout>;
+
     if (phase === "logo") {
-      const timer = setTimeout(() => {
+      const enterTimer = setTimeout(() => {
         setExiting(true);
-        setTimeout(() => {
+        exitTimer = setTimeout(() => {
           setExiting(false);
           setPhase("skeleton");
         }, 500);
       }, 2000);
-      return () => clearTimeout(timer);
+      return () => {
+        clearTimeout(enterTimer);
+        clearTimeout(exitTimer);
+      };
     }
 
-    if (phase === "skeleton") {
-      const timer = setTimeout(() => {
-        setExiting(true);
-        setTimeout(() => {
-          setPhase("done");
-        }, 500);
-      }, 1000);
-      return () => clearTimeout(timer);
-    }
+    const enterTimer = setTimeout(() => {
+      setExiting(true);
+      exitTimer = setTimeout(() => {
+        setPhase("done");
+      }, 500);
+    }, 1000);
+    return () => {
+      clearTimeout(enterTimer);
+      clearTimeout(exitTimer);
+    };
   }, [phase]);
 
   if (phase === "done") {

apps/apollo-vertex/templates/dashboard/glow-config.ts

@@ -1,3 +1,5 @@
+import type { CSSProperties } from "react";
+
 export interface GlowConfig {
   start: string;
   end: string;
@@ -214,22 +216,22 @@ export function cardBgStyle(
   bg: string,
   opacity: number,
   gradient: CardGradient,
-): React.CSSProperties {
+): CSSProperties {
   if (gradient.enabled) {
     const alpha = gradient.opacity / 100;
     const style = {
       "--card-bg-override": `linear-gradient(${gradient.angle}deg, color-mix(in srgb, ${gradient.start} ${alpha * 100}%, transparent), color-mix(in srgb, ${gradient.end} ${alpha * 100}%, transparent))`,
       borderColor: "transparent",
     };
     // oxlint-disable-next-line typescript-eslint(no-unsafe-type-assertion) -- CSS custom properties require assertion
-    return style as unknown as React.CSSProperties;
+    return style as unknown as CSSProperties;
   }
   const value =
     bg === "white"
       ? `rgba(255,255,255,${opacity / 100})`
       : `color-mix(in srgb, var(--${bg}) ${opacity}%, transparent)`;
   // oxlint-disable-next-line typescript-eslint(no-unsafe-type-assertion) -- CSS custom properties require assertion
-  return { "--card-bg-override": value } as unknown as React.CSSProperties;
+  return { "--card-bg-override": value } as unknown as CSSProperties;
 }
 
 export function getInsightCardClasses(