fix(org): keep a Home chat when switching to Search

Author: waleedlatif1

apps/sim/platform/app/(shell)/home/_components/home-conversation/home-conversation.tsx

@@ -2,13 +2,15 @@
 
 import { useState, useTransition } from 'react'
 import { useRouter } from 'next/navigation'
+import { useSession } from '@/lib/auth/client'
 import { organizationRoutes } from '@/lib/navigation/paths'
 import { OrganizationConversation } from '@/app/o/[organizationId]/components/organization-conversation'
 import { useOrganizationContext } from '@/app/o/[organizationId]/providers/organization-provider'
 import { SEARCH_MODES } from '@/app/o/[organizationId]/search/use-organization-search'
 import { HomeDashboardSkeleton } from '@/platform/app/(shell)/home/_components/home-dashboard/home-dashboard-skeleton'
 import { LiveHome } from '@/platform/app/(shell)/home/_components/live-home/live-home'
 import { SearchSurfaceHeader } from '@/platform/app/(shell)/search/_components/search-surface/search-surface-header'
+import { useMothershipDraftsStore } from '@/stores/mothership-drafts/store'
 
 /** Search's Assistant keeps its own unsent question; the agent composer keeps the default `home` key. */
 const HOME_ASSISTANT_DRAFT_ID = 'home-assistant'
@@ -21,6 +23,7 @@ interface HomeConversationProps {
 export function HomeConversation({ requestMode }: HomeConversationProps) {
   const { organization } = useOrganizationContext()
   const router = useRouter()
+  const { data: session } = useSession()
   const routes = organizationRoutes(organization.id)
   const [conversationInstance, setConversationInstance] = useState(0)
   const [isStartingNew, startNewTransition] = useTransition()
@@ -32,16 +35,25 @@ export function HomeConversation({ requestMode }: HomeConversationProps) {
         activeMode: 'assistant',
         modes: [...SEARCH_MODES],
         changeMode: (mode) => {
-          if (mode === 'search') router.push(`${routes.search}?mode=search`)
+          if (mode !== 'search') return
+          const { pathname } = window.location
+          const chatPath = pathname.startsWith(`${routes.search}/chat/`) ? pathname : routes.search
+          router.push(`${chatPath}?mode=search`)
         },
         newLabel: 'New chat',
         canStartNew: true,
         isStartingNew,
-        startNew: () =>
+        startNew: () => {
+          useMothershipDraftsStore
+            .getState()
+            .clearDraft(
+              `${session?.user?.id}:organization:${organization.id}:${HOME_ASSISTANT_DRAFT_ID}`
+            )
           startNewTransition(() => {
             setConversationInstance((current) => current + 1)
             router.push(routes.home, { scroll: false })
-          }),
+          })
+        },
       }}
     />
   )

apps/sim/platform/app/(shell)/search/_components/search-surface/search-surface.tsx

@@ -5,7 +5,6 @@ import { RedesignSurface } from '@/app/o/[organizationId]/_redesign/redesign-hos
 import { useOrganizationContext } from '@/app/o/[organizationId]/providers/organization-provider'
 import { SearchFrame } from '@/app/o/[organizationId]/search/search-frame'
 import {
-  type OrganizationSearchState,
   useOrganizationSearch,
   useSearchFieldDraft,
 } from '@/app/o/[organizationId]/search/use-organization-search'
@@ -16,7 +15,7 @@ import { SearchResults } from '@/platform/app/(shell)/_components/search/search-
 import { SearchHistory } from '@/platform/app/(shell)/search/_components/search-surface/search-history'
 import styles from '@/platform/app/(shell)/search/_components/search-surface/search-surface.module.css'
 import { SearchSurfaceHeader } from '@/platform/app/(shell)/search/_components/search-surface/search-surface-header'
-import { Button, IconButton } from '@/platform/design-system/components/button/button'
+import { IconButton } from '@/platform/design-system/components/button/button'
 import { Icon } from '@/platform/design-system/components/icon/icon'
 import { useScrollEdges } from '@/platform/design-system/components/scroll-area/use-scroll-edges'
 

apps/sim/platform/design-system/components/button/button.shared.module.css

@@ -158,7 +158,7 @@
 .chipAction:has([aria-expanded="true"]) {
   opacity: 1;
 }
-.chipRow[data-action-side="start"]:hover > .chip > svg {
+.chipRow[data-action-side="start"]:is(:hover, :has(:focus-visible)) > .chip > svg {
   visibility: hidden;
 }
 

apps/sim/scripts/test-org-redesign-e2e.ts

@@ -1335,10 +1335,17 @@ async function homeChecks() {
         })
         const chatId = new URL(page.url()).pathname.split('/').at(-1)
         await expect(page.getByRole('navigation', { name: 'Search views' })).toBeVisible()
-        await page.getByRole('button', { name: 'New chat' }).click()
-        await expect(page).toHaveURL(/\/home$/)
-        await expect(composer(page)).toBeVisible()
-        await page.goto(orgUrl(`/search/chat/${chatId}`))
+        await composer(page).fill('An unsent follow-up')
+        await page
+          .getByRole('navigation', { name: 'Search views' })
+          .getByRole('button', { name: 'Search' })
+          .click()
+        await expect(page).toHaveURL(new RegExp(`/search/chat/${chatId}\\?mode=search`))
+        await expect(searchField(page)).toBeVisible()
+        await page
+          .getByRole('navigation', { name: 'Search views' })
+          .getByRole('button', { name: 'Assistant' })
+          .click()
         await expect(page.getByText('Hello from the scripted agent.')).toBeVisible()
         await expect(
           sidebar(page)
@@ -1348,6 +1355,17 @@ async function homeChecks() {
       })
     }
   )
+  await check('New chat on a chat started from Home returns to an empty Home', async () => {
+    await withSession(MEMBER, async ({ page }) => {
+      await page.goto(orgUrl('/home'))
+      await composer(page).fill('Say hello again from Home')
+      await composer(page).press('Enter')
+      await expect(page).toHaveURL(/\/search\/chat\/[^/?]+/, { timeout: 30_000 })
+      await page.getByRole('button', { name: 'New chat' }).click()
+      await expect(page).toHaveURL(/\/home$/)
+      await expect(composer(page)).toHaveValue('')
+    })
+  })
   await check('Home, Search and the agent keep separate drafts', async () => {
     await withSession(MEMBER, async ({ page }) => {
       await page.goto(orgUrl('/home'))