fix: prevent "cannot read properties of undefined (reading 'map')" crash (#532)

src/components/layout/Sidebar.tsx

@@ -182,7 +182,7 @@ export function Sidebar() {
   }, [fetchAgents]);
 
   const agentNameById = useMemo(
-    () => Object.fromEntries(agents.map((agent) => [agent.id, agent.name])),
+    () => Object.fromEntries((agents ?? []).map((agent) => [agent.id, agent.name])),
     [agents],
   );
   const sessionBuckets: Array<{ key: SessionBucketKey; label: string; sessions: typeof sessions }> = [

src/lib/provider-accounts.ts

@@ -97,11 +97,14 @@ export function buildProviderListItems(
   vendors: ProviderVendorInfo[],
   defaultAccountId: string | null,
 ): ProviderListItem[] {
-  const vendorMap = new Map(vendors.map((vendor) => [vendor.id, vendor]));
-  const statusMap = new Map(statuses.map((status) => [status.id, status]));
+  const safeAccounts = accounts ?? [];
+  const safeStatuses = statuses ?? [];
+  const safeVendors = vendors ?? [];
+  const vendorMap = new Map(safeVendors.map((vendor) => [vendor.id, vendor]));
+  const statusMap = new Map(safeStatuses.map((status) => [status.id, status]));
 
-  if (accounts.length > 0) {
-    return accounts
+  if (safeAccounts.length > 0) {
+    return safeAccounts
       .map((account) => ({
         account,
         vendor: vendorMap.get(account.vendorId),
@@ -114,7 +117,7 @@ export function buildProviderListItems(
       });
   }
 
-  return statuses.map((status) => ({
+  return safeStatuses.map((status) => ({
     account: legacyProviderToAccount(status),
     vendor: vendorMap.get(status.type),
     status,

src/pages/Chat/ChatInput.tsx

@@ -97,15 +97,15 @@ export function ChatInput({ onSend, onStop, disabled = false, sending = false, i
   const agents = useAgentsStore((s) => s.agents);
   const currentAgentId = useChatStore((s) => s.currentAgentId);
   const currentAgentName = useMemo(
-    () => agents.find((agent) => agent.id === currentAgentId)?.name ?? currentAgentId,
+    () => (agents ?? []).find((agent) => agent.id === currentAgentId)?.name ?? currentAgentId,
     [agents, currentAgentId],
   );
   const mentionableAgents = useMemo(
-    () => agents.filter((agent) => agent.id !== currentAgentId),
+    () => (agents ?? []).filter((agent) => agent.id !== currentAgentId),
     [agents, currentAgentId],
   );
   const selectedTarget = useMemo(
-    () => agents.find((agent) => agent.id === targetAgentId) ?? null,
+    () => (agents ?? []).find((agent) => agent.id === targetAgentId) ?? null,
     [agents, targetAgentId],
   );
   const showAgentPicker = mentionableAgents.length > 0;
@@ -132,7 +132,7 @@ export function ChatInput({ onSend, onStop, disabled = false, sending = false, i
       setPickerOpen(false);
       return;
     }
-    if (!agents.some((agent) => agent.id === targetAgentId)) {
+    if (!(agents ?? []).some((agent) => agent.id === targetAgentId)) {
       setTargetAgentId(null);
       setPickerOpen(false);
     }

src/pages/Chat/ChatToolbar.tsx

@@ -21,7 +21,7 @@ export function ChatToolbar() {
   const agents = useAgentsStore((s) => s.agents);
   const { t } = useTranslation('chat');
   const currentAgentName = useMemo(
-    () => agents.find((agent) => agent.id === currentAgentId)?.name ?? currentAgentId,
+    () => (agents ?? []).find((agent) => agent.id === currentAgentId)?.name ?? currentAgentId,
     [agents, currentAgentId],
   );
 

src/stores/agents.ts

@@ -22,11 +22,11 @@ interface AgentsState {
 
 function applySnapshot(snapshot: AgentsSnapshot | undefined) {
   return snapshot ? {
-    agents: snapshot.agents,
-    defaultAgentId: snapshot.defaultAgentId,
-    configuredChannelTypes: snapshot.configuredChannelTypes,
-    channelOwners: snapshot.channelOwners,
-    channelAccountOwners: snapshot.channelAccountOwners,
+    agents: snapshot.agents ?? [],
+    defaultAgentId: snapshot.defaultAgentId ?? 'main',
+    configuredChannelTypes: snapshot.configuredChannelTypes ?? [],
+    channelOwners: snapshot.channelOwners ?? {},
+    channelAccountOwners: snapshot.channelAccountOwners ?? {},
   } : {};
 }
 

src/stores/providers.ts

@@ -82,10 +82,10 @@ export const useProviderStore = create<ProviderState>((set, get) => ({
       const snapshot = await fetchProviderSnapshot();
       
       set({ 
-        statuses: snapshot.statuses,
-        accounts: snapshot.accounts,
-        vendors: snapshot.vendors,
-        defaultAccountId: snapshot.defaultAccountId,
+        statuses: snapshot.statuses ?? [],
+        accounts: snapshot.accounts ?? [],
+        vendors: snapshot.vendors ?? [],
+        defaultAccountId: snapshot.defaultAccountId ?? null,
         loading: false 
       });
     } catch (error) {