refactor: add AuthGuard component and fix API client empty response handling

- Add reusable AuthGuard component for protected routes
- Move auth logic from index.tsx to (tabs)/_layout.tsx via AuthGuard
- Fix ApiClient to handle empty responses (204 No Content)
- Use useFocusEffect in chat.tsx to load messages after auth is ready
- Extract getDateKey() helper function in calendar.tsx

apps/client/src/app/(tabs)/chat.tsx

@@ -8,13 +8,15 @@ import {
   Keyboard,
 } from "react-native";
 import { useThemeStore } from "../../stores/ThemeStore";
-import React, { useState, useRef, useEffect } from "react";
+import React, { useState, useRef, useEffect, useCallback } from "react";
+import { useFocusEffect } from "expo-router";
 import Header from "../../components/Header";
 import BaseBackground from "../../components/BaseBackground";
 import { FlashList } from "@shopify/flash-list";
 import { ChatService } from "../../services";
 import {
   useChatStore,
+  useAuthStore,
   chatMessageToMessageData,
   MessageData,
 } from "../../stores";
@@ -45,6 +47,7 @@ type ChatInputProps = {
 const TYPING_INDICATOR_DELAY_MS = 500;
 
 const Chat = () => {
+  const { isAuthenticated, isLoading: isAuthLoading } = useAuthStore();
   const {
     messages,
     addMessage,
@@ -68,27 +71,31 @@ const Chat = () => {
     return () => keyboardDidShow.remove();
   }, []);
 
-  // Load existing messages from database on mount
-  useEffect(() => {
-    const fetchMessages = async () => {
-      try {
-        const conversationSummaries = await ChatService.getConversations();
-        if (conversationSummaries.length > 0) {
-          const conversationId = conversationSummaries[0].id;
-          setCurrentConversationId(conversationId);
+  // Load existing messages from database once authenticated and screen is focused
+  useFocusEffect(
+    useCallback(() => {
+      if (isAuthLoading || !isAuthenticated) return;
 
-          const serverMessages =
-            await ChatService.getConversation(conversationId);
-          const clientMessages = serverMessages.map(chatMessageToMessageData);
-          addMessages(clientMessages);
-          scrollToEnd();
+      const fetchMessages = async () => {
+        try {
+          const conversationSummaries = await ChatService.getConversations();
+          if (conversationSummaries.length > 0) {
+            const conversationId = conversationSummaries[0].id;
+            setCurrentConversationId(conversationId);
+
+            const serverMessages =
+              await ChatService.getConversation(conversationId);
+            const clientMessages = serverMessages.map(chatMessageToMessageData);
+            addMessages(clientMessages);
+            scrollToEnd();
+          }
+        } catch (error) {
+          console.error("Failed to load messages:", error);
         }
-      } catch (error) {
-        console.error("Failed to load messages:", error);
-      }
-    };
-    fetchMessages();
-  }, []);
+      };
+      fetchMessages();
+    }, [isAuthLoading, isAuthenticated]),
+  );
 
   const scrollToEnd = () => {
     setTimeout(() => {
@@ -283,6 +290,7 @@ const ChatInput = ({ onSend }: ChatInputProps) => {
         className="flex-1 border border-solid rounded-2xl px-3 py-2 mr-2"
         style={{
           backgroundColor: theme.messageBorderBg,
+          color: theme.textPrimary,
           minHeight: MIN_INPUT_HEIGHT,
           maxHeight: MAX_INPUT_HEIGHT,
           textAlignVertical: "top",