Missing React Hooks dependencies when deploying on Vercel

[Itangalo]

Thanks for this project. It is so useful when I have workshops and what not.

I've followed the installation instructions for the hosted quickstart, and the deployment log on Vercel gives me warnings for missing dependencies:

• ./app/[locale]/chat/layout.tsx
• 27:6 Warning: React Hook useEffect has a missing dependency: 'router'. Either include it or remove the dependency array. react-hooks/exhaustive-deps
• ./app/[locale]/login/password/page.tsx
• 23:6  Warning: React Hook useEffect has a missing dependency: 'router'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./app/[locale]/setup/page.tsx
• 93:6  Warning: React Hook useEffect has missing dependencies: 'router', 'setAvailableHostedModels', 'setAvailableOpenRouterModels', 'setEnvKeyMap', and 'setProfile'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/chat/chat-hooks/use-scroll.tsx
• 22:6  Warning: React Hook useEffect has a missing dependency: 'userScrolled'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• 28:6  Warning: React Hook useEffect has missing dependencies: 'isGenerating', 'scrollToBottom', and 'userScrolled'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/chat/chat-hooks/use-select-file-handler.tsx
• 33:6  Warning: React Hook useEffect has a missing dependency: 'handleFilesToAccept'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/chat/chat-input.tsx
• 70:6  Warning: React Hook useEffect has a missing dependency: 'handleFocusChatInput'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/chat/chat-settings.tsx
• 40:6  Warning: React Hook useEffect has missing dependencies: 'chatSettings' and 'setChatSettings'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/chat/chat-ui.tsx
• 75:6  Warning: React Hook useEffect has missing dependencies: 'fetchChat', 'fetchMessages', 'handleFocusChatInput', 'params.chatid', 'scrollToBottom', and 'setIsAtBottom'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/messages/message-markdown.tsx
• 21:18  Warning: Using `\` could result in slower LCP and higher bandwidth. Consider using `\` from `next/image` to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element  @next/next/no-img-element
• 21:18  Warning: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.  jsx-a11y/alt-text
• ./components/messages/message.tsx
• 128:6  Warning: React Hook useEffect has a missing dependency: 'message.content'. Either include it or remove the dependency array. If 'setEditedMessage' needs the current value of 'message.content', you can also switch to useReducer instead of useState and read 'message.content' in the reducer.  react-hooks/exhaustive-deps
• ./components/setup/profile-step.tsx
• 49:37  Warning: React Hook useCallback received a function whose dependencies are unknown. Pass an inline function instead.  react-hooks/exhaustive-deps
• ./components/sidebar/items/all/sidebar-update-item.tsx
• 166:6  Warning: React Hook useEffect has missing dependencies: 'contentType', 'fetchDataFunctions', 'fetchSelectedWorkspaces', 'item.id', and 'workspaces.length'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/sidebar/items/assistants/assistant-item.tsx
• 43:6  Warning: React Hook useEffect has a missing dependency: 'assistant.image_path'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/utility/announcements.tsx
• 53:6  Warning: React Hook useEffect has a missing dependency: 'announcements'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/utility/global-state.tsx
• 164:6  Warning: React Hook useEffect has a missing dependency: 'fetchStartingData'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps
• ./components/utility/profile-settings.tsx
• 241:37  Warning: React Hook useCallback received a function whose dependencies are unknown. Pass an inline function instead.  react-hooks/exhaustive-deps

I don't have the knowledge and skill to interpret this, but it looks to me like some frontend stuff is missing dependencies. This would also explain why the Vercel-hosted app has some buttons that simply don't work (such as the submit button). It could of course be me doing something wrong, but these errors seem quite independent of any settings I do with API keys and whatnot.

[mckaywrigley]

Warnings in yellow can be ignored. Only errors in red matter.