From 2ced969396e4297f51abea0dc0e3fb287cc5ac0b Mon Sep 17 00:00:00 2001
From: Shahed Nasser <shahednasser@gmail.com>
Date: Mon, 19 May 2025 10:05:57 +0300
Subject: [PATCH] docs: change recipes on homepage (#12520)

* docs: changed recipes on homepage

* export icon
---
 .../Homepage/RecipesSection/index.tsx         | 24 +++----
 .../components/Icons/BundledProduct/index.tsx | 72 +++++++++++++++++++
 .../docs-ui/src/components/Icons/index.tsx    |  1 +
 www/yarn.lock                                 |  6 +-
 4 files changed, 88 insertions(+), 15 deletions(-)
 create mode 100644 www/packages/docs-ui/src/components/Icons/BundledProduct/index.tsx

diff --git a/www/apps/book/components/Homepage/RecipesSection/index.tsx b/www/apps/book/components/Homepage/RecipesSection/index.tsx
index bd77badf7e..a543c450b7 100644
--- a/www/apps/book/components/Homepage/RecipesSection/index.tsx
+++ b/www/apps/book/components/Homepage/RecipesSection/index.tsx
@@ -1,5 +1,6 @@
 import clsx from "clsx"
 import {
+  BundledProductIcon,
   CalendarRefreshIcon,
   Card,
   CardProps,
@@ -8,13 +9,19 @@ import {
   IconHeadline,
   ImageBinaryIcon,
   Link,
-  RestockIcon,
   ScrollTextIcon,
   ShopIcon,
 } from "docs-ui"
 
 const HomepageRecipesSection = () => {
   const cards: CardProps[] = [
+    {
+      type: "large",
+      title: "Marketplace",
+      text: "Build a marketplace with multiple vendors.",
+      href: "https://docs.medusajs.com/resources/recipes/marketplace/examples/vendors",
+      icon: ShopIcon,
+    },
     {
       type: "large",
       title: "ERP",
@@ -24,10 +31,10 @@ const HomepageRecipesSection = () => {
     },
     {
       type: "large",
-      title: "Marketplace",
-      text: "Build a marketplace with multiple vendors.",
-      href: "https://docs.medusajs.com/resources/recipes/marketplace/examples/vendors",
-      icon: ShopIcon,
+      title: "Bundled Products",
+      text: "Sell products as bundles with Admin and storefront customizations.",
+      href: "https://docs.medusajs.com/resources/recipes/bundled-products/examples/standard",
+      icon: BundledProductIcon,
     },
     {
       type: "large",
@@ -50,13 +57,6 @@ const HomepageRecipesSection = () => {
       href: "https://docs.medusajs.com/resources/recipes/digital-products/examples/standard",
       icon: ImageBinaryIcon,
     },
-    {
-      type: "large",
-      title: "Restock Notifications",
-      text: "Notify customers when a product is back in stock.",
-      href: "https://docs.medusajs.com/resources/recipes/commerce-automation/restock-notification",
-      icon: RestockIcon,
-    },
   ]
   return (
     <div className={clsx("py-4 w-full")}>
diff --git a/www/packages/docs-ui/src/components/Icons/BundledProduct/index.tsx b/www/packages/docs-ui/src/components/Icons/BundledProduct/index.tsx
new file mode 100644
index 0000000000..f5003f35d2
--- /dev/null
+++ b/www/packages/docs-ui/src/components/Icons/BundledProduct/index.tsx
@@ -0,0 +1,72 @@
+import React from "react"
+import { IconProps } from "@medusajs/icons/dist/types"
+
+export const BundledProductIcon = (props: IconProps) => {
+  return (
+    <svg
+      width="32"
+      height="32"
+      viewBox="0 0 32 32"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        opacity="0.3"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M4.88892 6.66664V25.3333C4.88892 27.297 6.48079 28.8889 8.44447 28.8889H23.5556C25.5193 28.8889 27.1111 27.297 27.1111 25.3333V6.66664C27.1111 4.70296 25.5193 3.11108 23.5556 3.11108H8.44447C6.48079 3.11108 4.88892 4.70296 4.88892 6.66664ZM12.8889 8.44442C11.1716 8.44442 9.7778 9.83642 9.7778 11.5555C9.7778 13.2746 11.1716 14.6666 12.8889 14.6666H16H19.1111C20.8285 14.6666 22.2222 13.2746 22.2222 11.5555C22.2222 9.83642 20.8285 8.44442 19.1111 8.44442C17.3938 8.44442 16 9.83642 16 11.5555C16 9.83642 14.6062 8.44442 12.8889 8.44442Z"
+        fill="currentColor"
+      />
+      <path
+        d="M16 3.11108V28.8889"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M4.88892 14.6667H27.1111"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16 14.6667L21.76 20.4267"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M12.8888 8.44458C11.1715 8.44458 9.77771 9.83658 9.77771 11.5557C9.77771 13.2748 11.1715 14.6668 12.8888 14.6668H15.9999V11.5557C15.9999 9.83658 14.6062 8.44458 12.8888 8.44458Z"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16 14.6667L10.24 20.4267"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M19.1111 8.44458C20.8284 8.44458 22.2222 9.83658 22.2222 11.5557C22.2222 13.2748 20.8284 14.6668 19.1111 14.6668H16V11.5557C16 9.83658 17.3938 8.44458 19.1111 8.44458Z"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M4.88892 6.66664V25.3333C4.88892 27.297 6.48079 28.8889 8.44447 28.8889H23.5556C25.5193 28.8889 27.1111 27.297 27.1111 25.3333V6.66664C27.1111 4.70296 25.5193 3.11108 23.5556 3.11108H8.44447C6.48079 3.11108 4.88892 4.70296 4.88892 6.66664Z"
+        stroke="currentColor"
+        strokeWidth="2.66667"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  )
+}
diff --git a/www/packages/docs-ui/src/components/Icons/index.tsx b/www/packages/docs-ui/src/components/Icons/index.tsx
index a4e85a5d8d..a4c3f5d392 100644
--- a/www/packages/docs-ui/src/components/Icons/index.tsx
+++ b/www/packages/docs-ui/src/components/Icons/index.tsx
@@ -1,4 +1,5 @@
 export * from "./AiAssistant"
+export * from "./BundledProduct"
 export * from "./CalendarRefresh"
 export * from "./ChefHat"
 export * from "./CircleDottedLine"
diff --git a/www/yarn.lock b/www/yarn.lock
index 8406e48fcf..bc197e3064 100644
--- a/www/yarn.lock
+++ b/www/yarn.lock
@@ -6833,9 +6833,9 @@ __metadata:
   linkType: hard
 
 "caniuse-lite@npm:^1.0.30001464, caniuse-lite@npm:^1.0.30001578, caniuse-lite@npm:^1.0.30001579, caniuse-lite@npm:^1.0.30001587":
-  version: 1.0.30001666
-  resolution: "caniuse-lite@npm:1.0.30001666"
-  checksum: 2d49e9be676233c24717f12aad3d01b3e5f902b457fe1deefaa8d82e64786788a8f79381ae437c61b50e15c9aea8aeb59871b1d54cb4c28b9190d53d292e2339
+  version: 1.0.30001718
+  resolution: "caniuse-lite@npm:1.0.30001718"
+  checksum: 67f9ad09bc16443e28d14f265d6e468480cd8dc1900d0d8b982222de80c699c4f2306599c3da8a3fa7139f110d4b30d49dbac78f215470f479abb6ffe141d5d3
   languageName: node
   linkType: hard