crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-19 16:07:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updates

Browse Source
This commit is contained in:
Henrik Larsson 2023-08-21 11:42:16 +02:00
parent 028db7375d
commit 21f4893b70
9 changed files with 80 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/layout/header/desktop-menu/desktop-menu.tsx
View File

@ -3,6 +3,10 @@
import Link from 'next-intl/link';
export default function DesktopMenu({ items }: { items: [] }) {
if (!items) {
return;
}
return (
<ul className="flex gap-6">
{items.map((item: { title: string; slug: string }, i: number) => {

17
components/layout/header/header.tsx
View File

@ -2,9 +2,12 @@ import Cart from 'components/cart';
import OpenCart from 'components/cart/open-cart';
import Logo from 'components/ui/logo/logo';
import { getMainMenu } from '@/lib/sanity/sanity.fetch';
import Link from 'next/link';
import { Suspense } from 'react';
import DesktopMenu from './desktop-menu/desktop-menu';
import HeaderRoot from './header-root';
import MobileMenuModal from './mobile-menu/modal';
import OpenMobileMenu from './mobile-menu/open-mobile-menu';
import SearchModal from './search/modal';
import OpenSearch from './search/open-search';
@ -14,10 +17,10 @@ interface HeaderProps {
locale: string;
}
export default async function Header({ locale }: HeaderProps) {
// const params = {
// locale: locale
// };
// const mainMenu = await getCachedClient()(categoriesQuery, params);
const params = {
locale: locale
};
const mainMenu = await getMainMenu(params.locale);
return (
<HeaderRoot>
@ -25,7 +28,7 @@ export default async function Header({ locale }: HeaderProps) {
<div className="relative flex w-full items-center justify-between px-4 py-2 lg:px-8 2xl:px-16">
<div className="-translate-x-2 transform md:hidden">
<Suspense fallback={<OpenMobileMenu />}>
{/* <MobileMenuModal items={mainMenu} /> */}
<MobileMenuModal items={mainMenu} />
</Suspense>
</div>
@ -40,7 +43,9 @@ export default async function Header({ locale }: HeaderProps) {
</div>
<div className="absolute left-1/2 top-1/2 hidden -translate-x-1/2 -translate-y-1/2 transform md:flex">
<Suspense>{/* <DesktopMenu items={mainMenu} /> */}</Suspense>
<Suspense>
<DesktopMenu items={mainMenu} />
</Suspense>
</div>
<div className="flex translate-x-2 transform justify-end space-x-1">
<Suspense fallback={<OpenSearch />}>

6
components/layout/header/mobile-menu/modal.tsx
View File

@ -6,12 +6,16 @@ import { useState } from 'react';
import OpenMobileMenu from './open-mobile-menu';
interface MobileMenuModalProps {
items: [];
items: [] | null;
}
export default function MobileMenuModal({ items }: MobileMenuModalProps) {
const [isOpen, setIsOpen] = useState(false);
if (!items) {
return;
}
return (
<>
<Sheet open={isOpen} onOpenChange={() => setIsOpen(!isOpen)}>

2
lib/sanity/queries.tsx
View File

@ -269,7 +269,7 @@ export const categoryQuery = `*[_type == "category" && slug.current == $slug &&
}`;
// Categories query
export const categoriesQuery = `*[_type == "category" && language == $locale] | order(title asc) {
export const mainMenuQuery = `*[_type == "category" && language == $locale] | order(title asc) {
_type,
title,
"slug": slug.current,

14
lib/sanity/sanity.fetch.ts
View File

@ -7,9 +7,9 @@ import { draftMode } from 'next/headers'
import { revalidateSecret } from './sanity.api'
import { categoryQuery, homePageQuery, pageQuery, productQuery, searchPageQuery } from './queries'
import { categoryQuery, homePageQuery, mainMenuQuery, pageQuery, productQuery, searchPageQuery } from './queries'
import { CategoryPayload, HomePagePayload, PagePayload, ProductPayload, SearchPayload } from './sanity.types'
import { CategoryPayload, HomePagePayload, MainMenuPayload, PagePayload, ProductPayload, SearchPayload } from './sanity.types'
export const token = process.env.SANITY_API_READ_TOKEN
@ -56,7 +56,7 @@ export function getHomePage(locale: string) {
return sanityFetch<HomePagePayload | null>({
query: homePageQuery,
params: { locale },
tags: ['home', 'products', 'categories', 'page'],
tags: ['home', 'products', 'categories', 'page', 'menu'],
})
}
@ -91,3 +91,11 @@ export function getSearch(slug: string, locale: string) {
tags: ['search'],
})
}
export function getMainMenu(locale: string) {
return sanityFetch<MainMenuPayload | null>({
query: mainMenuQuery,
params: { locale },
tags: ['menu'],
})
}

6
lib/sanity/sanity.types.ts
View File

@ -59,3 +59,9 @@ export interface SearchPayload {
image: Image
}
}
export interface MainMenuPayload {
title?: string
_type?: string
items: []
}

1
lib/sanity/utils/get-preview-url.ts
View File

@ -3,6 +3,7 @@ import { isDev, SanityDocument } from 'sanity'
import { localStorefrontPreviewUrl, publicStorefrontPreviewUrl } from '../constants'
const SANITY_STUDIO_API_READ_TOKEN = "skYG2HXNga8uxSL7rFIreJEnP0SdVjCZ2nzB8rUHD4wRWxXPGceXTuR5vCVBP99mWZ9ULhghmpUyX7EtzDmJusSk6Gwvdr3nLAsdWI9ZktIWvSWUNpHbu0Xfrrt0UUaktrLglk7ToABvjXlaPHLpOIR3dnjl4MGByutPmyra0b5t20kgDrmF"
// Customise this function to show the correct URL based on the current document
export default async function getPreviewUrl(doc: SanityDocument) {

2
package.json
View File

@ -42,7 +42,7 @@
"clsx": "^1.2.1",
"framer-motion": "^8.5.5",
"is-empty-iterable": "^3.0.0",
"next": "13.4.13",
"next": "13.4.19",
"next-intl": "2.19.1",
"next-sanity": "^5.4.2",
"react": "18.2.0",

80
pnpm-lock.yaml generated
View File

@ -75,14 +75,14 @@ dependencies:
specifier: ^3.0.0
version: 3.0.0
next:
specifier: 13.4.13
version: 13.4.13(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
specifier: 13.4.19
version: 13.4.19(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
next-intl:
specifier: 2.19.1
version: 2.19.1(next@13.4.13)(react@18.2.0)
version: 2.19.1(next@13.4.19)(react@18.2.0)
next-sanity:
specifier: ^5.4.2
version: 5.4.2(@sanity/client@6.4.4)(@sanity/icons@2.4.1)(@sanity/types@3.15.0)(@sanity/ui@1.7.4)(@types/styled-components@5.1.26)(next@13.4.13)(react@18.2.0)(sanity@3.15.0)(styled-components@5.3.11)
version: 5.4.2(@sanity/client@6.4.4)(@sanity/icons@2.4.1)(@sanity/types@3.15.0)(@sanity/ui@1.7.4)(@types/styled-components@5.1.26)(next@13.4.19)(react@18.2.0)(sanity@3.15.0)(styled-components@5.3.11)
react:
specifier: 18.2.0
version: 18.2.0
@ -1284,8 +1284,8 @@ packages:
- utf-8-validate
dev: true
/@next/env@13.4.13:
resolution: {integrity: sha512-fwz2QgVg08v7ZL7KmbQBLF2PubR/6zQdKBgmHEl3BCyWTEDsAQEijjw2gbFhI1tcKfLdOOJUXntz5vZ4S0Polg==}
/@next/env@13.4.19:
resolution: {integrity: sha512-FsAT5x0jF2kkhNkKkukhsyYOrRqtSxrEhfliniIq0bwWbuXLgyt3Gv0Ml+b91XwjwArmuP7NxCiGd++GGKdNMQ==}
dev: false
/@next/eslint-plugin-next@13.4.13:
@ -1294,8 +1294,8 @@ packages:
glob: 7.1.7
dev: true
/@next/swc-darwin-arm64@13.4.13:
resolution: {integrity: sha512-ZptVhHjzUuivnXMNCJ6lER33HN7lC+rZ01z+PM10Ows21NHFYMvGhi5iXkGtBDk6VmtzsbqnAjnx4Oz5um0FjA==}
/@next/swc-darwin-arm64@13.4.19:
resolution: {integrity: sha512-vv1qrjXeGbuF2mOkhkdxMDtv9np7W4mcBtaDnHU+yJG+bBwa6rYsYSCI/9Xm5+TuF5SbZbrWO6G1NfTh1TMjvQ==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [darwin]
@ -1303,8 +1303,8 @@ packages:
dev: false
optional: true
/@next/swc-darwin-x64@13.4.13:
resolution: {integrity: sha512-t9nTiWCLApw8W4G1kqJyYP7y6/7lyal3PftmRturIxAIBlZss9wrtVN8nci50StDHmIlIDxfguYIEGVr9DbFTg==}
/@next/swc-darwin-x64@13.4.19:
resolution: {integrity: sha512-jyzO6wwYhx6F+7gD8ddZfuqO4TtpJdw3wyOduR4fxTUCm3aLw7YmHGYNjS0xRSYGAkLpBkH1E0RcelyId6lNsw==}
engines: {node: '>= 10'}
cpu: [x64]
os: [darwin]
@ -1312,8 +1312,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-arm64-gnu@13.4.13:
resolution: {integrity: sha512-xEHUqC8eqR5DHe8SOmMnDU1K3ggrJ28uIKltrQAwqFSSSmzjnN/XMocZkcVhuncuxYrpbri0iMQstRyRVdQVWg==}
/@next/swc-linux-arm64-gnu@13.4.19:
resolution: {integrity: sha512-vdlnIlaAEh6H+G6HrKZB9c2zJKnpPVKnA6LBwjwT2BTjxI7e0Hx30+FoWCgi50e+YO49p6oPOtesP9mXDRiiUg==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
@ -1321,8 +1321,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-arm64-musl@13.4.13:
resolution: {integrity: sha512-sNf3MnLAm8rquSSAoeD9nVcdaDeRYOeey4stOWOyWIgbBDtP+C93amSgH/LPTDoUV7gNiU6f+ghepTjTjRgIUQ==}
/@next/swc-linux-arm64-musl@13.4.19:
resolution: {integrity: sha512-aU0HkH2XPgxqrbNRBFb3si9Ahu/CpaR5RPmN2s9GiM9qJCiBBlZtRTiEca+DC+xRPyCThTtWYgxjWHgU7ZkyvA==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [linux]
@ -1330,8 +1330,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-x64-gnu@13.4.13:
resolution: {integrity: sha512-WhcRaJJSHyx9OWmKjjz+OWHumiPZWRqmM/09Bt7Up4UqUJFFhGExeztR4trtv3rflvULatu9IH/nTV8fUUgaMA==}
/@next/swc-linux-x64-gnu@13.4.19:
resolution: {integrity: sha512-htwOEagMa/CXNykFFeAHHvMJeqZfNQEoQvHfsA4wgg5QqGNqD5soeCer4oGlCol6NGUxknrQO6VEustcv+Md+g==}
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
@ -1339,8 +1339,8 @@ packages:
dev: false
optional: true
/@next/swc-linux-x64-musl@13.4.13:
resolution: {integrity: sha512-+Y4LLhOWWZQIDKVwr2R17lq2KSN0F1c30QVgGIWfnjjHpH8nrIWHEndhqYU+iFuW8It78CiJjQKTw4f51HD7jA==}
/@next/swc-linux-x64-musl@13.4.19:
resolution: {integrity: sha512-4Gj4vvtbK1JH8ApWTT214b3GwUh9EKKQjY41hH/t+u55Knxi/0wesMzwQRhppK6Ddalhu0TEttbiJ+wRcoEj5Q==}
engines: {node: '>= 10'}
cpu: [x64]
os: [linux]
@ -1348,8 +1348,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-arm64-msvc@13.4.13:
resolution: {integrity: sha512-rWurdOR20uxjfqd1X9vDAgv0Jb26KjyL8akF9CBeFqX8rVaBAnW/Wf6A2gYEwyYY4Bai3T7p1kro6DFrsvBAAw==}
/@next/swc-win32-arm64-msvc@13.4.19:
resolution: {integrity: sha512-bUfDevQK4NsIAHXs3/JNgnvEY+LRyneDN788W2NYiRIIzmILjba7LaQTfihuFawZDhRtkYCv3JDC3B4TwnmRJw==}
engines: {node: '>= 10'}
cpu: [arm64]
os: [win32]
@ -1357,8 +1357,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-ia32-msvc@13.4.13:
resolution: {integrity: sha512-E8bSPwRuY5ibJ3CzLQmJEt8qaWrPYuUTwnrwygPUEWoLzD5YRx9SD37oXRdU81TgGwDzCxpl7z5Nqlfk50xAog==}
/@next/swc-win32-ia32-msvc@13.4.19:
resolution: {integrity: sha512-Y5kikILFAr81LYIFaw6j/NrOtmiM4Sf3GtOc0pn50ez2GCkr+oejYuKGcwAwq3jiTKuzF6OF4iT2INPoxRycEA==}
engines: {node: '>= 10'}
cpu: [ia32]
os: [win32]
@ -1366,8 +1366,8 @@ packages:
dev: false
optional: true
/@next/swc-win32-x64-msvc@13.4.13:
resolution: {integrity: sha512-4KlyC6jWRubPnppgfYsNTPeWfGCxtWLh5vaOAW/kdzAk9widqho8Qb5S4K2vHmal1tsURi7Onk2MMCV1phvyqA==}
/@next/swc-win32-x64-msvc@13.4.19:
resolution: {integrity: sha512-YzA78jBDXMYiINdPdJJwGgPNT3YqBNNGhsthsDoWHL9p24tEJn9ViQf/ZqTbwSpX/RrkPupLfuuTH2sf73JBAw==}
engines: {node: '>= 10'}
cpu: [x64]
os: [win32]
@ -6090,7 +6090,7 @@ packages:
engines: {node: '>= 0.6'}
dev: false
/next-intl@2.19.1(next@13.4.13)(react@18.2.0):
/next-intl@2.19.1(next@13.4.19)(react@18.2.0):
resolution: {integrity: sha512-fk+IGWXxA+UOk+3rIhQqSPYxka+Hk9qKaIpbeF3nNlf8dp1td0oT6srVrPw/uZl5Qoj8El3qQ2mVd3RTLA25cg==}
engines: {node: '>=10'}
peerDependencies:
@ -6099,12 +6099,12 @@ packages:
dependencies:
'@formatjs/intl-localematcher': 0.2.32
negotiator: 0.6.3
next: 13.4.13(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
next: 13.4.19(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
react: 18.2.0
use-intl: 2.19.1(react@18.2.0)
dev: false
/next-sanity@5.4.2(@sanity/client@6.4.4)(@sanity/icons@2.4.1)(@sanity/types@3.15.0)(@sanity/ui@1.7.4)(@types/styled-components@5.1.26)(next@13.4.13)(react@18.2.0)(sanity@3.15.0)(styled-components@5.3.11):
/next-sanity@5.4.2(@sanity/client@6.4.4)(@sanity/icons@2.4.1)(@sanity/types@3.15.0)(@sanity/ui@1.7.4)(@types/styled-components@5.1.26)(next@13.4.19)(react@18.2.0)(sanity@3.15.0)(styled-components@5.3.11):
resolution: {integrity: sha512-gLpS0GlapXtDjRUaPcZ9DUeiNSznhtqh0kyxygQS9MDtecCiphVAhXYwvJMQcxfY1u5KVWAxZMyy+Bs6h8G+jA==}
engines: {node: '>=16.14'}
peerDependencies:
@ -6126,7 +6126,7 @@ packages:
'@sanity/webhook': 2.0.0
'@types/styled-components': 5.1.26
groq: 3.15.0
next: 13.4.13(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
next: 13.4.19(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0)
react: 18.2.0
sanity: 3.15.0(@types/node@18.13.0)(@types/react@18.2.19)(react-dom@18.2.0)(react@18.2.0)(styled-components@5.3.11)
styled-components: 5.3.11(@babel/core@7.22.10)(react-dom@18.2.0)(react-is@18.2.0)(react@18.2.0)
@ -6134,8 +6134,8 @@ packages:
- supports-color
dev: false
/next@13.4.13(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-A3YVbVDNeXLhWsZ8Nf6IkxmNlmTNz0yVg186NJ97tGZqPDdPzTrHotJ+A1cuJm2XfuWPrKOUZILl5iBQkIf8Jw==}
/next@13.4.19(@babel/core@7.22.10)(react-dom@18.2.0)(react@18.2.0):
resolution: {integrity: sha512-HuPSzzAbJ1T4BD8e0bs6B9C1kWQ6gv8ykZoRWs5AQoiIuqbGHHdQO7Ljuvg05Q0Z24E2ABozHe6FxDvI6HfyAw==}
engines: {node: '>=16.8.0'}
hasBin: true
peerDependencies:
@ -6149,7 +6149,7 @@ packages:
sass:
optional: true
dependencies:
'@next/env': 13.4.13
'@next/env': 13.4.19
'@swc/helpers': 0.5.1
busboy: 1.6.0
caniuse-lite: 1.0.30001519
@ -6160,15 +6160,15 @@ packages:
watchpack: 2.4.0
zod: 3.21.4
optionalDependencies:
'@next/swc-darwin-arm64': 13.4.13
'@next/swc-darwin-x64': 13.4.13
'@next/swc-linux-arm64-gnu': 13.4.13
'@next/swc-linux-arm64-musl': 13.4.13
'@next/swc-linux-x64-gnu': 13.4.13
'@next/swc-linux-x64-musl': 13.4.13
'@next/swc-win32-arm64-msvc': 13.4.13
'@next/swc-win32-ia32-msvc': 13.4.13
'@next/swc-win32-x64-msvc': 13.4.13
'@next/swc-darwin-arm64': 13.4.19
'@next/swc-darwin-x64': 13.4.19
'@next/swc-linux-arm64-gnu': 13.4.19
'@next/swc-linux-arm64-musl': 13.4.19
'@next/swc-linux-x64-gnu': 13.4.19
'@next/swc-linux-x64-musl': 13.4.19
'@next/swc-win32-arm64-msvc': 13.4.19
'@next/swc-win32-ia32-msvc': 13.4.19
'@next/swc-win32-x64-msvc': 13.4.19
transitivePeerDependencies:
- '@babel/core'
- babel-plugin-macros