refactor(frontend): untangle the workspace store, services and trial display

frontend/src/App.tsx

@@ -1,3 +1,4 @@
+import { useLayoutEffect } from 'react';
 import { QueryClientProvider } from '@tanstack/react-query';
 import { BrowserRouter, Route, Routes } from 'react-router';
 import { Toaster } from '@/components/ui/sonner';
@@ -22,6 +23,10 @@ function App() {
   const theme = useAppStore((state) => state.theme);
   useAppLanguage();
 
+  useLayoutEffect(() => {
+    document.documentElement.classList.toggle('dark', theme === 'dark');
+  }, [theme]);
+
   return (
     <QueryClientProvider client={queryClient}>
       <BrowserRouter>

frontend/src/components/Spinner/Spinner.tsx

@@ -1,26 +1,20 @@
 import { useEffect, useState } from 'react';
 import { cn } from '@/lib/utils';
 
-const DOTS13_FRAMES = ['⣼', '⣹', '⢻', '⠿', '⡟', '⣏', '⣧', '⣶'];
-const DOTS13_INTERVAL = 80;
+const FRAMES = ['⣼', '⣹', '⢻', '⠿', '⡟', '⣏', '⣧', '⣶'];
+const FRAME_MS = 80;
 
-interface SpinnerProps {
-  frames?: string[];
-  interval?: number;
-  className?: string;
-}
-
-function Spinner({ frames = DOTS13_FRAMES, interval = DOTS13_INTERVAL, className }: SpinnerProps) {
+function Spinner({ className }: { className?: string }) {
   const [index, setIndex] = useState(0);
 
   useEffect(() => {
-    const id = setInterval(() => setIndex((current) => (current + 1) % frames.length), interval);
+    const id = setInterval(() => setIndex((current) => (current + 1) % FRAMES.length), FRAME_MS);
     return () => clearInterval(id);
-  }, [frames.length, interval]);
+  }, []);
 
   return (
     <span aria-hidden className={cn('font-mono leading-none', className)}>
-      {frames[index]}
+      {FRAMES[index]}
     </span>
   );
 }

frontend/src/components/bookmarks/BookmarkRow/BookmarkRow.tsx

@@ -4,7 +4,7 @@ import { Button } from '@/components/ui/button';
 import { Item, ItemActions, ItemContent } from '@/components/ui/item';
 import BookmarkRowSkeleton from '@/components/bookmarks/BookmarkRowSkeleton/BookmarkRowSkeleton';
 import TrialBadges from '@/components/bookmarks/TrialBadges/TrialBadges';
-import { publicTrialId } from '@/lib/trial';
+import { publicTrialId, trialTitle } from '@/lib/trial';
 import type { Trial } from '@/types/trial';
 
 interface BookmarkRowProps {
@@ -27,7 +27,7 @@ function BookmarkRow({
   onExport,
 }: BookmarkRowProps) {
   const { t } = useTranslation();
-  const title = trial?.shortTitleEn ?? trial?.officialTitleEn ?? publicTrialId(trial) ?? 'Trial';
+  const title = trialTitle(trial);
   const isPending = Boolean(isLoading) && !trial;
 
   return (