From c38bfae16c03fdeff1991a66eaea6e5f8d463f14 Mon Sep 17 00:00:00 2001
From: Jason Woltje <jason@diversecanvas.com>
Date: Fri, 27 Feb 2026 10:59:04 +0000
Subject: [PATCH] fix(web): fix personalities page dark mode theming and wire
 to API (#540)

Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
---
 apps/web/src/components/ui/select.tsx | 6 +++---
 apps/web/src/lib/api/client.ts        | 5 +++++
 apps/web/src/lib/api/personalities.ts | 5 +++--
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/apps/web/src/components/ui/select.tsx b/apps/web/src/components/ui/select.tsx
index eb7cab7..41f84d0 100644
--- a/apps/web/src/components/ui/select.tsx
+++ b/apps/web/src/components/ui/select.tsx
@@ -91,7 +91,7 @@ export function SelectTrigger({
       onClick={() => {
         setIsOpen(!isOpen);
       }}
-      className={`flex h-10 w-full items-center justify-between rounded-md border border-gray-300 bg-white px-3 py-2 text-sm ${className}`}
+      className={`flex h-10 w-full items-center justify-between rounded-md border border-border bg-bg px-3 py-2 text-sm text-text ${className}`}
     >
       {children}
     </button>
@@ -110,7 +110,7 @@ export function SelectContent({ children }: SelectContentProps): React.JSX.Eleme
   if (!isOpen) return null;
 
   return (
-    <div className="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-md border border-gray-300 bg-white shadow-lg">
+    <div className="absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-md border border-border bg-surface shadow-md">
       {children}
     </div>
   );
@@ -122,7 +122,7 @@ export function SelectItem({ value, children }: SelectItemProps): React.JSX.Elem
   return (
     <div
       onClick={() => onValueChange?.(value)}
-      className="cursor-pointer px-3 py-2 text-sm hover:bg-gray-100"
+      className="cursor-pointer px-3 py-2 text-sm text-text hover:bg-surface-2"
     >
       {children}
     </div>
diff --git a/apps/web/src/lib/api/client.ts b/apps/web/src/lib/api/client.ts
index e407fcd..9d4d158 100644
--- a/apps/web/src/lib/api/client.ts
+++ b/apps/web/src/lib/api/client.ts
@@ -250,6 +250,11 @@ export async function apiRequest<T>(endpoint: string, options: ApiRequestOptions
       throw new Error(error.message);
     }
 
+    // 204 No Content responses have no body — return undefined cast to T
+    if (response.status === 204) {
+      return undefined as T;
+    }
+
     return await (response.json() as Promise<T>);
   } catch (err: unknown) {
     if (err instanceof DOMException && err.name === "AbortError") {
diff --git a/apps/web/src/lib/api/personalities.ts b/apps/web/src/lib/api/personalities.ts
index 624fcb8..c194202 100644
--- a/apps/web/src/lib/api/personalities.ts
+++ b/apps/web/src/lib/api/personalities.ts
@@ -73,7 +73,8 @@ export async function updatePersonality(
 
 /**
  * Delete a personality
+ * The DELETE endpoint returns 204 No Content on success.
  */
-export async function deletePersonality(id: string): Promise<Record<string, never>> {
-  return apiDelete<Record<string, never>>(`/api/personalities/${id}`);
+export async function deletePersonality(id: string): Promise<void> {
+  await apiDelete<undefined>(`/api/personalities/${id}`);
 }