// Shared utilities & primitives for the cookbook
// Exports to window so all .jsx files share them.
const { useState, useEffect, useMemo, useRef, useCallback } = React;
// ───── Math / formatting ─────
// Render a fractional quantity nicely. 0.5 → "½", 1.25 → "1¼"
function formatQty(n) {
if (n == null || n === 0 || isNaN(n)) return "";
const sign = n < 0 ? "-" : "";
n = Math.abs(n);
const whole = Math.floor(n);
const frac = n - whole;
const FRACS = [
[1/8, "⅛"], [1/4, "¼"], [1/3, "⅓"], [3/8, "⅜"],
[1/2, "½"], [5/8, "⅝"], [2/3, "⅔"], [3/4, "¾"], [7/8, "⅞"]
];
let bestF = "";
let bestDiff = 0.04;
for (const [v, s] of FRACS) {
const d = Math.abs(frac - v);
if (d < bestDiff) { bestDiff = d; bestF = s; }
}
if (bestF) return `${sign}${whole || ""}${bestF}`.trim();
// fall back to rounded decimal
if (n < 0.1) return n.toFixed(2);
if (n < 10) return (Math.round(n * 4) / 4).toString();
return Math.round(n).toString();
}
// Scale an ingredient list by a factor.
function scaleIngredients(ings, factor) {
return ings.map(i => ({ ...i, qty: i.qty ? i.qty * factor : 0 }));
}
// Scale a weight-based recipe (prime rib). Updates qty proportionally
// and the "cook" mins for any step marked dynamic:"cook".
function scaleByWeight(recipe, newWeight) {
const factor = newWeight / recipe.weightDefault;
const ings = recipe.ingredients.map(i => {
if (i.scalesWithWeight && i.perLb != null) {
return { ...i, qty: i.perLb * newWeight };
}
if (i.scalesWithWeight) {
return { ...i, qty: i.qty * factor };
}
return { ...i };
});
const cookMins = Math.round(newWeight * recipe.cookMinsPerLb);
const restMins = recipe.restMinsPerLb ? Math.round(newWeight * recipe.restMinsPerLb) : null;
const fillTemplates = (d) => {
let out = d.replace("{COOKMINS}", cookMins);
if (restMins != null) out = out.replace("{RESTMINS}", restMins);
return out;
};
const steps = recipe.steps.map(s => {
if (s.dynamic === "cook") return { ...s, mins: cookMins, d: fillTemplates(s.d) };
if (s.dynamic === "rest" && restMins != null) return { ...s, mins: restMins, d: fillTemplates(s.d) };
return { ...s, d: fillTemplates(s.d) };
});
return { ings, steps, cookMins, restMins, factor };
}
// Combine ingredients from multiple scaled recipes into a single shopping list,
// grouped by item-name with summed quantities where units match.
function buildShoppingList(scaledLists) {
const map = new Map();
for (const list of scaledLists) {
for (const ing of list) {
if (!ing.item) continue;
const key = `${ing.item.toLowerCase()}|${ing.unit}`;
const prev = map.get(key);
if (prev) {
prev.qty += ing.qty || 0;
} else {
map.set(key, { ...ing });
}
}
}
// group by ing.grp -> "Produce", "Dairy", etc. but we don't have departments;
// we'll bucket by the first letter into Pantry / Fresh by simple heuristics.
const buckets = { Produce: [], "Meat & Seafood": [], Dairy: [], Pantry: [], Other: [] };
const PRODUCE = /onion|garlic|lemon|herb|parsley|basil|thyme|rosemary|scallion|tomato|shallot|blueberr|potato|ginger|cilantro|mint/i;
const MEAT = /beef|chicken|sausage|pork|brisket|chuck|rib|clam|fish|sea/i;
const DAIRY = /butter|milk|cheese|parm|ricotta|mozzarella|buttermilk|egg|cream/i;
for (const ing of map.values()) {
if (PRODUCE.test(ing.item)) buckets.Produce.push(ing);
else if (MEAT.test(ing.item)) buckets["Meat & Seafood"].push(ing);
else if (DAIRY.test(ing.item)) buckets.Dairy.push(ing);
else buckets.Pantry.push(ing);
}
for (const k of Object.keys(buckets)) {
if (!buckets[k].length) delete buckets[k];
else buckets[k].sort((a, b) => a.item.localeCompare(b.item));
}
return buckets;
}
// ───── Time scheduling — "done by 6pm" ─────
// Given a list of steps with mins and optional `hands` (overlap), and a finish
// Date, return [{startTime, endTime}] for each step. Steps run sequentially —
// a long simmer counts toward finish but the hands-on subset is what you do.
function scheduleForFinish(steps, finishTime) {
const totalMin = steps.reduce((s, x) => s + (x.mins || 0), 0);
let cursor = new Date(finishTime);
const out = new Array(steps.length);
for (let i = steps.length - 1; i >= 0; i--) {
const end = new Date(cursor);
const start = new Date(cursor.getTime() - (steps[i].mins || 0) * 60000);
out[i] = { start, end };
cursor = start;
}
return { schedule: out, totalMin, startTime: cursor };
}
function fmtTime(d) {
if (!d) return "—";
let h = d.getHours();
const m = d.getMinutes();
const am = h < 12;
h = h % 12 || 12;
const mm = m < 10 ? `0${m}` : m;
return `${h}:${mm}${am ? "am" : "pm"}`;
}
function fmtDuration(min) {
if (!min) return "0 min";
if (min < 60) return `${min} min`;
const h = Math.floor(min / 60);
const m = min % 60;
return m ? `${h}h ${m}m` : `${h}h`;
}
// ───── Storage ─────
function useStorage(key, initial) {
const [v, setV] = useState(() => {
try {
const raw = localStorage.getItem(key);
return raw == null ? initial : JSON.parse(raw);
} catch { return initial; }
});
useEffect(() => {
try { localStorage.setItem(key, JSON.stringify(v)); } catch {}
}, [key, v]);
return [v, setV];
}
// ───── Filtering ─────
function applyFilters(recipes, { q, courses, diets, occasions, authors, cuisines, maxTime, difficulties }) {
return recipes.filter(r => {
if (q) {
const hay = `${r.title} ${r.author} ${r.cuisine} ${r.subtitle} ${r.course}`.toLowerCase();
if (!hay.includes(q.toLowerCase())) return false;
}
if (courses?.length && !courses.includes(r.course)) return false;
if (occasions?.length && !occasions.includes(r.occasion)) return false;
if (authors?.length && !authors.includes(r.author)) return false;
if (cuisines?.length && !cuisines.includes(r.cuisine)) return false;
if (difficulties?.length && !difficulties.includes(r.difficulty)) return false;
if (diets?.length && !diets.some(d => r.diet.includes(d))) return false;
if (maxTime && r.total > maxTime) return false;
return true;
});
}
// ───── Icons ─────
const Icon = ({ name, size = 16 }) => {
const paths = {
search: ,
plus: ,
filter: ,
bookmark: ,
bookmarkFill: ,
heart: ,
heartFill: ,
clock: <>,
chef: ,
print: ,
download: ,
share: ,
edit: ,
x: ,
chevR: ,
chevL: ,
chevD: ,
sparkle: ,
check: ,
camera: ,
link: ,
list: ,
grid2: ,
bowl: ,
star: ,
starFill: ,
minus: ,
play: ,
copy: ,
book: ,
serving: ,
paperclip: ,
file: ,
image: ,
};
return (
);
};
// Pill component
const Pill = ({ children, kind = "", onClick, removable }) => (
{children}
{removable && }
);
Object.assign(window, {
formatQty, scaleIngredients, scaleByWeight, buildShoppingList,
scheduleForFinish, fmtTime, fmtDuration,
useStorage, applyFilters,
Icon, Pill,
useState, useEffect, useMemo, useRef, useCallback,
});