From d26a4ae9de2aa43f1055e1b614a2b0c7c3e1b2e0 Mon Sep 17 00:00:00 2001 From: Saravana Achu Mac Date: Tue, 5 May 2026 10:49:25 -0700 Subject: [PATCH] refactor(web): use shared ui primitives --- web/src/app/(app)/chat/page.tsx | 15 ++--- web/src/app/(app)/dashboard/page.tsx | 23 +++---- web/src/app/(app)/notes/[noteId]/page.tsx | 27 +++++---- web/src/app/(app)/palace/page.tsx | 7 ++- web/src/app/(app)/prompts/page.tsx | 37 ++++++------ web/src/app/(app)/settings/page.tsx | 54 +++++++++-------- .../app/(app)/workspaces/[id]/gaps/page.tsx | 19 +++--- web/src/app/(app)/workspaces/page.tsx | 28 +++++---- web/src/app/(auth)/forgot-password/page.tsx | 14 +++-- web/src/app/(auth)/login/page.tsx | 14 +++-- web/src/app/(auth)/register/page.tsx | 14 +++-- web/src/app/globals.css | 10 +++- web/src/components/AppShell.tsx | 36 ++++++----- web/src/components/CreateNoteModal.tsx | 20 ++++--- web/src/components/CreateWorkspaceModal.tsx | 15 +++-- web/src/components/ExtractedTasksPanel.tsx | 32 +++++----- web/src/components/IntakeUrlBar.tsx | 28 ++++----- web/src/components/KnowledgeGraphView.tsx | 15 ++--- web/src/components/LinkNoteModal.tsx | 32 +++++----- web/src/components/PalacePanel.tsx | 11 ++-- web/src/components/PalaceStats.tsx | 2 +- web/src/components/PromptResultView.tsx | 33 +++++----- web/src/components/PromptTemplateEditor.tsx | 19 +++--- web/src/components/RunPromptModal.tsx | 30 +++++----- web/src/components/ShareDialog.tsx | 60 +++++++++---------- web/src/components/SmartActionsPanel.tsx | 57 ++++++++++-------- web/src/components/SurveyBanner.tsx | 31 +++++----- web/src/components/ui/Primitives.tsx | 48 +++++++++++++++ 28 files changed, 411 insertions(+), 320 deletions(-) create mode 100644 web/src/components/ui/Primitives.tsx diff --git a/web/src/app/(app)/chat/page.tsx b/web/src/app/(app)/chat/page.tsx index 92231e2..875714e 100644 --- a/web/src/app/(app)/chat/page.tsx +++ b/web/src/app/(app)/chat/page.tsx @@ -3,6 +3,7 @@ import { useEffect, useState } from "react"; import Link from "next/link"; import { AppShell } from "@/components/AppShell"; +import { Badge, Button, Card } from "@/components/ui/Primitives"; import { chatOverWorkspace, listWorkspaceSummaries } from "@/lib/notes-client"; import type { WorkspaceSummary } from "@/lib/types"; import { toast } from "@/lib/toast"; @@ -42,9 +43,9 @@ export default function ChatPage() { Feature-flagged on backend (chat.rag_enabled)} + actions={Feature-flagged on backend (chat.rag_enabled)} > -
+ - + Ask + {answer ? (
Answer @@ -98,7 +99,7 @@ export default function ChatPage() { ) : null}
) : null} -
+
); } diff --git a/web/src/app/(app)/dashboard/page.tsx b/web/src/app/(app)/dashboard/page.tsx index f246c1f..3e69883 100644 --- a/web/src/app/(app)/dashboard/page.tsx +++ b/web/src/app/(app)/dashboard/page.tsx @@ -5,6 +5,7 @@ import { useRouter, useSearchParams } from "next/navigation"; import { Suspense, useEffect, useState } from "react"; import { AppShell } from "@/components/AppShell"; import { CreateNoteModal } from "@/components/CreateNoteModal"; +import { Button, Card } from "@/components/ui/Primitives"; import { listNoteSummaries, listWorkspaceSummaries, seedOnboardingWorkspace } from "@/lib/notes-client"; import { listApprovalQueue } from "@/lib/review-client"; import { listSavedViews, type SavedView } from "@/lib/saved-views-client"; @@ -146,9 +147,9 @@ function DashboardContent() { title="Dashboard" description="Operational entry point for recent notes, active workspaces, and agent-relevant follow-ups." actions={ - + } > {summaryCards.map((card) => ( - -
{card.label}
-
{card.value}
- + + +
{card.label}
+
{card.value}
+ +
))} @@ -172,10 +175,10 @@ function DashboardContent() { Seeds a "Getting started" workspace with sample notes and one agent item in the review queue (backend flag{" "} onboarding.seed_enabled).

- + Seed sample workspace + ) : null} diff --git a/web/src/app/(app)/notes/[noteId]/page.tsx b/web/src/app/(app)/notes/[noteId]/page.tsx index 157f453..159fd2c 100644 --- a/web/src/app/(app)/notes/[noteId]/page.tsx +++ b/web/src/app/(app)/notes/[noteId]/page.tsx @@ -13,6 +13,7 @@ import { ArtifactPanel } from "@/components/ArtifactPanel"; import { AgentTimeline } from "@/components/AgentTimeline"; import { SmartActionsPanel } from "@/components/SmartActionsPanel"; import { LinkNoteModal } from "@/components/LinkNoteModal"; +import { Badge, Button } from "@/components/ui/Primitives"; import { archiveNote, createNoteArtifact, @@ -229,31 +230,31 @@ export default function NoteDetailPage() { actions={
{isSaving ? ( -
Saving
+ Saving ) : ( {`Review: ${note.metadata.reviewState}`} )} - - + - + - + - + + {note.status === "archived" ? ( - + ) : ( - + )}
} diff --git a/web/src/app/(app)/palace/page.tsx b/web/src/app/(app)/palace/page.tsx index f6b252b..a6026a7 100644 --- a/web/src/app/(app)/palace/page.tsx +++ b/web/src/app/(app)/palace/page.tsx @@ -2,6 +2,7 @@ import { useEffect, useState } from "react"; import { AppShell } from "@/components/AppShell"; +import { Button } from "@/components/ui/Primitives"; import { PalacePanel } from "@/components/PalacePanel"; import { PalaceStats } from "@/components/PalaceStats"; import { KnowledgeGraphView } from "@/components/KnowledgeGraphView"; @@ -63,14 +64,14 @@ export default function PalacePage() { diff --git a/web/src/app/(app)/prompts/page.tsx b/web/src/app/(app)/prompts/page.tsx index 7d8d9e9..5664c31 100644 --- a/web/src/app/(app)/prompts/page.tsx +++ b/web/src/app/(app)/prompts/page.tsx @@ -3,6 +3,7 @@ import { useEffect, useState } from "react"; import { Sparkles, FileText, Image, Layers, Trash2 } from "lucide-react"; import { AppShell } from "@/components/AppShell"; +import { Badge, Button, Card } from "@/components/ui/Primitives"; import { listPromptTemplates, deletePromptTemplate } from "@/lib/prompt-client"; import { toast } from "@/lib/toast"; import type { PromptTemplate, PromptCategory } from "@/lib/types"; @@ -66,29 +67,31 @@ export default function PromptsPage() { title="Prompt Templates" description="Browse built-in and custom Smart Action templates." actions={ -
+ {templates.length} templates -
+ } > {/* Category filter */}
- + {categories.map((cat) => ( - + ))}
@@ -106,13 +109,13 @@ export default function PromptsPage() { {builtIn.map((t) => { const Icon = INPUT_ICONS[t.inputType] ?? FileText; return ( -
+
{t.name} - {CATEGORY_LABELS[t.category]} + {CATEGORY_LABELS[t.category]}

{t.description}

@@ -120,7 +123,7 @@ export default function PromptsPage() { · Output: {t.outputType}
-
+ ); })} @@ -135,20 +138,20 @@ export default function PromptsPage() { {custom.map((t) => { const Icon = INPUT_ICONS[t.inputType] ?? FileText; return ( -
+
{t.name} - +

{t.description}

@@ -156,7 +159,7 @@ export default function PromptsPage() { · Output: {t.outputType}
-
+ ); })} diff --git a/web/src/app/(app)/settings/page.tsx b/web/src/app/(app)/settings/page.tsx index 29fe051..08efacf 100644 --- a/web/src/app/(app)/settings/page.tsx +++ b/web/src/app/(app)/settings/page.tsx @@ -4,6 +4,7 @@ import { useState } from "react"; import { useTheme } from "@/lib/use-theme"; import { useAuth } from "@/lib/auth"; import { AppShell } from "@/components/AppShell"; +import { Button, Card } from "@/components/ui/Primitives"; import { getFeedbackClient } from "@/lib/feedback-client"; import { toast } from "@/lib/toast"; import { NOTES_API_URL, PLATFORM_SERVICE_URL, MCP_SERVER_URL, PRODUCT_ID } from "@/lib/product-config"; @@ -64,57 +65,57 @@ export default function SettingsPage() { title="Settings" description="Account, preferences, feedback, and session management." actions={ - + } >
{/* Profile */} -
+ Profile
{user?.name ?? "—"} · {user?.email ?? "—"} · {user?.role ?? "—"}
-
+ {/* Appearance */} -
+
Appearance
Switch between dark and light mode
- -
+ + {/* Change password */} -
+ Change password {error &&
{error}
} {success &&
{success}
}
setCurrentPassword(e.target.value)} required /> setNewPassword(e.target.value)} required /> - +
-
+ {/* Danger zone */} -
+ Danger zone - -
+ +
@@ -155,9 +156,9 @@ MCP API base: ${MCP_SERVER_URL} Failed writes are retried from local storage via @bytelyst/offline-queue (storage key{" "} {`${PRODUCT_ID}_offline_queue`}). Reload or return online to flush.

- +
{/* Feedback */} @@ -185,13 +186,14 @@ MCP API base: ${MCP_SERVER_URL} setFeedbackTitle(e.target.value)} />