From f76bd997cce7c3148db5d6d6d886badd89a844e8 Mon Sep 17 00:00:00 2001
From: ericsocrat <ericsocrat@users.noreply.github.com>
Date: Fri, 1 May 2026 13:16:56 +0200
Subject: [PATCH] fix(frontend): resolve set-state-in-effect in
 NutritionSettingsPage (#1063)

Replaces useEffect that synced 5 form fields (diet, allergens, strictDiet, strictAllergen, treatMayContain) from useQuery prefs result with React 19 'adjust state during render' pattern. A prevPrefs state tracks last seen query result; new values written before render completes when prefs identity changes. useEffect import removed as no longer used. Behaviour unchanged.
---
 frontend/src/app/app/settings/nutrition/page.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/app/app/settings/nutrition/page.tsx b/frontend/src/app/app/settings/nutrition/page.tsx
index a6264539..992c943b 100644
--- a/frontend/src/app/app/settings/nutrition/page.tsx
+++ b/frontend/src/app/app/settings/nutrition/page.tsx
@@ -15,7 +15,7 @@ import { createClient } from "@/lib/supabase/client";
 import { showToast } from "@/lib/toast";
 import { useLanguageStore } from "@/stores/language-store";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 
 export default function NutritionSettingsPage() {
   const supabase = createClient();
@@ -42,8 +42,12 @@ export default function NutritionSettingsPage() {
   const [saving, setSaving] = useState(false);
   const [dirty, setDirty] = useState(false);
 
-  // Populate from fetched prefs
-  useEffect(() => {
+  // Populate from fetched prefs — adjust state during render when the
+  // upstream query result changes (avoids react-hooks/set-state-in-effect).
+  // See https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes
+  const [prevPrefs, setPrevPrefs] = useState(prefs);
+  if (prefs !== prevPrefs) {
+    setPrevPrefs(prefs);
     if (prefs) {
       setDiet(prefs.diet_preference ?? "none");
       setAllergens(prefs.avoid_allergens ?? []);
@@ -51,7 +55,7 @@ export default function NutritionSettingsPage() {
       setStrictAllergen(prefs.strict_allergen);
       setTreatMayContain(prefs.treat_may_contain_as_unsafe);
     }
-  }, [prefs]);
+  }
 
   function markDirty() {
     setDirty(true);