Merge pull request #12 from vintasoftware/feat/single-context

Global ChatContext
vintasoftware · Jan 6, 2025 · 3bb5d33 · 3bb5d33
2 parents b01ebdc + 7eb8c9e
commit 3bb5d33
Show file tree

Hide file tree

Showing 9 changed files with 862 additions and 686 deletions.
diff --git a/..._/hooks/headless/useChatMessages.test.tsx → __tests__/hooks/useChat-messages.test.tsx b/..._/hooks/headless/useChatMessages.test.tsx → __tests__/hooks/useChat-messages.test.tsx
diff --git a/__tests__/hooks/headless/useThreads.test.tsx → __tests__/hooks/useChat-threads.test.tsx b/__tests__/hooks/headless/useThreads.test.tsx → __tests__/hooks/useChat-threads.test.tsx
@@ -4,7 +4,7 @@ import { MockClient, MockSubscriptionManager } from "@medplum/mock";
 import { MedplumProvider } from "@medplum/react-hooks";
 import { act, renderHook, waitFor } from "@testing-library/react-native";
 
-import { useThreads } from "@/hooks/headless/useThreads";
+import { ChatProvider, useChat } from "@/contexts/ChatContext";
 import { getQueryString } from "@/utils/url";
 
 const mockPatient: Patient = {
@@ -86,7 +86,7 @@ async function createCommunicationSubBundle(communication: Communication): Promi
   };
 }
 
