feat: add tanstack query and optimistic fetch on brains settings page

[mamadoudicko]

Before:

Screen.Recording.2023-09-01.at.12.38.30.mov

After:

Screen.Recording.2023-09-01.at.12.39.13.mov

To improve UX on first load, we can add a loader... WDYT @Chloeroumengas @danielcgilibert @lamiabnn ?

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 1, 2023 10:40am
quivrapp	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 1, 2023 10:40am

[github-actions]

Risk Level 2 - /home/runner/work/quivr/quivr/frontend/app/App.tsx

The code seems to be well written and follows good practices. However, there is a potential issue with the useEffect hook. The dependencies array includes session?.user which means the effect will run every time the user property of session changes. If session is null or undefined, this could lead to unnecessary re-renders. Consider checking if session is defined before including session.user in the dependencies array.

useEffect(() => {
  void fetchAllBrains();
  void fetchAndSetActiveBrain();
  void fetchPublicPrompts();
}, [session && session.user]);

---

Risk Level 3 - /home/runner/work/quivr/quivr/frontend/app/brains-management/[brainId]/components/BrainManagementTabs/components/SettingsTab/hooks/useSettingsTab.ts

1. The useEffect hook that updates the form values when brain changes might cause unnecessary re-renders. Consider using the useMemo hook to memoize the form values based on brain to avoid unnecessary re-renders.

const formValues = useMemo(() => {
  // calculate form values based on brain
}, [brain]);

2. The handleSubmit function is quite large and complex. Consider breaking it down into smaller, more manageable functions. This will make the code easier to read and maintain.

3. The setAsDefaultBrainHandler function sets isSettingAsDefault to true but does not set it back to false in case of an error. This could lead to a state where the UI indicates that the operation is still in progress even though it has failed. Consider adding a finally block to ensure isSettingAsDefault is always set back to false.

try {
  setIsSettingAsDefault(true);
  // operation
} catch (error) {
  // handle error
} finally {
  setIsSettingAsDefault(false);
}

---

🔄🧠🔧

---

Powered by Code Review GPT

[mamadoudicko]

Nice PR. Love it!

🫶🏽

[gozineb]

Magnifique ! Thanks mamadz !!