From 343a18393a27354b2262b07cc0753d2cd163b0dd Mon Sep 17 00:00:00 2001
From: "Sven (AAMOS AI)" <sven@wavult.com>
Date: Mon, 17 Aug 2026 20:07:23 +0700
Subject: [PATCH] =?UTF-8?q?feat(mobile):=20MIKRO=20WEEK-3=20interaktiv=20p?=
 =?UTF-8?q?lanera=20veckan-ruta=20(dagar=20x=20m=C3=A5ltider)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/mobile/src/app/(tabs)/plan.tsx | 49 ++++++++++++++++++++++++-----
 1 file changed, 41 insertions(+), 8 deletions(-)

diff --git a/apps/mobile/src/app/(tabs)/plan.tsx b/apps/mobile/src/app/(tabs)/plan.tsx
index d55f20f..d9fa895 100644
--- a/apps/mobile/src/app/(tabs)/plan.tsx
+++ b/apps/mobile/src/app/(tabs)/plan.tsx
@@ -80,10 +80,15 @@ export default function PlanScreen() {
   const mondayKey = toKey(monday);
   const weekDays = useMemo(() => Array.from({ length: 7 }, (_, i) => addDays(monday, i)), [monday]);
   // Vardag: middag. Helg (lör/sön): lunch + middag. Realistisk förifylld default.
-  const mealSlots = useMemo(
-    () => weekDays.map((d) => (d.getDay() === 0 || d.getDay() === 6 ? ["lunch", "dinner"] : ["dinner"])),
-    [weekDays],
+  const [mealSlots, setMealSlots] = useState<string[][]>(() =>
+    weekDays.map((d) => (d.getDay() === 0 || d.getDay() === 6 ? ["lunch", "dinner"] : ["dinner"])),
   );
+  const toggleSlot = (dayIdx: number, meal: string) =>
+    setMealSlots((prev) =>
+      prev.map((meals, i) =>
+        i !== dayIdx ? meals : meals.includes(meal) ? meals.filter((m) => m !== meal) : [...meals, meal],
+      ),
+    );
 
   const query = useQuery({
     queryKey: ["week-plan", mondayKey],
@@ -313,11 +318,39 @@ export default function PlanScreen() {
         <>
           <EmptyState text={t("plan.emptyDay")} />
           {(plan === null || !hasEntries) && (
-            <Button
-              label={t("plan.generate")}
-              onPress={() => generate.mutate()}
-              loading={generate.isPending}
-            />
+            <>
+              <Small>Planera veckan – välj måltider per dag:</Small>
+              {weekDays.map((d, i) => (
+                <Row
+                  key={toKey(d)}
+                  style={{ justifyContent: "space-between", alignItems: "center", marginVertical: 2 }}
+                >
+                  <Small>
+                    {cap(new Intl.DateTimeFormat(locale, { weekday: "short", day: "numeric" }).format(d))}
+                  </Small>
+                  <Row>
+                    {(["breakfast", "lunch", "dinner"] as const).map((meal) => (
+                      <Pressable
+                        key={meal}
+                        onPress={() => toggleSlot(i, meal)}
+                        style={{ marginLeft: spacing.xs }}
+                      >
+                        <Tag
+                          label={mealTypeLabel(meal)}
+                          tone={mealSlots[i]?.includes(meal) ? "accent" : "neutral"}
+                        />
+                      </Pressable>
+                    ))}
+                  </Row>
+                </Row>
+              ))}
+              <Spacer size={spacing.xs} />
+              <Button
+                label={t("plan.generate")}
+                onPress={() => generate.mutate()}
+                loading={generate.isPending}
+              />
+            </>
           )}
         </>
       )}