import type { Meal, RecipeImportDraftView, WeekDay } from "@batch-cooking/shared"; import { useTranslation } from "react-i18next"; import { Link } from "react-router-dom"; import { StepDescription } from "./StepDescription"; import "./recipes.scss"; /** State {@link SourceItemPreviewPanel} renders — mirrors `RecipeDetailState`'s shape (`RecipeDetailPanel`), one status short (no "not-found": an invalid `externalId` surfaces as `"error"`, there's no separate "id was well-formed but nothing matched it" case here). */ export type SourceItemPreviewState = | { status: "empty" } | { status: "loading" } | { status: "loaded"; draft: RecipeImportDraftView } | { status: "error" }; /** * Right-hand panel of the catalog's "Sources" tab (`RecipeSourcesPanel`) — * a read-only preview of a not-yet-imported item: nothing here can be * edited or saved yet (no favorite/edit/delete actions, unlike * `RecipeDetailPanel`) — turning this into an actual import with a review * step for unresolved ingredients is a later stage of the same plan. * Reuses `StepDescription` so a step's detected techniques are already * highlighted here too, exactly like a saved recipe's detail. */ export function SourceItemPreviewPanel({ state, planningSlot, }: { state: SourceItemPreviewState; /** * Set only when this panel is rendered from `RecipePickerDialog` (adding a * recipe to one planning slot) rather than the standalone `/recettes` * catalog — carried along on the "Importer cette recette" link as query * params so `ImportRecipePage` knows to add the freshly-created recipe to * this exact slot once the import succeeds, instead of landing on the * recipe's own detail page. See `ImportRecipePage`'s `planningSlot`. */ planningSlot?: { date: string; weekDay: WeekDay; meal: Meal }; }) { const { t } = useTranslation(); if (state.status === "empty") { return ( ); } if (state.status === "loading") { return ( ); } if (state.status === "error") { return ( ); } const { draft } = state; const hasUnresolvedIngredient = draft.ingredients.some( (ingredient) => ingredient.ingredient === null, ); return ( ); }