-describe("useThreads", () => {
+describe("useChat (threads)", () => {
   async function setup(
     profile: Patient | Practitioner = mockPatient,
   ): Promise<{ medplum: MockClient; subManager: MockSubscriptionManager }> {
@@ -108,6 +108,32 @@ describe("useThreads", () => {
     return { medplum, subManager };
   }
 
+  // Helper function to create wrapper with both providers
+  function createWrapper(
+    medplum: MockClient,
+    props: Partial<{
+      onError: (error: Error) => void;
+      onWebSocketClose: () => void;
+      onWebSocketOpen: () => void;
+      onSubscriptionConnect: () => void;
+    }> = {},
+  ) {
+    const TestWrapper = ({ children }: { children: React.ReactNode }) => (
+      <MedplumProvider medplum={medplum}>
+        <ChatProvider {...props}>{children}</ChatProvider>
+      </MedplumProvider>
+    );
+    return TestWrapper;
+  }
+
+  // Subscription criteria
+  const criteria = getQueryString({
+    "part-of:missing": true,
+    subject: getReferenceString(mockPatient),
+    _revinclude: "Communication:part-of",
+  });
+
+  // Test cases:
   test("Loads and displays threads for patient", async () => {
     const { medplum } = await setup();
     const searchSpy = jest.spyOn(medplum, "search");
@@ -137,16 +163,16 @@ describe("useThreads", () => {
       ],
     });
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     // Initially should be loading
-    expect(result.current.loading).toBe(true);
+    expect(result.current.isLoadingThreads).toBe(true);
 
     // Wait for loading to complete
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Verify search was called correctly
@@ -155,7 +181,6 @@ describe("useThreads", () => {
       subject: "Patient/test-patient",
       _revinclude: "Communication:part-of",
       _sort: "-sent",
-      _count: "100",
     });
 
     // Check threads are displayed correctly
@@ -191,12 +216,12 @@ describe("useThreads", () => {
       ],
     });
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     expect(result.current.threads).toEqual([]);
@@ -207,33 +232,32 @@ describe("useThreads", () => {
     const { medplum } = await setup(mockPractitioner);
     const searchSpy = jest.spyOn(medplum, "search");
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     expect(searchSpy).toHaveBeenCalledWith("Communication", {
       "part-of:missing": true,
       subject: undefined,
       _revinclude: "Communication:part-of",
       _sort: "-sent",
-      _count: "100",
     });
   });
 
   test("Creates new thread successfully", async () => {
     const { medplum } = await setup();
     const createSpy = jest.spyOn(medplum, "createResource");
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     const newThreadId = await act(async () => {
@@ -271,12 +295,12 @@ describe("useThreads", () => {
   test("Prevents non-patient from creating thread", async () => {
     const { medplum } = await setup(mockPractitioner);
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     await expect(result.current.createThread("New Thread")).rejects.toThrow(
@@ -288,12 +312,12 @@ describe("useThreads", () => {
     const { medplum } = await setup();
     const createSpy = jest.spyOn(medplum, "createResource");
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     const threadId = await result.current.createThread("   ");
@@ -363,12 +387,12 @@ describe("useThreads", () => {
       ],
     });
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Verify threads are ordered by last activity (message sent time or thread creation time)
@@ -435,21 +459,16 @@ describe("useThreads", () => {
       ],
     });
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     // Wait for initial load
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Emit that subscription is connected
-    const criteria = getQueryString({
-      "part-of:missing": true,
-      subject: getReferenceString(mockPatient),
-      _revinclude: "Communication:part-of",
-    });
     act(() => {
       subManager.emitEventForCriteria(`Communication?${criteria}`, {
         type: "connect",
@@ -541,13 +560,13 @@ describe("useThreads", () => {
       ],
     });
 
-    const { result } = renderHook(() => useThreads(), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum),
     });
 
     // Wait for initial load
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Verify initial threads are loaded
@@ -569,7 +588,7 @@ describe("useThreads", () => {
 
     // Wait for loading to complete with new profile
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Verify threads are cleared
@@ -583,21 +602,17 @@ describe("useThreads", () => {
     const { medplum, subManager } = await setup();
     const searchSpy = jest.spyOn(medplum, "search");
 
-    const { result } = renderHook(
-      () =>
-        useThreads({
-          onWebSocketClose: onWebSocketCloseMock,
-          onWebSocketOpen: onWebSocketOpenMock,
-          onSubscriptionConnect: onSubscriptionConnectMock,
-        }),
-      {
-        wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
-      },
-    );
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum, {
+        onWebSocketClose: onWebSocketCloseMock,
+        onWebSocketOpen: onWebSocketOpenMock,
+        onSubscriptionConnect: onSubscriptionConnectMock,
+      }),
+    });
 
     // Wait for initial load
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Simulate WebSocket disconnection
@@ -648,11 +663,6 @@ describe("useThreads", () => {
     expect(result.current.threads.find((t) => t.id === "thread-new")).toBeUndefined();
 
     // Emit subscription connected event
-    const criteria = getQueryString({
-      "part-of:missing": true,
-      subject: getReferenceString(mockPatient),
-      _revinclude: "Communication:part-of",
-    });
     act(() => {
       subManager.emitEventForCriteria(`Communication?${criteria}`, {
         type: "connect",
@@ -668,7 +678,7 @@ describe("useThreads", () => {
 
     // Wait for reconnection and thread refresh
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
       const newThreadInList = result.current.threads.find((t) => t.id === "thread-new");
       expect(newThreadInList).toBeDefined();
       expect(newThreadInList?.topic).toBe("Thread created while disconnected");
@@ -678,21 +688,17 @@ describe("useThreads", () => {
   test("Calls onError callback when subscription error occurs", async () => {
     const onErrorMock = jest.fn();
     const { medplum, subManager } = await setup();
-    const { result } = renderHook(() => useThreads({ onError: onErrorMock }), {
-      wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
+
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum, { onError: onErrorMock }),
     });
 
     // Wait for initial load
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Emit error event on subscription
-    const criteria = getQueryString({
-      "part-of:missing": true,
-      subject: getReferenceString(mockPatient),
-      _revinclude: "Communication:part-of",
-    });
     act(() => {
       subManager.emitEventForCriteria(`Communication?${criteria}`, {
         type: "error",
@@ -714,22 +720,16 @@ describe("useThreads", () => {
     const error = new Error("Failed to load threads");
     searchSpy.mockRejectedValue(error);
 
-    const { result } = renderHook(
-      () =>
-        useThreads({
-          onError: onErrorMock,
-        }),
-      {
-        wrapper: ({ children }) => <MedplumProvider medplum={medplum}>{children}</MedplumProvider>,
-      },
-    );
+    const { result } = renderHook(() => useChat(), {
+      wrapper: createWrapper(medplum, { onError: onErrorMock }),
+    });
 
     // Initially should be loading
-    expect(result.current.loading).toBe(true);
+    expect(result.current.isLoadingThreads).toBe(true);
 
     // Wait for loading to complete
     await waitFor(() => {
-      expect(result.current.loading).toBe(false);
+      expect(result.current.isLoadingThreads).toBe(false);
     });
 
     // Verify the onError callback was called with the error

diff --git a/app/(app)/_layout.tsx b/app/(app)/_layout.tsx
@@ -3,6 +3,7 @@ import { Redirect, Slot } from "expo-router";
 import { SafeAreaView } from "react-native-safe-area-context";
 
 import { Spinner } from "@/components/ui/spinner";
+import { ChatProvider } from "@/contexts/ChatContext";
 
 export default function AppLayout() {
   const medplum = useMedplum();
@@ -21,5 +22,9 @@ export default function AppLayout() {
     return <Redirect href="/sign-in" />;
   }
 
-  return <Slot />;
+  return (
+    <ChatProvider>
+      <Slot />
+    </ChatProvider>
+  );
 }
diff --git a/app/(app)/index.tsx b/app/(app)/index.tsx
@@ -7,10 +7,10 @@ import { CreateThreadModal } from "@/components/CreateThreadModal";
 import { ThreadList } from "@/components/ThreadList";
 import { ThreadListHeader } from "@/components/ThreadListHeader";
 import { Spinner } from "@/components/ui/spinner";
-import { useThreads } from "@/hooks/headless/useThreads";
+import { useChat } from "@/contexts/ChatContext";
 
 export default function Index() {
-  const { threads, loading, createThread } = useThreads();
+  const { threads, isLoadingThreads, createThread } = useChat();
   const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
   const medplum = useMedplum();
   const router = useRouter();
@@ -20,7 +20,7 @@ export default function Index() {
     router.replace("/sign-in");
   }, [medplum, router]);
 
-  if (loading) {
+  if (isLoadingThreads) {
     return (
       <SafeAreaView
         style={{