import Head from "next/head"; import Link from "next/link"; import { useRouter } from "next/router"; import ReaderNav from "../../../components/reader/ReaderNav"; import ReaderFooter from "../../../components/reader/ReaderFooter"; import WorkflowBlock from "../../../components/reader/WorkflowBlock"; import useActivation from "../../../components/reader/useActivation"; import { RECIPES, RECIPES_BY_ID } from "../../../data/sample-chapter"; export default function RecipeFocus() { const router = useRouter(); const raw = typeof router.query.id === "string" ? router.query.id : ""; const recipe = RECIPES_BY_ID[raw] || RECIPES_BY_ID[raw.toUpperCase()] || null; const { complete, toggle } = useActivation(recipe ? [recipe.id] : []); if (!router.isReady) { return ( <>

Loading recipe…

); } if (!recipe) { return ( <> Recipe not in this demo · AIBook.fun
Reading demo · not the live book

This recipe is not in the sample.

The demo ships two nested workflows, RE-01 and RE-02, inside the Real Estate chapter.

Back to the chapter

); } return ( <> {`${recipe.id} on paper · AIBook.fun reading demo`}
Reading demo · not the live book

Print / focus view

← Back to the chapter {" · "} Library

r.id === recipe.id) + 1, 1)} total={RECIPES.length} complete={!!complete[recipe.id]} onToggleComplete={toggle} focused />
); }