Connecting to backend…
+Connecting to backend…
{:else if backend.error} -Backend unreachable: {backend.error}
+Backend unreachable: {backend.error}
{:else} -Target saved!
+ {:else} + + {/if} +Failed to load log: {error}
-{:else if entries === null} -Loading…
-{:else if entries.length === 0} -Nothing logged yet today.
-{:else} -Loading…
+ {:else if dayData.error} +Failed to load: {dayData.error}
+ {:else} +Nothing logged yet. Tap "Add Food" to get started.
+ {:else} + {#each groups as group (group.slot ?? 'other')} +FoodEditor (placeholder)
+FoodSearch (placeholder)
+Searching…
+ {:else if searchError} +{searchError}
+ {:else if results !== null} + {#if results.length === 0} +No foods found.
+ {:else} ++ Or + +
+ + {:else} + +{selected.brand}
{/if} + += {formatKcal(liveKcal)}
+ + + + {#if logError}{logError}
{/if} + +LogEntry (placeholder)
+{error}
{/if} +ProgressBar (placeholder)
+ + + diff --git a/frontend/src/lib/api.js b/frontend/src/lib/api.js index 661be76..c67e76c 100644 --- a/frontend/src/lib/api.js +++ b/frontend/src/lib/api.js @@ -11,8 +11,16 @@ async function request(path, options = {}) { ...options, }) if (!resp.ok) { - throw new Error(`API ${options.method ?? 'GET'} ${path} failed: ${resp.status}`) + // Try to extract backend error detail for a better message + let detail = `${resp.status}` + try { + const body = await resp.json() + if (body.detail) detail = body.detail + } catch { /* can't parse — use status code */ } + throw new Error(`API ${options.method ?? 'GET'} ${path} failed: ${detail}`) } + // 204 No Content (DELETE) — return success indicator + if (resp.status === 204) return { ok: true } return resp.json() } @@ -26,10 +34,13 @@ export const api = { // Daily log (spec §3.3) — dates are YYYY-MM-DD strings end-to-end (spec §8.3 rule 4) getLog: (date) => request(`/api/log?date=${date}`), addLogEntry: (entry) => request('/api/log', { method: 'POST', body: JSON.stringify(entry) }), + updateLogEntry: (id, data) => request(`/api/log/${id}`, { method: 'PUT', body: JSON.stringify(data) }), deleteLogEntry: (id) => request(`/api/log/${id}`, { method: 'DELETE' }), getSummary: (date) => request(`/api/log/summary?date=${date}`), // Targets (spec §3.4) getCurrentTarget: () => request('/api/targets/current'), + getTargets: () => request('/api/targets'), + createTarget: (target) => request('/api/targets', { method: 'POST', body: JSON.stringify(target) }), // OFF proxy (spec §3.5) — the frontend never calls OFF directly offProduct: (barcode) => request(`/api/off/product/${barcode}`), offSearch: (q) => request(`/api/off/search?q=${encodeURIComponent(q)}`), diff --git a/frontend/src/lib/format.js b/frontend/src/lib/format.js index 02d2aac..84991ef 100644 --- a/frontend/src/lib/format.js +++ b/frontend/src/lib/format.js @@ -22,3 +22,71 @@ export function formatDate(yyyyMmDd) { day: 'numeric', }) } + +/** + * Compute the calories contributed by a single log entry. + * This is the permitted simple linear scaling for display only (spec §8.2 rule 2). + * - weight-type: (quantity / 100) × calories_per_unit + * - count-type: quantity × calories_per_unit + */ +export function caloriesForEntry(entry) { + const food = entry.food + if (!food || food.calories_per_unit == null) return 0 + if (food.unit_type === 'count') { + return entry.quantity * food.calories_per_unit + } + // weight-type (default) + return (entry.quantity / 100) * food.calories_per_unit +} + +/** + * Render a quantity string with serving awareness. + * - weight-type with matching serving: "1 serving (40g)" or just "40g" + * - count-type: "2×" or "1×" + */ +export function formatQuantity(entry) { + const food = entry.food + if (!food) return `${entry.quantity}` + + if (food.unit_type === 'count') { + return `${entry.quantity}×` + } + // weight-type + if (food.serving_size_g && Math.abs(entry.quantity - food.serving_size_g) < 0.01) { + const label = food.serving_name || `${food.serving_size_g}g` + return `1 serving (${label})` + } + return `${Math.round(entry.quantity)}g` +} + +/** + * Return a default quantity for a food when logging. + * - weight-type: serving_size_g if set, otherwise 100 + * - count-type: 1 + */ +export function defaultQuantity(food) { + if (food.unit_type === 'count') return 1 + return food.serving_size_g || 100 +} + +/** + * Live preview of calories for a given quantity of a food (display only — spec §8.2 rule 2). + */ +export function previewCalories(food, quantity) { + if (!food || food.calories_per_unit == null || quantity == null) return 0 + if (food.unit_type === 'count') { + return quantity * food.calories_per_unit + } + return (quantity / 100) * food.calories_per_unit +} + +/** + * Shift a YYYY-MM-DD date string by n days (can be negative). + * Uses UTC date math to avoid timezone shifts (spec §8.3 rule 4). + */ +export function shiftDate(yyyyMmDd, days) { + // Parse as UTC midnight so setUTCDate / getUTCDate stay on the civil day + const d = new Date(yyyyMmDd + 'T00:00:00Z') + d.setUTCDate(d.getUTCDate() + days) + return d.toISOString().slice(0, 10) +} diff --git a/frontend/src/lib/format.test.js b/frontend/src/lib/format.test.js index 9e6089a..47f842a 100644 --- a/frontend/src/lib/format.test.js +++ b/frontend/src/lib/format.test.js @@ -3,7 +3,7 @@ * Vitest only for stores/format logic, no component tests in v1). */ import { describe, it, expect } from 'vitest' -import { formatKcal, formatGrams, formatDate } from './format.js' +import { formatKcal, formatGrams, formatDate, shiftDate } from './format.js' describe('formatKcal', () => { it('rounds to whole numbers', () => { @@ -26,3 +26,41 @@ describe('formatDate', () => { expect(formatDate('2026-07-25')).toMatch(/Jul 25/) }) }) + +describe('shiftDate', () => { + it('shifts forward by one day', () => { + expect(shiftDate('2026-07-25', 1)).toBe('2026-07-26') + }) + + it('shifts backward by one day', () => { + expect(shiftDate('2026-07-25', -1)).toBe('2026-07-24') + }) + + it('shifts across month boundaries forward', () => { + expect(shiftDate('2026-07-31', 1)).toBe('2026-08-01') + }) + + it('shifts across month boundaries backward', () => { + expect(shiftDate('2026-08-01', -1)).toBe('2026-07-31') + }) + + it('shifts across year boundaries forward', () => { + expect(shiftDate('2026-12-31', 1)).toBe('2027-01-01') + }) + + it('shifts across year boundaries backward', () => { + expect(shiftDate('2027-01-01', -1)).toBe('2026-12-31') + }) + + it('returns same date when shifting by zero', () => { + expect(shiftDate('2026-07-25', 0)).toBe('2026-07-25') + }) + + it('shifts by multiple days forward', () => { + expect(shiftDate('2026-07-25', 7)).toBe('2026-08-01') + }) + + it('shifts by multiple days backward', () => { + expect(shiftDate('2026-08-01', -7)).toBe('2026-07-25') + }) +}) diff --git a/frontend/src/lib/stores.svelte.js b/frontend/src/lib/stores.svelte.js index 56da21c..284921d 100644 --- a/frontend/src/lib/stores.svelte.js +++ b/frontend/src/lib/stores.svelte.js @@ -4,11 +4,87 @@ * Svelte 5 runes style only (spec §8.2 rule 8). */ -// Current date as a YYYY-MM-DD string — the server never decides "today" (spec §8.1 rule 8) -export const currentDate = $state({ - value: new Date().toISOString().slice(0, 10), +import { api } from './api.js' +import { shiftDate } from './format.js' + +/** Return today as a YYYY-MM-DD string — the server never decides "today" (spec §8.1 rule 8). */ +function todayString() { + return new Date().toISOString().slice(0, 10) +} + +// ── Current date ──────────────────────────────────────────────────────────── + +export const currentDate = $state({ value: todayString() }) + +export function setDate(dateStr) { + currentDate.value = dateStr +} + +export function goPrevDay() { + currentDate.value = shiftDate(currentDate.value, -1) +} + +export function goNextDay() { + currentDate.value = shiftDate(currentDate.value, 1) +} + +// ── App view ───────────────────────────────────────────────────────────────── + +export const appView = $state({ current: 'dashboard' }) + +/** Simple navigation requests from child components (e.g., "Set a target"). */ +export const navigateTo = (view) => { appView.current = view } + +// ── Day data (log + summary) ───────────────────────────────────────────────── + +export const dayData = $state({ + log: [], + summary: null, // { date, totals: { calories, protein_g, ... }, target: {...} | null } + loading: false, + error: null, }) -// Today's log entries and current target, refreshed from the API after any mutation -export const todayLog = $state({ entries: [], loading: false, error: null }) -export const currentTarget = $state({ target: null, loading: false, error: null }) +export async function refreshDayData() { + const date = currentDate.value + dayData.loading = true + dayData.error = null + try { + const [log, summary] = await Promise.all([ + api.getLog(date), + api.getSummary(date), + ]) + dayData.log = log + dayData.summary = summary + dayData.loading = false + } catch (e) { + dayData.error = e.message + dayData.loading = false + } +} + +/** Re-fetch the summary for the current date without touching the log array. */ +async function refreshSummary() { + try { + dayData.summary = await api.getSummary(currentDate.value) + } catch { + // Keep the previous summary on failure; the user can retry. + } +} + +/** Add a newly-created log entry to the store then refresh the summary. */ +export async function addLogEntryToStore(entry) { + dayData.log = [...dayData.log, entry] + await refreshSummary() +} + +/** Update a log entry in the store after a successful API PUT, then refresh the summary. */ +export async function updateLogEntryInStore(updated) { + dayData.log = dayData.log.map(e => (e.id === updated.id ? updated : e)) + await refreshSummary() +} + +/** Remove a log entry from the store after a successful API DELETE, then refresh the summary. */ +export async function removeLogEntryFromStore(id) { + dayData.log = dayData.log.filter(e => e.id !== id) + await refreshSummary() +}