+
+
+
+
+ )}
+
+
+
+
+
+
+ {!isMobile && (
+
+
+)
+
+function buildSpotlightCatalog(
+ router: ReturnType
+ ),
+ onOpen: () => {
+ track("mcp")
+ void router.push("/?view=integrations")
+ },
+ },
+ {
+ id: "coding-claude-supermemory",
+ title: "Claude Supermemory",
+ description:
+ "Persistent memory for Claude Code — context and decisions across sessions.",
+ icon: spotlightPluginCornerIcon(
+ "/images/plugins/claude-code.svg",
+ "Claude Supermemory",
+ ),
+ pro: true,
+ onOpen: () => {
+ track("plugin_claude_supermemory")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "coding-opencode",
+ title: "OpenCode",
+ description:
+ "Memory layer for OpenCode — search past sessions and inject context.",
+ icon: spotlightPluginCornerIcon(
+ "/images/plugins/opencode.svg",
+ "OpenCode",
+ ),
+ pro: true,
+ onOpen: () => {
+ track("plugin_opencode")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "connections",
+ title: "Connections",
+ description:
+ "Link Notion, Google Drive, or OneDrive to import your docs",
+ icon: spotlightConnectionsIcon,
+ pro: true,
+ onOpen: () => {
+ track("connections")
+ void router.push("/?view=integrations&integration=connections")
+ },
+ },
+ ],
+ productivity: [
+ {
+ id: "chrome",
+ title: "Chrome Extension",
+ description:
+ "Save any webpage, import bookmarks, sync ChatGPT memories",
+ icon: 
,
+ onOpen: () => {
+ track("import_x")
+ void router.push("/?view=integrations&integration=import")
+ },
+ },
+ ],
+ agents: [
+ {
+ id: "agents-openclaw",
+ title: "OpenClaw",
+ description:
+ "Multi-platform memory for OpenClaw — Telegram, WhatsApp, Discord, Slack, and more.",
+ icon: spotlightPluginCornerIcon(
+ "/images/plugins/openclaw.svg",
+ "OpenClaw",
+ ),
+ pro: true,
+ onOpen: () => {
+ track("plugin_openclaw")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "agents-hermes",
+ title: "Hermes",
+ description:
+ "Memory layer for the Hermes agent — recall, capture, and user profile.",
+ icon: spotlightPluginCornerIcon("/images/plugins/hermes.svg", "Hermes"),
+ onOpen: () => {
+ track("plugin_hermes")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "agents-claude-supermemory",
+ title: "Claude Supermemory",
+ description:
+ "Persistent memory for Claude Code — context and decisions across sessions.",
+ icon: spotlightPluginCornerIcon(
+ "/images/plugins/claude-code.svg",
+ "Claude Supermemory",
+ ),
+ pro: true,
+ onOpen: () => {
+ track("plugin_claude_supermemory")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "agents-opencode",
+ title: "OpenCode",
+ description:
+ "Memory layer for OpenCode — search past sessions and inject context.",
+ icon: spotlightPluginCornerIcon(
+ "/images/plugins/opencode.svg",
+ "OpenCode",
+ ),
+ pro: true,
+ onOpen: () => {
+ track("plugin_opencode")
+ openPluginsPanel()
+ },
+ },
+ {
+ id: "console-api",
+ title: "Console & API",
+ description:
+ "API keys, orgs, and the hosted API for production agent workloads",
+ icon:
-
-
- )
-}
-
-export default function SetupPage() {
- const { memoryFormData, currentStep, goToStep } = useSetupContext()
- const isMobile = useIsMobile()
-
- const renderStep = () => {
- switch (currentStep) {
- case "relatable":
- return
type DocumentWithMemories = DocumentsResponse["documents"][0]
+function subscribeViewportWidth(cb: () => void) {
+ window.addEventListener("resize", cb)
+ return () => window.removeEventListener("resize", cb)
+}
+
+function getViewportWidth() {
+ return window.innerWidth
+}
+
+const GRADIENT_TOP_WIDTH_MAX = 1440
+
+function gradientTopPositionForWidth(width: number) {
+ const minW = 320
+ const pctWide = 15
+ const pctNarrow = 70
+ const w = Math.min(GRADIENT_TOP_WIDTH_MAX, Math.max(minW, width))
+ const t = (w - minW) / (GRADIENT_TOP_WIDTH_MAX - minW)
+ const eased = t * t
+ return `${Math.round(pctNarrow + eased * (pctWide - pctNarrow))}%`
+}
+
function ViewErrorFallback() {
return (
Loading...
+ // biome-ignore lint/a11y/noStaticElementInteractions: full-surface drag-and-drop for resume PDF
+ {
+ e.preventDefault()
+ setIsDragging(true)
+ }}
+ onDragLeave={() => setIsDragging(false)}
+ onDrop={handleDrop}
+ >
+
+ {isDragging && (
+
+
+ )}
+
+
+
)
}
diff --git a/apps/web/app/(app)/onboarding/setup/page.tsx b/apps/web/app/(app)/onboarding/setup/page.tsx
deleted file mode 100644
index 350352331..000000000
--- a/apps/web/app/(app)/onboarding/setup/page.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-"use client"
-
-import { motion, AnimatePresence } from "motion/react"
-
-import { RelatableQuestion } from "@/components/onboarding/setup/relatable-question"
-import { IntegrationsStep } from "@/components/onboarding/setup/integrations-step"
-
-import { SetupHeader } from "@/components/onboarding/setup/header"
-import { ChatSidebar } from "@/components/onboarding/setup/chat-sidebar"
-import { AnimatedGradientBackground } from "@/components/animated-gradient-background"
-import { useIsMobile } from "@hooks/use-mobile"
-
-import { useSetupContext, type SetupStep } from "./layout"
-
-function StepNotFound({ goToStep }: { goToStep: (step: SetupStep) => void }) {
- return (
- + Drop your PDF resume +
+
+
+
+
+
+ {/* ── IDLE ── */}
+ {status === "idle" && (
+
+
+ )}
+
+ {/* ── PROCESSING ── */}
+ {status === "processing" && (
+
+
+ )}
+
+ {/* ── DONE ── */}
+ {status === "done" && (
+
+
+ )}
+
+ {/* ── ERROR ── */}
+ {status === "error" && (
+
+
+ )}
+
+
+ Let NOVA know about you +
+ +
+
+ {detected && detected !== "resume" && (
+
+ {SOURCE_LABEL[detected as "x" | "linkedin"]}
+
+ )}
+
+
+ {!detected && (
+
+ {[
+ {
+ label: "@yourhandle",
+ action: () => {
+ handleChange("@")
+ inputRef.current?.focus()
+ },
+ },
+ {
+ label: "linkedin.com/in/you",
+ action: () => {
+ handleChange("linkedin.com/in/")
+ inputRef.current?.focus()
+ },
+ },
+ {
+ label: "Drop a PDF resume",
+ action: () => fileRef.current?.click(),
+ },
+ ].map((chip) => (
+
+ ))}
+
+ )}
+
+
+ {
+ const f = e.target.files?.[0]
+ if (f) {
+ setResumeFile(f)
+ handleSubmit("resume", f)
+ }
+ }}
+ />
+
+
+ {detected && detected !== "resume" && (
+
+ {(() => {
+ const Icon = SOURCE_ICON[detected as "x" | "linkedin"]
+ return
+ )}
+
+
+ handleChange(e.target.value)}
+ onKeyDown={(e) => {
+ if (e.key === "Enter" && canSubmit)
+ handleSubmit(detected as "x" | "linkedin")
+ }}
+ placeholder="Paste an X handle, LinkedIn URL, or drop a PDF"
+ className={cn(
+ "w-full py-3 bg-[#070E1B] border rounded-xl text-white text-sm placeholder:text-[#525966] focus:outline-none transition-all",
+ detected && detected !== "resume"
+ ? "pl-8 pr-11"
+ : "px-4 pr-11",
+ detected
+ ? "border-[#2261CA]/50 focus:border-[#2261CA]"
+ : "border-[#52596633] focus:border-white/20",
+ )}
+ />
+
+ {canSubmit && (
+ handleSubmit(detected as "x" | "linkedin")}
+ className="absolute right-1 rounded-xl size-8 flex items-center justify-center border-[0.5px] border-[#161F2C] hover:scale-[0.95] active:scale-[0.95] transition-transform cursor-pointer"
+ style={{
+ background:
+ "linear-gradient(180deg, #0D121A -26.14%, #000 100%)",
+ }}
+ >
+
+ )}
+
+
+
+
+
+ + Finishing your first save +
++ Most finish in under a minute. Below is optional — ways to add + more later. +
+
+ {/* biome-ignore lint/a11y/noStaticElementInteractions: pause category rotation on hover/focus within */}
+
+ setPauseSpotlight(true)}
+ onMouseLeave={() => setPauseSpotlight(false)}
+ onFocus={() => setPauseSpotlight(true)}
+ onBlur={(e) => {
+ if (
+ !e.currentTarget.contains(e.relatedTarget as Node | null)
+ ) {
+ setPauseSpotlight(false)
+ }
+ }}
+ >
+
+
+ {categoryCards.map((card) => (
+
+
+
+
+
+
+
+
+
+
+ {SPOTLIGHT_CATEGORY_TABS.map((tab) => (
+
+ ))}
+
+
+
+ {SPOTLIGHT_CATEGORY_TABS.map((tab) => (
+
+
+
+
+
+ {/* Document card with stamp */}
+ + It's in your memory +
++ Your first save is ready. When you want more, use Integrations + for browser, phone, editor, and AI tools — all in one place. +
+
+ {/* Clickable document card */}
+ router.push("/?view=list")}
+ className="group w-full text-left bg-[#080E18] border border-[rgba(255,255,255,0.07)] rounded-2xl p-4 cursor-pointer hover:border-[rgba(255,255,255,0.14)] transition-colors"
+ >
+ {/* Faux document lines */}
+
+
+ {/* Stamp */}
+
+
+
+
+
+
+ {/* Memory snippets */}
+
+
+
+
+
+
+
+
+
+
+ + {docTitle || "Your document"} +
+ + {memoriesCount} memories + ++ View in memories → +
+
+ {/* Ink ring ripple */}
+ {stampLanded && (
+
+
+
+
+ i
+ ? { opacity: 1, x: 0 }
+ : { opacity: 0, x: -8 }
+ }
+ transition={{ duration: 0.35, ease: "easeOut" }}
+ className="flex items-start gap-2 text-left"
+ >
+
+
+ ))}
+
+
+ {/* CTAs */}
+ + Nova learned +
+ {memorySnippets.slice(0, 3).map((snippet, i) => ( ++ {snippet} +
+
+
+
+
+ {errorMsg}
+
+
+
+
+ Unknown step
- -
-
-
-
- {isMobile &&
- )
-}
diff --git a/apps/web/app/(app)/page.tsx b/apps/web/app/(app)/page.tsx
index 9ad372ed6..9f11aa80d 100644
--- a/apps/web/app/(app)/page.tsx
+++ b/apps/web/app/(app)/page.tsx
@@ -1,9 +1,18 @@
"use client"
-import { useState, useCallback, useEffect } from "react"
+import {
+ useState,
+ useCallback,
+ useEffect,
+ useMemo,
+ useRef,
+ useSyncExternalStore,
+} from "react"
+import { AnimatePresence, motion } from "motion/react"
import { useQueryState } from "nuqs"
import { Header } from "@/components/header"
-import { ChatSidebar } from "@/components/chat"
+import { ChatSidebar, HomeChatComposer } from "@/components/chat"
+import { DashboardView } from "@/components/dashboard-view"
import { MemoriesGrid } from "@/components/memories-grid"
import { GraphLayoutView } from "@/components/graph-layout-view"
import { IntegrationsView } from "@/components/integrations-view"
@@ -15,7 +24,6 @@ import { FullscreenNoteModal } from "@/components/fullscreen-note-modal"
import type { HighlightItem } from "@/components/highlights-card"
import { HotkeysProvider } from "react-hotkeys-hook"
import { useHotkeys } from "react-hotkeys-hook"
-import { AnimatePresence } from "motion/react"
import { useIsMobile } from "@hooks/use-mobile"
import { useAuth } from "@lib/auth-context"
import { useProject } from "@/stores"
@@ -26,11 +34,14 @@ import {
useQuickNoteDraft,
} from "@/stores/quick-note-draft"
import { analytics } from "@/lib/analytics"
+import type { ModelId } from "@/lib/models"
import { useDocumentMutations } from "@/hooks/use-document-mutations"
import { useQuery, useQueryClient } from "@tanstack/react-query"
+import { toast } from "sonner"
import type { DocumentsWithMemoriesResponseSchema } from "@repo/validation/api"
import type { z } from "zod"
import { useViewMode } from "@/lib/view-mode-context"
+import type { MemoryOfDay } from "@/components/dashboard-view"
import { ErrorBoundary } from "@/components/error-boundary"
import { cn } from "@lib/utils"
import {
@@ -39,15 +50,36 @@ import {
qParam,
docParam,
fullscreenParam,
- chatParam,
integrationParam,
pluginsPanelParam,
type IntegrationParamValue,
} from "@/lib/search-params"
+import { getChatSpaceDisplayLabel } from "@/lib/chat-space-label"
type DocumentsResponse = z.infer
-
-
-
-
- )}
-
-
- {renderStep()}
-
-
- {!isMobile && (
-
@@ -68,34 +100,28 @@ function ViewErrorFallback() {
export default function NewPage() {
const isMobile = useIsMobile()
const { user, session } = useAuth()
- const {
- selectedProject,
- isNovaSpaces,
- novaContainerTags,
- selectedProjects,
- setSelectedProjects,
- } = useProject()
+
+ const { selectedProject, selectedProjects } = useProject()
const selectedProjectTag = selectedProjects[0]
- const isNovaContext =
- isNovaSpaces ||
- (selectedProjectTag !== undefined &&
- novaContainerTags.includes(selectedProjectTag))
const { allProjects } = useContainerTags()
- const emptyStateSpaceName =
- !isNovaSpaces && selectedProjectTag
- ? selectedProjectTag === DEFAULT_PROJECT_ID
- ? "My Space"
- : (allProjects.find((p) => p.containerTag === selectedProjectTag)
- ?.name ?? selectedProjectTag)
- : undefined
-
- const handleSwitchToAllSpacesFromEmptyState = useCallback(() => {
- analytics.spaceSwitched({ space_id: "nova_spaces" })
- setSelectedProjects([])
- }, [setSelectedProjects])
+ const dashboardSpaceLabel = useMemo(
+ () =>
+ getChatSpaceDisplayLabel({
+ selectedProject,
+ allProjects,
+ }),
+ [selectedProject, allProjects],
+ )
+ const emptyStateSpaceName = selectedProjectTag
+ ? selectedProjectTag === DEFAULT_PROJECT_ID
+ ? "My Space"
+ : (allProjects.find((p) => p.containerTag === selectedProjectTag)?.name ??
+ selectedProjectTag)
+ : undefined
const { viewMode, setViewMode } = useViewMode()
const queryClient = useQueryClient()
+ const [highlightsForceAt, setHighlightsForceAt] = useState(0)
// Chrome extension auth: send session token via postMessage so the content script can store it
useEffect(() => {
@@ -122,12 +148,14 @@ export default function NewPage() {
"fullscreen",
fullscreenParam,
)
- const [isChatOpen, setIsChatOpen] = useQueryState("chat", chatParam)
const [integrationFromUrl, setIntegration] = useQueryState(
"integration",
integrationParam,
)
- const [pluginsPanelFromUrl] = useQueryState("plugins", pluginsPanelParam)
+ const [pluginsPanelFromUrl, setPluginsPanel] = useQueryState(
+ "plugins",
+ pluginsPanelParam,
+ )
useEffect(() => {
if (integrationFromUrl || pluginsPanelFromUrl === true) {
@@ -138,6 +166,10 @@ export default function NewPage() {
// Ephemeral local state (not worth URL-encoding)
const [fullscreenInitialContent, setFullscreenInitialContent] = useState("")
const [queuedChatSeed, setQueuedChatSeed] = useState(null)
+ const [queuedChatModel, setQueuedChatModel] = useState(null)
+ const [queuedMessageSource, setQueuedMessageSource] = useState<
+ "highlight" | "home"
+ >("highlight")
const [selectedDocument, setSelectedDocument] =
useState(null)
@@ -177,6 +209,8 @@ export default function NewPage() {
const resetDraft = useQuickNoteDraftReset(selectedProject)
const { draft: quickNoteDraft } = useQuickNoteDraft(selectedProject || "")
+ const quickNoteDraftRef = useRef(quickNoteDraft)
+ quickNoteDraftRef.current = quickNoteDraft
const { noteMutation, bulkDeleteMutation } = useDocumentMutations({
onClose: () => {
@@ -247,20 +281,31 @@ export default function NewPage() {
const HIGHLIGHTS_CACHE_NAME = "space-highlights-v1"
const HIGHLIGHTS_MAX_AGE = 4 * 60 * 60 * 1000 // 4 hours
+ const handleResetHighlights = useCallback(async () => {
+ toast.success("Refreshing daily brief…")
+ try {
+ await caches.delete(HIGHLIGHTS_CACHE_NAME)
+ } catch {}
+ setHighlightsForceAt(Date.now())
+ }, [])
+
const { data: highlightsData, isLoading: isLoadingHighlights } =
useQuery({
- queryKey: ["space-highlights", selectedProject],
+ queryKey: ["space-highlights", selectedProject, highlightsForceAt],
queryFn: async (): Promise => {
const spaceId = selectedProject || "sm_project_default"
+ const forceRefresh = highlightsForceAt > 0
const cacheKey = `${process.env.NEXT_PUBLIC_BACKEND_URL}/v3/space-highlights?spaceId=${spaceId}`
- const cache = await caches.open(HIGHLIGHTS_CACHE_NAME)
- const cached = await cache.match(cacheKey)
- if (cached) {
- const age =
- Date.now() - Number(cached.headers.get("x-cached-at") || 0)
- if (age < HIGHLIGHTS_MAX_AGE) {
- return cached.json()
+ if (!forceRefresh) {
+ const cache = await caches.open(HIGHLIGHTS_CACHE_NAME)
+ const cached = await cache.match(cacheKey)
+ if (cached) {
+ const age =
+ Date.now() - Number(cached.headers.get("x-cached-at") || 0)
+ if (age < HIGHLIGHTS_MAX_AGE) {
+ return cached.json()
+ }
}
}
@@ -276,6 +321,7 @@ export default function NewPage() {
questionsCount: 4,
includeHighlights: true,
includeQuestions: true,
+ forceRefresh,
}),
},
)
@@ -286,13 +332,21 @@ export default function NewPage() {
const data = await response.json()
- const cacheResponse = new Response(JSON.stringify(data), {
- headers: {
- "Content-Type": "application/json",
- "x-cached-at": String(Date.now()),
- },
- })
- await cache.put(cacheKey, cacheResponse)
+ // Update browser cache with fresh data (works for both normal and forced refresh)
+ try {
+ const freshCache = await caches.open(HIGHLIGHTS_CACHE_NAME)
+ const cacheResponse = new Response(JSON.stringify(data), {
+ headers: {
+ "Content-Type": "application/json",
+ "x-cached-at": String(Date.now()),
+ },
+ })
+ await freshCache.put(cacheKey, cacheResponse)
+ } catch {}
+
+ // Reset force flag after the forced fetch completes so future project-switches
+ // use the normal cache path instead of always bypassing it.
+ if (forceRefresh) setHighlightsForceAt(0)
return data
},
@@ -300,6 +354,37 @@ export default function NewPage() {
refetchOnWindowFocus: false,
})
+ const { data: memoryOfDay = null } = useQuery({
+ queryKey: [
+ "memory-of-day",
+ user?.id,
+ new Date().toISOString().slice(0, 10),
+ ],
+ queryFn: async (): Promise => {
+ const cacheKey = `memory-of-day:${user?.id}:${new Date().toISOString().slice(0, 10)}`
+ try {
+ const stored = localStorage.getItem(cacheKey)
+ if (stored) return JSON.parse(stored) as MemoryOfDay
+ } catch {}
+
+ const response = await fetch(
+ `${process.env.NEXT_PUBLIC_BACKEND_URL}/v3/memory-of-day`,
+ { credentials: "include" },
+ )
+ if (!response.ok) return null
+ const data = (await response.json()) as MemoryOfDay | null
+ if (data) {
+ try {
+ localStorage.setItem(cacheKey, JSON.stringify(data))
+ } catch {}
+ }
+ return data
+ },
+ staleTime: 24 * 60 * 60 * 1000,
+ refetchOnWindowFocus: false,
+ enabled: !!user,
+ })
+
useHotkeys("c", () => {
analytics.addDocumentModalOpened()
setAddDoc("note")
@@ -324,7 +409,7 @@ export default function NewPage() {
const handleQuickNoteSave = useCallback(
(content: string) => {
if (content.trim()) {
- const hadPreviousContent = quickNoteDraft.trim().length > 0
+ const hadPreviousContent = quickNoteDraftRef.current.trim().length > 0
noteMutation.mutate(
{ content, project: selectedProject },
{
@@ -339,7 +424,7 @@ export default function NewPage() {
)
}
},
- [selectedProject, noteMutation, quickNoteDraft],
+ [selectedProject, noteMutation],
)
const handleFullScreenSave = useCallback(
@@ -375,11 +460,29 @@ export default function NewPage() {
const handleHighlightsChat = useCallback(
(seed: string) => {
setQueuedChatSeed(seed)
- setIsChatOpen(true)
+ setQueuedChatModel(null)
+ setQueuedMessageSource("highlight")
+ void setViewMode("chat")
},
- [setIsChatOpen],
+ [setViewMode],
)
+ const handleHomeChatStart = useCallback(
+ (message: string, model: ModelId) => {
+ setQueuedChatSeed(message)
+ setQueuedChatModel(model)
+ setQueuedMessageSource("home")
+ void setViewMode("chat")
+ },
+ [setViewMode],
+ )
+
+ const consumeQueuedChat = useCallback(() => {
+ setQueuedChatSeed(null)
+ setQueuedChatModel(null)
+ setQueuedMessageSource("highlight")
+ }, [])
+
const handleHighlightsShowRelated = useCallback(
(query: string) => {
analytics.searchOpened({ source: "highlight_related" })
@@ -401,6 +504,11 @@ export default function NewPage() {
[setViewMode, setIntegration],
)
+ const handleOpenPlugins = useCallback(() => {
+ void setViewMode("integrations")
+ void setPluginsPanel(true)
+ }, [setViewMode, setPluginsPanel])
+
const handleAddMemory = useCallback(
(tab: "note" | "link") => {
analytics.addDocumentModalOpened()
@@ -409,120 +517,193 @@ export default function NewPage() {
[setAddDoc],
)
- const chatOpen = isChatOpen !== null ? isChatOpen : !isMobile
+ const viewportWidth = useSyncExternalStore(
+ subscribeViewportWidth,
+ getViewportWidth,
+ () => GRADIENT_TOP_WIDTH_MAX,
+ )
+ const gradientTopPosition = gradientTopPositionForWidth(viewportWidth)
+
+ const isChatView = viewMode === "chat"
const isGraphMode = viewMode === "graph" && !isMobile
+ const isMemoriesDesktop = viewMode === "list" && !isMobile
+ const isHomeDesktop = viewMode === "dashboard" && !isMobile
+ const showNovaBackdrop = isGraphMode || isMemoriesDesktop
+ const isDashboardShell =
+ viewMode === "dashboard" || (viewMode === "graph" && isMobile)
return (
)
}
diff --git a/apps/web/components/animated-gradient-background.tsx b/apps/web/components/animated-gradient-background.tsx
index 8b37c8c4c..4a749d567 100644
--- a/apps/web/components/animated-gradient-background.tsx
+++ b/apps/web/components/animated-gradient-background.tsx
@@ -8,55 +8,51 @@ export function AnimatedGradientBackground({
animateFromBottom?: boolean
}) {
return (
-
- {
analytics.addDocumentModalOpened()
setAddDoc("note")
}}
- onOpenChat={() => setIsChatOpen(true)}
onOpenSearch={() => {
analytics.searchOpened({ source: "header" })
setIsSearchOpen(true)
}}
/>
-
-
+
+ {/* Reset data dialog */}
+ {(() => {
+ const confirmText = org?.name || user?.name || ""
+ return (
+
+ )
+ })()}
+
+ {/* Delete account dialog */}
+
-
+
+
+
+
+ {isDashboardShell && (
+ setIsChatOpen(open)}
- queuedMessage={queuedChatSeed}
- onConsumeQueuedMessage={() => setQueuedChatSeed(null)}
- emptyStateSuggestions={highlightsData?.questions}
- />
)}
{
analytics.addDocumentModalOpened()
diff --git a/apps/web/app/(app)/settings/page.tsx b/apps/web/app/(app)/settings/page.tsx
index 9d47b8389..4f092cbb9 100644
--- a/apps/web/app/(app)/settings/page.tsx
+++ b/apps/web/app/(app)/settings/page.tsx
@@ -6,7 +6,7 @@ import { motion } from "motion/react"
import NovaOrb from "@/components/nova/nova-orb"
import { useState, useEffect, useRef } from "react"
import { cn } from "@lib/utils"
-import { dmSansClassName } from "@/lib/fonts"
+import { dmSansClassName, dmSans125ClassName } from "@/lib/fonts"
import Account from "@/components/settings/account"
import Integrations from "@/components/settings/integrations"
import ConnectionsMCP from "@/components/settings/connections-mcp"
@@ -16,7 +16,11 @@ import { useRouter } from "next/navigation"
import { useIsMobile } from "@hooks/use-mobile"
import { useLocalStorageUsername } from "@hooks/use-local-storage-username"
import { analytics } from "@/lib/analytics"
-import { Sun } from "lucide-react"
+import { LogOut, RotateCcw, Trash2, Sun, LoaderIcon } from "lucide-react"
+import { authClient } from "@lib/auth"
+import { Dialog, DialogContent, DialogClose } from "@ui/components/dialog"
+import { useResetOrganization } from "@/hooks/use-reset-organization"
+import { useDeleteUserAccount } from "@/hooks/use-account-settings"
const TABS = ["account", "integrations", "connections", "support"] as const
type SettingsTab = (typeof TABS)[number]
@@ -28,6 +32,14 @@ type NavItem = {
icon: React.ReactNode
}
+type DangerItem = {
+ id: "logout" | "reset" | "delete"
+ label: string
+ description: string
+ icon: React.ReactNode
+ color: "neutral" | "amber" | "red"
+}
+
const NAV_ITEMS: NavItem[] = [
{
id: "account",
@@ -103,6 +115,51 @@ const NAV_ITEMS: NavItem[] = [
},
]
+const DANGER_ITEMS: DangerItem[] = [
+ {
+ id: "logout",
+ label: "Log out",
+ description: "Sign out of your account on this device",
+ icon: ("account")
const hasInitialized = useRef(false)
const router = useRouter()
const isMobile = useIsMobile()
const localStorageUsername = useLocalStorageUsername()
+ const [isResetDialogOpen, setIsResetDialogOpen] = useState(false)
+ const [resetConfirmation, setResetConfirmation] = useState("")
+ const resetOrganization = useResetOrganization()
+
+ const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false)
+ const [deleteEmailConfirm, setDeleteEmailConfirm] = useState("")
+ const deleteUserAccount = useDeleteUserAccount()
+
+ const handleLogout = async () => {
+ await authClient.signOut()
+ router.push("/login")
+ }
+
+ const handleDeleteAccount = async () => {
+ if (deleteEmailConfirm !== user?.email) return
+ deleteUserAccount.mutate(
+ { confirmation: deleteEmailConfirm },
+ {
+ onSuccess: () => {
+ setIsDeleteDialogOpen(false)
+ setDeleteEmailConfirm("")
+ router.push("/login")
+ },
+ },
+ )
+ }
+
useEffect(() => {
if (hasInitialized.current) return
hasInitialized.current = true
@@ -277,6 +361,55 @@ export default function SettingsPage() {
)}
))}
+
+ {/* Divider */}
+ {!isMobile && }
+
+ {DANGER_ITEMS.map((item) => {
+ const colors = DANGER_COLORS[item.color]
+ const handleClick = () => {
+ if (item.id === "logout") handleLogout()
+ else if (item.id === "reset") setIsResetDialogOpen(true)
+ else if (item.id === "delete") setIsDeleteDialogOpen(true)
+ }
+ return (
+
+ )
+ })}
-
- ) : viewMode === "graph" && !isMobile ? (
-
-
- ) : (
-
-
+
-
+
-
-
- setIsChatOpen(open)}
- queuedMessage={queuedChatSeed}
- onConsumeQueuedMessage={() => setQueuedChatSeed(null)}
- emptyStateSuggestions={highlightsData?.questions}
+ >
+
+
+ Graph view is available on desktop.
+ {" "}
+ Use a larger screen for the full graph, or keep
+ working from this home view.
+
+ ) : undefined
+ }
+ highlights={highlightsData?.highlights ?? []}
+ isLoadingHighlights={isLoadingHighlights}
+ onAddMemory={handleAddMemory}
+ onOpenSearch={() => {
+ analytics.searchOpened({ source: "header" })
+ setIsSearchOpen(true)
+ }}
+ onOpenIntegrations={handleOpenIntegrations}
+ onOpenPlugins={handleOpenPlugins}
+ onNavigateToMemories={() => void setViewMode("list")}
+ onNavigateToGraph={() => void setViewMode("graph")}
+ onOpenDocument={handleOpenDocument}
+ onHighlightsChat={handleHighlightsChat}
+ onHighlightsShowRelated={handleHighlightsShowRelated}
+ onResetHighlights={handleResetHighlights}
+ memoryOfDay={memoryOfDay}
/>
-
-
+ )}
+
+
+ {
+ if (!open) void setViewMode("dashboard")
+ }}
+ queuedMessage={queuedChatSeed}
+ onConsumeQueuedMessage={consumeQueuedChat}
+ queuedMessageSource={queuedMessageSource}
+ initialSelectedModel={queuedChatModel}
+ emptyStateSuggestions={highlightsData?.questions}
+ />
+
+ ) : viewMode === "integrations" ? (
+
+
+ ) : viewMode === "graph" && !isMobile ? (
+
+
+ ) : viewMode === "list" ? (
+
+
+ ) : (
+
+
-
-
- {isMobile && (
-
+
@@ -303,6 +436,169 @@ export default function SettingsPage() {
+
extractHighlightDocumentIdsFromMessages(messages),
+ [messages],
+ )
+
+ return (
+ ("gemini-2.5-pro")
+ const { selectedProject } = useProject()
+ const { allProjects } = useContainerTags()
+ const chatSpaceLabel = useMemo(
+ () =>
+ getChatSpaceDisplayLabel({
+ selectedProject,
+ allProjects,
+ }),
+ [selectedProject, allProjects],
+ )
+
+ const send = useCallback(() => {
+ const t = input.trim()
+ if (!t) return
+ onStartChat(t, selectedModel)
+ setInput("")
+ }, [input, onStartChat, selectedModel])
+
+ const handleKeyDown = (e: React.KeyboardEvent) => {
+ if (e.key === "Enter" && !e.shiftKey) {
+ e.preventDefault()
+ send()
+ }
+ }
+
+ return (
+
+
+
+
+ )
+}
+
export function ChatSidebar({
isChatOpen,
setIsChatOpen,
queuedMessage,
onConsumeQueuedMessage,
+ queuedMessageSource = "highlight",
+ initialSelectedModel = null,
emptyStateSuggestions,
+ layout = "sidebar",
}: {
isChatOpen: boolean
setIsChatOpen: (open: boolean) => void
queuedMessage?: string | null
onConsumeQueuedMessage?: () => void
+ queuedMessageSource?: "highlight" | "home"
+ initialSelectedModel?: ModelId | null
emptyStateSuggestions?: string[]
+ layout?: "sidebar" | "page"
}) {
const isMobile = useIsMobile()
+ const isPageDesktop = layout === "page" && !isMobile
const [input, setInput] = useState("")
const [selectedModel, setSelectedModel] =
useState("claude-sonnet-4.6")
@@ -183,6 +233,7 @@ export function ChatSidebar({
useEffect(() => {
if (isMobile) return
if (viewMode === "graph") return
+ if (layout === "page") return
const handleWindowScroll = () => {
const scrollThreshold = 80
@@ -196,7 +247,7 @@ export function ChatSidebar({
handleWindowScroll()
return () => window.removeEventListener("scroll", handleWindowScroll)
- }, [isMobile, viewMode])
+ }, [isMobile, viewMode, layout])
const {
messages,
@@ -251,6 +302,7 @@ export function ChatSidebar({
const handleSend = () => {
if (!input.trim() || status === "submitted" || status === "streaming")
return
+ if (!threadId) setThreadId(fallbackChatId)
analytics.chatMessageSent({ source: "typed" })
sendMessage({ text: input })
setInput("")
@@ -264,10 +316,6 @@ export function ChatSidebar({
}
}
- const toggleChat = () => {
- setIsChatOpen(!isChatOpen)
- }
-
const handleCopyMessage = useCallback((messageId: string, text: string) => {
analytics.chatMessageCopied({ message_id: messageId })
navigator.clipboard.writeText(text)
@@ -356,12 +404,17 @@ export function ChatSidebar({
(m: {
id: string
role: string
- parts: unknown
+ parts: Array<{ type: string }>
createdAt: string
}) => ({
id: m.id,
role: m.role,
- parts: m.parts || [],
+ // Strip tool parts — persisted format doesn't round-trip through
+ // convertToModelMessages correctly and causes tool_use/tool_result
+ // mismatch errors. Text history is sufficient for context.
+ parts: (m.parts || []).filter(
+ (p) => p.type === "text" || p.type === "reasoning",
+ ),
createdAt: new Date(m.createdAt),
}),
)
@@ -378,6 +431,15 @@ export function ChatSidebar({
[setThreadId],
)
+ // Auto-restore thread from URL on mount (e.g. reload or direct link)
+ const didAutoLoadRef = useRef(false)
+ useEffect(() => {
+ if (didAutoLoadRef.current) return
+ if (!threadId) return
+ didAutoLoadRef.current = true
+ loadThread(threadId)
+ }, [threadId, loadThread])
+
const deleteThread = useCallback(
async (threadId: string) => {
try {
@@ -441,11 +503,22 @@ export function ChatSidebar({
sentQueuedMessageRef.current !== queuedMessage
) {
sentQueuedMessageRef.current = queuedMessage
- analytics.chatMessageSent({ source: "highlight" })
+ if (!threadId) setThreadId(fallbackChatId)
+ analytics.chatMessageSent({ source: queuedMessageSource })
sendMessage({ text: queuedMessage })
onConsumeQueuedMessage?.()
}
- }, [isChatOpen, queuedMessage, status, sendMessage, onConsumeQueuedMessage])
+ }, [
+ isChatOpen,
+ queuedMessage,
+ queuedMessageSource,
+ status,
+ sendMessage,
+ onConsumeQueuedMessage,
+ fallbackChatId,
+ setThreadId,
+ threadId,
+ ])
// Reset the sent message ref when queued message is consumed
useEffect(() => {
@@ -497,431 +570,477 @@ export function ChatSidebar({
}
}, [checkIfScrolledToBottom])
- return (
-
- {!isChatOpen ? (
-
- {
+ setIsHistoryOpen(open)
+ if (open) {
+ fetchThreads()
+ analytics.chatHistoryViewed?.()
+ } else {
+ setConfirmingDeleteId(null)
+ }
+ }}
+ >
+ button]:text-[#FAFAFA]",
+ dmSansClassName(),
+ )}
+ >
+
+ Chat History
+
+ Space: {chatSpaceLabel}
+
+
+
+
+
+
+ )
+
+ const chatToolbarActions = (
+
+
+ )
+}
diff --git a/apps/web/components/chat/home-chat-composer.tsx b/apps/web/components/chat/home-chat-composer.tsx
new file mode 100644
index 000000000..e1042cac6
--- /dev/null
+++ b/apps/web/components/chat/home-chat-composer.tsx
@@ -0,0 +1,82 @@
+"use client"
+
+import { useCallback, useMemo, useState } from "react"
+import ChatInput from "./input"
+import ChatModelSelector from "./model-selector"
+import { getChatSpaceDisplayLabel } from "@/lib/chat-space-label"
+import { useProject } from "@/stores"
+import { useContainerTags } from "@/hooks/use-container-tags"
+import { dmSansClassName } from "@/lib/fonts"
+import { cn } from "@lib/utils"
+import type { ModelId } from "@/lib/models"
+
+export function HomeChatComposer({
+ onStartChat,
+ className,
+}: {
+ onStartChat: (message: string, model: ModelId) => void
+ className?: string
+}) {
+ const [input, setInput] = useState("")
+ const [selectedModel, setSelectedModel] = useState
+
+
+ Memory map
++ {highlightIds.length > 0 + ? `${highlightIds.length} memor${highlightIds.length === 1 ? "y" : "ies"} used by Nova` + : "Memories used by Nova will be highlighted here"} +
+
+ 0}
+ maxNodes={160}
+ />
+
+
+
+ )
+}
diff --git a/apps/web/components/chat/index.tsx b/apps/web/components/chat/index.tsx
index 0a0503f3e..4f67a318d 100644
--- a/apps/web/components/chat/index.tsx
+++ b/apps/web/components/chat/index.tsx
@@ -3,21 +3,21 @@
import { useState, useEffect, useCallback, useRef, useMemo } from "react"
import { useQueryState } from "nuqs"
import type { UIMessage } from "@ai-sdk/react"
-import { motion, AnimatePresence } from "motion/react"
+import { motion } from "motion/react"
import { useChat } from "@ai-sdk/react"
import { DefaultChatTransport } from "ai"
import NovaOrb from "@/components/nova/nova-orb"
import { Button } from "@ui/components/button"
import {
- Dialog,
- DialogContent,
- DialogDescription,
- DialogHeader,
- DialogTitle,
- DialogTrigger,
-} from "@ui/components/dialog"
+ Sheet,
+ SheetContent,
+ SheetDescription,
+ SheetHeader,
+ SheetTitle,
+} from "@ui/components/sheet"
import { ScrollArea } from "@ui/components/scroll-area"
import {
+ ArrowLeft,
Check,
ChevronDownIcon,
HistoryIcon,
@@ -41,6 +41,7 @@ import { modelNames, type ModelId } from "@/lib/models"
import { SuperLoader } from "../superloader"
import { UserMessage } from "./message/user-message"
import { AgentMessage } from "./message/agent-message"
+import { ChatGraphContextRail } from "./chat-graph-context-rail"
import { ChainOfThought } from "./input/chain-of-thought"
import { useIsMobile } from "@hooks/use-mobile"
import { useAuth } from "@lib/auth-context"
@@ -99,20 +100,69 @@ function ChatEmptyStatePlaceholder({
)
}
+export function ChatLaunchFab({
+ onOpen,
+ isMobile,
+}: {
+ onOpen: () => void
+ isMobile: boolean
+}) {
+ return (
+
+ setInput(e.target.value)}
+ onSend={send}
+ onStop={() => {}}
+ onKeyDown={handleKeyDown}
+ isResponding={false}
+ showStatusStrip={false}
+ stackedToolbar={
+ <>
+
+
+
+ {chatSpaceLabel}
+
+
+
+ }
+ />
+
+ {isLoadingThreads ? (
+
+
+
+ ) : threads.length === 0 ? (
+
+ No conversations yet
+
+ ) : (
+
+ {threads.map((thread) => {
+ const isActive = thread.id === currentChatId
+ return (
+
+ )
+ })}
+
)}
- style={{
- background: isMobile
- ? "linear-gradient(135deg, #12161C 0%, #0A0D12 100%)"
- : "linear-gradient(180deg, #0A0E14 0%, #05070A 100%)",
+
+
+
+
+
+
+
+ )
+
+ const pageDesktopToolbarRow = isPageDesktop ? (
+
+ {chatToolbarActions}
+
+ ) : null
+
+ const shell = (
+ <>
+ {showHeaderRow ? (
+
-
-
+ ) : null}
+
-
-
-
- {chatSpaceLabel}
-
-
-
-
+
+ {chatToolbarActions}
+
+ {layout === "page" && isMobile && (
- {/*
- {isMobile ? (
- */}
-
+ )}
+ {!isStackedInput && (
+ <>
+
+
+ {chatSpaceLabel}
+
+
+
+ )}
+ {isInputExpanded && (
- {isInputExpanded && (
-
- )}
- {messages.length === 0 && (
- {
- analytics.chatSuggestedQuestionClicked()
- analytics.chatMessageSent({ source: "suggested" })
- sendMessage({ text: suggestion })
- }}
- suggestions={emptyStateSuggestions}
- />
+ "absolute inset-0 z-10! pointer-events-none",
+ isPageDesktop ? "rounded-none" : "rounded-2xl",
)}
+ style={{ backgroundColor: "#000000E5" }}
+ />
+ )}
+ {messages.length === 0 && (
+ {
+ analytics.chatSuggestedQuestionClicked()
+ analytics.chatMessageSent({ source: "suggested" })
+ sendMessage({ text: suggestion })
+ }}
+ suggestions={emptyStateSuggestions}
+ />
+ )}
+
- {chatStreamError && (
- 0
+ ? cn(
+ "flex flex-col space-y-3 min-h-full justify-end",
+ isPageDesktop ? "pt-2" : "pt-14",
+ )
+ : ""
+ }
+ >
+ {messages.map((message, index) => (
+ // biome-ignore lint/a11y/noStaticElementInteractions: Hover detection for message actions
-
- {!isScrolledToBottom && messages.length > 0 && (
- 0
- ? "flex flex-col space-y-3 min-h-full justify-end pt-14"
- : "",
+ "flex gap-2 w-full",
+ message.role === "user" ? "justify-end" : "justify-start",
)}
+ onMouseEnter={() =>
+ message.role === "assistant" && setHoveredMessageId(message.id)
+ }
+ onMouseLeave={() =>
+ message.role === "assistant" && setHoveredMessageId(null)
+ }
>
- {messages.map((message, index) => (
- // biome-ignore lint/a11y/noStaticElementInteractions: Hover detection for message actions
-
-
- message.role === "assistant" &&
- setHoveredMessageId(message.id)
- }
- onMouseLeave={() =>
- message.role === "assistant" && setHoveredMessageId(null)
- }
- >
- {message.role === "user" ? (
-
- ))}
- {(status === "submitted" || status === "streaming") && (
-
-
+ {message.role === "user" ? (
+
-
+ ))}
+ {(status === "submitted" || status === "streaming") && (
+
+
+
)}
+ 0 && (
+ setInput(e.target.value)}
- onSend={handleSend}
- onStop={stop}
- onKeyDown={handleKeyDown}
- isResponding={status === "submitted" || status === "streaming"}
- activeStatus={
- status === "submitted"
- ? "Thinking..."
- : status === "streaming"
- ? "Structuring response..."
- : "Waiting for input..."
- }
- onExpandedChange={setIsInputExpanded}
- chainOfThoughtComponent={
- messages.length > 0 ? (
-
+ style={
+ isMobile
+ ? undefined
+ : isPageDesktop
+ ? undefined
+ : {
+ height: `calc(100vh - ${heightOffset}px)`,
+ }
+ }
+ initial={
+ isMobile
+ ? { y: "100%", opacity: 0 }
+ : layout === "page"
+ ? { opacity: 0, y: 20 }
+ : { x: "100px", opacity: 0 }
+ }
+ animate={{ x: 0, y: 0, opacity: 1 }}
+ exit={
+ isMobile
+ ? { y: "100%", opacity: 0 }
+ : layout === "page"
+ ? { opacity: 0, y: 12 }
+ : { x: "100px", opacity: 0 }
+ }
+ transition={{ duration: 0.3, ease: "easeOut", bounce: 0 }}
+ >
+ {chatHistorySheet}
+ {isPageDesktop ? (
+
)
}
+
+export { HomeChatComposer } from "./home-chat-composer"
diff --git a/apps/web/components/chat/input/index.tsx b/apps/web/components/chat/input/index.tsx
index 40c1949d2..d88e34faa 100644
--- a/apps/web/components/chat/input/index.tsx
+++ b/apps/web/components/chat/input/index.tsx
@@ -4,7 +4,7 @@ import { ChevronUpIcon } from "lucide-react"
import NovaOrb from "@/components/nova/nova-orb"
import { cn } from "@lib/utils"
import { dmSansClassName } from "@/lib/fonts"
-import { useRef, useState } from "react"
+import { type ReactNode, useRef, useState } from "react"
import { motion } from "motion/react"
import { SendButton, StopButton } from "./actions"
@@ -18,6 +18,10 @@ interface ChatInputProps {
activeStatus?: string
chainOfThoughtComponent?: React.ReactNode
onExpandedChange?: (expanded: boolean) => void
+ /** Model + space controls on one row with send; textarea full-width above */
+ stackedToolbar?: ReactNode
+ /** Nova status row + chain-of-thought toggle (off for e.g. home composer) */
+ showStatusStrip?: boolean
}
export default function ChatInput({
@@ -30,6 +34,8 @@ export default function ChatInput({
activeStatus,
chainOfThoughtComponent,
onExpandedChange,
+ stackedToolbar,
+ showStatusStrip = true,
}: ChatInputProps) {
const [isMultiline, setIsMultiline] = useState(false)
const [isExpanded, setIsExpanded] = useState(false)
@@ -52,82 +58,122 @@ export default function ChatInput({
-
+
+
+ )}
+
+ {chatStreamError && (
+
+
+
+ )
-
+
+
+ ) : undefined
+ }
+ />
+
+
+ + {chatStreamError.title} +
++ {chatStreamError.body} +
+ {chatStreamError.otherModels.length > 0 && ( +
+ {chatStreamError.otherModels.map((id) => {
+ const m = modelNames[id]
+ return (
+
+ )
+ })}
+
)}
+
+
+ ) : (
+ shell
+ )}
+
+ {pageDesktopToolbarRow}
+
+
+ {shell}
+
+
- {chainOfThoughtComponent}
-
-