362f65656b
Full audit (bugs/UI-UX/backend/feature-gap) turned up a money-leak AI quota bypass, webhook SSRF, and a long tail of missing pagination/auth/a11y work. Fixes land together since HANDOFF.md tracked them as one backlog. - AI routes charge tier quota before generating; nutrition POST is author-only - Webhook dispatch re-validates URL per delivery (SSRF/DNS-rebinding), treats redirects as failures; recipe.published now actually dispatches - New indexes/unique constraints on recipes, meal-planning, comments FK cascade - Recipe PUT/restore snapshot only inside the transaction, after validation - Recipe DELETE cleans up S3 objects (recipe + review photos) - Optimistic UI (favorite/star/follow/shopping-list) rolls back on failure - Upload presign enforces file size cap + per-tier storage quota - Route-level loading/error/not-found states across (app), admin, and root - middleware.ts guards (app)/admin; requireAdmin checks DB role, not cached session; rate limiting applied to both session and API-key branches, bucketed per key; Stripe webhook dedupes by event id - Pagination added to recipes, feed, profile, comments, pantry, admin tables - Nav shows real avatar + profile link + dark-mode toggle; destructive actions standardized on AlertDialog - Unsaved-changes guard + real ingredient/step validation on recipe form; canonical /recipes/[id] used in-app; next/image migration; aria-labels and alt text across icon buttons, avatars, recipe photos - packages/api-types removed (zero callers, too drifted to safely rewire); openapi.ts and ai-keys error shape drift fixed; BYOK decrypt failures now surface instead of silently falling back to the platform key Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
59 lines
1.9 KiB
TypeScript
59 lines
1.9 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import Image from "next/image";
|
|
import { useTranslations } from "next-intl";
|
|
import { Clock } from "lucide-react";
|
|
import { Badge } from "@/components/ui/badge";
|
|
|
|
type Suggestion = {
|
|
id: string;
|
|
title: string;
|
|
photoUrl: string | null;
|
|
usesExpiring: string[];
|
|
};
|
|
|
|
export function ExpiringSoonSuggestions({ suggestions }: { suggestions: Suggestion[] }) {
|
|
const t = useTranslations("pantry");
|
|
|
|
if (suggestions.length === 0) return null;
|
|
|
|
return (
|
|
<div className="rounded-xl border p-4 space-y-3">
|
|
<div className="flex items-center justify-between">
|
|
<h2 className="font-semibold flex items-center gap-2">
|
|
<Clock className="h-4 w-4 text-orange-500" />
|
|
{t("expiringSoonSuggestionsTitle")}
|
|
</h2>
|
|
<Link href="/recipes/can-cook" className="text-sm text-primary hover:underline">
|
|
{t("seeAll")}
|
|
</Link>
|
|
</div>
|
|
<div className="grid grid-cols-1 sm:grid-cols-3 gap-3">
|
|
{suggestions.map((s) => (
|
|
<Link
|
|
key={s.id}
|
|
href={`/recipes/${s.id}`}
|
|
className="rounded-lg border overflow-hidden hover:bg-accent transition-colors"
|
|
>
|
|
{s.photoUrl ? (
|
|
<div className="relative h-24 w-full">
|
|
<Image src={s.photoUrl} alt={s.title} fill className="object-cover" />
|
|
</div>
|
|
) : (
|
|
<div className="h-24 w-full bg-muted" />
|
|
)}
|
|
<div className="p-2 space-y-1">
|
|
<p className="text-sm font-medium truncate">{s.title}</p>
|
|
<Badge variant="outline" className="text-orange-500 border-orange-500 gap-1 text-[11px]">
|
|
<Clock className="h-3 w-3" />
|
|
{s.usesExpiring.slice(0, 2).join(", ")}
|
|
</Badge>
|
|
</div>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|