feat(profile): remove outfit images, enforce avoided colors hard in shopping verdict, stronger profile prompt

Author: ayushthonge

backend/app/api/routes.py

@@ -294,14 +294,28 @@ async def shopping_analyze(
         data["item_description"] = groq_fallback.FALLBACK_NOTE + " " + data["item_description"]
 
     verdict = (data.get("buy_verdict") or "no").strip().lower()
+    verdict_reason = data.get("verdict_reason", "")
     compatible = data.get("compatible_items") or []
     incompatible = data.get("incompatible_items") or []
 
+    # Hard-enforce avoided colors from profile — override Gemini's verdict
+    if profile_context and profile_context.strip():
+        import re
+        avoid_match = re.search(r'MUST AVOID.*?:\s*([^\n.]+)', profile_context, re.IGNORECASE)
+        if avoid_match:
+            avoided = [c.strip().lower() for c in avoid_match.group(1).split(',')]
+            item_desc_lower = (data.get("item_description") or "").lower()
+            for color in avoided:
+                if color and color in item_desc_lower:
+                    verdict = "no"
+                    verdict_reason = f"You have marked {color} as a colour to avoid. This item should be skipped."
+                    break
+
     segments = []
     if data.get("item_description"):
         segments.append({"id": "item", "text": data["item_description"]})
-    if data.get("verdict_reason"):
-        segments.append({"id": "verdict", "text": data["verdict_reason"]})
+    if verdict_reason:
+        segments.append({"id": "verdict", "text": verdict_reason})
     if compatible:
         segments.append({"id": "compatible", "text": "Goes with: " + ", ".join(compatible) + "."})
     if incompatible:

frontend/src/contexts/ProfileContext.jsx

@@ -44,9 +44,8 @@ function buildProfileContext(p) {
   if (p.weight) parts.push(`Weight: ${p.weight}`)
   if (p.bodyType) parts.push(`Body type: ${p.bodyType}`)
   if (p.colorPrefs?.length) parts.push(`Preferred colours: ${p.colorPrefs.join(', ')}`)
-  if (p.avoidColors?.length) parts.push(`Avoids colours: ${p.avoidColors.join(', ')}`)
+  if (p.avoidColors?.length) parts.push(`MUST AVOID these colours (never recommend or approve items in these colours): ${p.avoidColors.join(', ')}`)
   if (p.patterns?.length) parts.push(`Preferred patterns: ${p.patterns.join(', ')}`)
-  if (p.stylePrefs) parts.push(`Style: ${p.stylePrefs}`)
-  if (p.outfits?.length) parts.push(`${p.outfits.length} pre-saved outfit${p.outfits.length !== 1 ? 's' : ''} uploaded`)
-  return parts.length > 0 ? 'User profile — ' + parts.join('. ') + '.' : ''
+  if (p.stylePrefs) parts.push(`Preferred style: ${p.stylePrefs}`)
+  return parts.length > 0 ? 'User preferences — ' + parts.join('. ') + '.' : ''
 }

frontend/src/screens/ProfileScreen.jsx

@@ -23,30 +23,18 @@ export function ProfileScreen() {
   const [avoidColors, setAvoidColors] = useState(profile.avoidColors || [])
   const [patterns, setPatterns] = useState(profile.patterns || [])
   const [stylePrefs, setStylePrefs] = useState(profile.stylePrefs || '')
-  const [outfits, setOutfits] = useState(profile.outfits || []) // array of dataUrls
   const [saved, setSaved] = useState(false)
 
   const toggleArr = (arr, setArr, val) => {
     setArr(arr.includes(val) ? arr.filter((v) => v !== val) : [...arr, val])
   }
 
-  const handleOutfitUpload = useCallback((e) => {
-    const files = Array.from(e.target.files || [])
-    if (!files.length) return
-    const remaining = 5 - outfits.length
-    files.slice(0, remaining).forEach((file) => {
-      const reader = new FileReader()
-      reader.onload = (ev) => setOutfits((prev) => [...prev, ev.target.result].slice(0, 5))
-      reader.readAsDataURL(file)
-    })
-  }, [outfits])
-
   const handleSave = useCallback(() => {
-    saveProfile({ height, weight, bodyType, colorPrefs, avoidColors, patterns, stylePrefs, outfits })
+    saveProfile({ height, weight, bodyType, colorPrefs, avoidColors, patterns, stylePrefs })
     setSaved(true)
-    speak('Profile saved. The app will use this to personalise your suggestions.')
+    speak('Profile saved. Shopping mode and outfit suggestions will now respect your colour and style preferences.')
     setTimeout(() => setSaved(false), 2000)
-  }, [height, weight, bodyType, colorPrefs, avoidColors, patterns, stylePrefs, outfits, saveProfile, speak])
+  }, [height, weight, bodyType, colorPrefs, avoidColors, patterns, stylePrefs, saveProfile, speak])
 
   return (
     <Screen title="My Profile" subtitle="All fields are optional">
@@ -69,30 +57,6 @@ export function ProfileScreen() {
         <ChipGroup label="Style" options={STYLE_OPTIONS} selected={[stylePrefs]} onToggle={(v) => setStylePrefs(stylePrefs === v ? '' : v)} single />
       </Section>
 
-      <Section label={`My Outfits (${outfits.length}/5)`}>
-        <p style={{ fontSize: 13, color: COLORS.TEXT_MUTED, lineHeight: 1.6, marginBottom: 12, marginTop: 0 }}>
-          Upload up to 5 outfits you already wear. The AI will learn your style from them.
-        </p>
-        <div style={{ display: 'flex', gap: 8, flexWrap: 'wrap', marginBottom: outfits.length < 5 ? 12 : 0 }}>
-          {outfits.map((src, i) => (
-            <div key={i} style={{ position: 'relative', width: 72, height: 72 }}>
-              <img src={src} alt={`Outfit ${i + 1}`} style={{ width: '100%', height: '100%', objectFit: 'cover', borderRadius: COLORS.RADIUS, border: `2px solid ${COLORS.BORDER}` }} />
-              <button
-                onClick={() => setOutfits(outfits.filter((_, j) => j !== i))}
-                aria-label={`Remove outfit ${i + 1}`}
-                style={{ position: 'absolute', top: -8, right: -8, width: 22, height: 22, borderRadius: '50%', background: COLORS.DANGER, border: 'none', color: '#fff', fontSize: 12, fontWeight: 900, cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center' }}
-              >×</button>
-            </div>
-          ))}
-        </div>
-        {outfits.length < 5 && (
-          <label style={{ display: 'inline-flex', alignItems: 'center', gap: 8, border: `2px solid ${COLORS.BORDER}`, borderRadius: COLORS.RADIUS, padding: '10px 16px', cursor: 'pointer', fontSize: 13, fontWeight: 700, color: COLORS.TEXT_MUTED }}>
-            + Add Outfit Photo
-            <input type="file" accept="image/*" multiple onChange={handleOutfitUpload} style={{ display: 'none' }} />
-          </label>
-        )}
-      </Section>
-
       <div style={{ marginTop: 8 }}>
         <BigButton
           label={saved ? 'Saved!' : 'Save Profile'}