fix: make recipe crawling work

components/Emoji.tsx

@@ -10,5 +10,5 @@ export const Emoji = (props: { class?: string; name: string }) => {
         />
       )
       : <span>{props.name}</span>
-    : <></>;
+    : null;
 };

lib/recipeSchema.ts

@@ -18,8 +18,9 @@ export const IngredientGroupSchema = z.object({
 export type IngredientGroup = z.infer<typeof IngredientGroupSchema>;
 
 const recipeSchema = z.object({
+  _type: z.literal("Recipe"),
   name: z.string().describe(
-    "Title of the Recipe, without the name of the website or author",
+    "Name of the Recipe, without the name of the website or author",
   ),
   description: z.string().describe(
     "Optional, short description of the recipe",
@@ -41,11 +42,7 @@ const recipeSchema = z.object({
 
 export type Recipe = z.infer<typeof recipeSchema>;
 
-const noRecipeSchema = z.object({
+const noRecipeSchema = z.literal("none").describe("No Recipe found");
-  errorMessages: z.array(z.string()).describe(
-    "List of error messages, if no recipe was found",
-  ),
-});
 
 export const recipeResponseSchema = z.union([recipeSchema, noRecipeSchema]);
 

lib/resources.ts

@@ -1,26 +1,26 @@
 export const resources = {
   "home": {
-    emoji: "House with Garden.png",
+    emoji: "home_icon.png",
     name: "Home",
     link: "/",
   },
   "recipe": {
-    emoji: "Fork and Knife with Plate.png",
+    emoji: "recipes_icon.png",
     name: "Recipes",
     link: "/recipes",
   },
   "movie": {
-    emoji: "Popcorn.png",
+    emoji: "movies_icon.png",
     name: "Movies",
     link: "/movies",
   },
   "article": {
-    emoji: "Writing Hand Medium-Light Skin Tone.png",
+    emoji: "articles_icon.png",
     name: "Articles",
     link: "/articles",
   },
   "series": {
-    emoji: "Television.png",
+    emoji: "tv_series_icon.png",
     name: "Series",
     link: "/series",
   },

lib/string.ts

@@ -17,6 +17,7 @@ export function safeFileName(input: string): string {
     .normalize("NFKD")
     .replace(/[\u0300-\u036f]/g, "")
     .replace(/[\s-]+/g, "_")
+    .replace(/-+/g, "-")
     .replace(/[^A-Za-z0-9_]+/g, "")
     .replace(/_+/g, "_")
     // Trim underscores/dots from ends and prevent leading dots

lib/webScraper.ts

@@ -181,7 +181,7 @@ export async function webScrape(
 
   return {
     ...result,
-    dom,
+    dom: dom.window.document,
     markdown: turndownService.turndown(result.content),
   };
 }

routes/api/recipes/create/index.ts

@@ -37,17 +37,17 @@ async function processCreateRecipeFromUrl(
   let recipe: z.infer<typeof recipeSchema> | undefined = undefined;
   if (jsonLds.length > 0) {
     for (const jsonLd of jsonLds) {
-      recipe = parseJsonLdToRecipeSchema(jsonLd.textContent || "");
+      if (jsonLd.textContent) {
-      if (recipe) break;
+        recipe = parseJsonLdToRecipeSchema(jsonLd.textContent);
+        if (recipe) break;
+      }
     }
   }
 
   if (!recipe) {
     const res = await openai.extractRecipe(result.markdown);
-    if (!res || "errorMessages" in res) {
+    if (!res || res === "none") {
-      const errorMessage = res?.errorMessages?.[0] ||
+      streamResponse.error(`failed to extract recipe: ${res}`);
-        "could not extract recipe";
-      streamResponse.error(`failed to extract recipe: ${errorMessage}`);
       return;
     }
     recipe = res;
@@ -72,9 +72,7 @@ async function processCreateRecipeFromUrl(
 
   if (newRecipe?.image && newRecipe.image.length > 5) {
     const extension = fileExtension(newRecipe.image);
-    const finalPath = `resources/recipes/images/${
+    const finalPath = `recipes/images/${safeFileName(id)}_cover.${extension}`;
-      safeFileName(id)
-    }_cover.${extension}`;
     streamResponse.info("downloading image");
     try {
       streamResponse.info("downloading image");
@@ -82,7 +80,7 @@ async function processCreateRecipeFromUrl(
       streamResponse.info("saving image");
       const buffer = await res.arrayBuffer();
       await createResource(finalPath, buffer);
-      newRecipe.image = finalPath;
+      newRecipe.image = `resources/${finalPath}`;
     } catch (err) {
       console.log("Failed to save image", err);
     }

routes/api/recipes/create/parseJsonLd.ts

@@ -1,5 +1,4 @@
-import recipeSchema from "@lib/recipeSchema.ts";
+import recipeSchema, { Recipe } from "@lib/recipeSchema.ts";
-import { parseIngredients } from "@lib/parseIngredient.ts";
 
 export function parseJsonLdToRecipeSchema(jsonLdContent: string) {
   try {
@@ -19,12 +18,7 @@ export function parseJsonLdToRecipeSchema(jsonLdContent: string) {
       return;
     }
 
-    // Map and parse ingredients into the new schema
+    const recipeInstructions = Array.isArray(data.recipeInstructions)
-    const ingredients = parseIngredients(
-      data?.recipeIngredient?.join("\n") || "",
-    );
-
-    const instructions = Array.isArray(data.recipeInstructions)
       ? data.recipeInstructions.map((instr: unknown) => {
         if (!instr) return "";
         if (typeof instr === "string") return instr;
@@ -36,43 +30,41 @@ export function parseJsonLdToRecipeSchema(jsonLdContent: string) {
       : [];
 
     // Parse servings
-    const servings = parseServings(data.recipeYield);
+    const recipeYield = parseServings(data.recipeYield);
 
     // Parse times
-    const prepTime = parseDuration(data.prepTime);
-    const cookTime = parseDuration(data.cookTime);
     const totalTime = parseDuration(data.totalTime);
 
     // Extract tags
-    const tags = data.keywords
+    const keywords = data.keywords
       ? Array.isArray(data.keywords)
         ? data.keywords
         : data.keywords.split(",").map((tag: string) => tag.trim())
       : [];
 
     // Build the recipe object
-    const recipe = {
+    const recipe: Recipe = {
       _type: "Recipe",
-      title: data.name || "Unnamed Recipe",
+      name: data.name || "Unnamed Recipe",
       image: pickImage(image || data.image || ""),
-      author: Array.isArray(data.author)
+      author: {
-        ? data.author.map((a: { name: string }) => a.name).join(", ")
+        "_type": "Person",
-        : data.author?.name || "",
+        name: Array.isArray(data.author)
+          ? data.author.map((a: { name: string }) => a.name).join(", ")
+          : data.author?.name || "",
+      },
       description: data.description || "",
-      ingredients,
+      recipeIngredient: data.recipeIngredient,
-      instructions,
+      recipeInstructions,
-      servings,
+      recipeYield,
-      prepTime,
-      cookTime,
       totalTime,
-      tags,
+      keywords,
-      notes: data.notes || [],
     };
 
     // Validate against the schema
     return recipeSchema.parse(recipe);
   } catch (error) {
-    console.error("Invalid JSON-LD content or parsing error:", error);
+    console.log("Invalid JSON-LD content or parsing error:", error);
     return undefined;
   }
 }

routes/articles/index.tsx

@@ -49,8 +49,9 @@ export default function Greet(
       <RedirectSearchHandler />
       <KMenu type="main" context={{ type: "articles" }} />
       <Grid>
-        {articles?.map((doc) => (
+        {articles?.map((doc, i) => (
           <ResourceCard
+            key={doc.name || i}
             sublink="articles"
             res={doc}
           />

routes/index.tsx

@@ -12,14 +12,12 @@ export default function Home(props: PageProps) {
       <RedirectSearchHandler />
       <KMenu type="main" context={false} />
       <MainLayout url={props.url}>
-        <h1 class="text-4xl mb-4 mt-3 text-white flex gap-2">
-          <img src="/favicon.png" class="w-8 h-8 inline" />
-          Resources
-        </h1>
         <div class="flex flex-wrap items-center gap-4">
           {Object.values(resources).filter((v) => v.link !== "/").map((m) => {
             return (
               <Card
+                splotch
+                key={m.link}
                 title={`${m.name}`}
                 backgroundSize={80}
                 image={`${

routes/movies/index.tsx

@@ -52,7 +52,7 @@ export default async function MovieIndex(
       </header>
       <Grid>
         {movies?.map((doc, i) => {
-          return <ResourceCard key={i} res={doc} />;
+          return <ResourceCard key={doc.name || i} res={doc} />;
         })}
       </Grid>
     </MainLayout>

routes/series/index.tsx

@@ -50,7 +50,9 @@ export default function Greet(
       </header>
       <Grid>
         {series?.map((doc, i) => {
-          return <ResourceCard key={i} sublink="series" res={doc} />;
+          return (
+            <ResourceCard key={doc.name || i} sublink="series" res={doc} />
+          );
         })}
       </Grid>
     </MainLayout>