separate menus

components/layout/footer.tsx

@@ -2,7 +2,7 @@ import Link from 'next/link';
 
 import FooterMenu from 'components/layout/footer-menu';
 import LogoSquare from 'components/logo-square';
-import { getMenu } from 'lib/shopify';
+import { getFooterMenu, getMenu } from 'lib/shopify';
 import { Suspense } from 'react';
 
 // const { COMPANY_NAME, SITE_NAME } = process.env;
@@ -14,7 +14,7 @@ export default async function Footer() {
   const currentYear = new Date().getFullYear();
   const copyrightDate = 2023 + (currentYear > 2023 ? `-${currentYear}` : '');
   const skeleton = 'w-full h-6 animate-pulse rounded bg-neutral-200 dark:bg-neutral-700';
-  const menu = await getMenu('next-js-frontend-footer-menu');
+  const menu = await getFooterMenu('next-js-frontend-footer-menu');
   const copyrightName = COMPANY_NAME || SITE_NAME || '';
 
   return (

lib/shopify/index.ts

@@ -155,6 +155,32 @@ export async function getCollections(): Promise<Collection[]> {
 }
 
 export const getMenu = async (handle: string): Promise<Menu[]> => {
+  const res = mockFetchResponse({
+    menu: {
+      items: [
+        {
+          title: 'All',
+          path: '/'
+        },
+        {
+          title: 'Summer',
+          path: '/search/summer-collection'
+        },
+        {
+          title: 'Winter',
+          path: '/search/winter-collection'
+        },
+        {
+          title: 'Europe',
+          path: '/search/europe-collection'
+        }
+      ]
+    }
+  });
+  return res.body.data.menu.items;
+};
+
+export const getFooterMenu = async (handle: string): Promise<Menu[]> => {
   const res = mockFetchResponse({
     menu: {
       items: [