@graphcommerce/next-ui 8.0.6-canary.3 → 8.1.0-canary.10

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # Change Log
 
+## 8.1.0-canary.10
+
+## 8.1.0-canary.9
+
+### Patch Changes
+
+- [#2223](https://github.com/graphcommerce-org/graphcommerce/pull/2223) [`d7459fe`](https://github.com/graphcommerce-org/graphcommerce/commit/d7459feb6e6902af09ab9ff766c0b3b1a74fb723) - Updated canonicalize helper for better multi domain support
+  ([@bramvanderholst](https://github.com/bramvanderholst))
+
+## 8.1.0-canary.8
+
+### Patch Changes
+
+- [#2247](https://github.com/graphcommerce-org/graphcommerce/pull/2247) [`444e446`](https://github.com/graphcommerce-org/graphcommerce/commit/444e446a218cc9da3defb940a6d5cce0229ff845) - Added clear upgrade instructions for linguiLocale
+  ([@paales](https://github.com/paales))
+
+## 8.1.0-canary.7
+
+## 8.1.0-canary.6
+
+## 8.1.0-canary.5
+
+## 8.0.6-canary.4
+
 ## 8.0.6-canary.3
 
 ## 8.0.6-canary.2

package/Overlay/components/OverlayBase.tsx

@@ -249,7 +249,7 @@ export function OverlayBase(incomingProps: LayoutOverlayBaseProps) {
     const cancelY = scroll.y.on('change', handleScroll)
 
     const ro = new ResizeObserver(handleResize)
-    ro.observe(scrollerRef.current)
+    if (scrollerRef.current) ro.observe(scrollerRef.current)
     ro.observe(beforeRef.current)
     ro.observe(overlayPaneRef.current)
     ro.observe(overlayRef.current)

package/PageMeta/PageMeta.tsx

@@ -70,11 +70,16 @@ export function canonicalize(router: PartialNextRouter, incoming?: Canonical) {
     if (localeDomain) {
       canonical = localeDomain
     } else {
-      href = addBasePath(addLocale(as, curLocale, router.defaultLocale))
+      const conf = storefrontConfig(router.locale)
+
+      href = addBasePath(
+        addLocale(as, curLocale, conf?.domain ? conf.locale : router.defaultLocale),
+      )
+
+      let siteUrl = conf?.canonicalBaseUrl || import.meta.graphCommerce.canonicalBaseUrl
+
+      if (conf?.domain && !conf?.canonicalBaseUrl) siteUrl = `https://${conf.domain}`
 
-      let siteUrl =
-        storefrontConfig(router.locale)?.canonicalBaseUrl ||
-        import.meta.graphCommerce.canonicalBaseUrl
       if (siteUrl.endsWith('/')) siteUrl = siteUrl.slice(0, -1)
 
       canonical = `${siteUrl}${href}`

package/hooks/useDateTimeFormat.ts

@@ -1,7 +1,5 @@
-import { normalizeLocale } from '@graphcommerce/lingui-next'
 import { useMemo } from 'react'
-import { useStorefrontConfig } from './useStorefrontConfig'
-import { useLocale } from '@graphcommerce/next-ui'
+import { useLocale } from './useLocale'
 
 export type DateTimeFormatProps = Intl.DateTimeFormatOptions
 

package/hooks/useMatchMedia.ts

@@ -1,5 +1,24 @@
 import { Breakpoint, useTheme } from '@mui/material'
-import { useMemo } from 'react'
+import { useMotionValue } from 'framer-motion'
+import { useEffect, useMemo } from 'react'
+
+export function useMatchMediaMotionValue(
+  direction: 'up' | 'down',
+  breakpointKey: number | Breakpoint,
+) {
+  const matchValue = useMotionValue(false)
+  const theme = useTheme()
+  const query = theme.breakpoints[direction](breakpointKey).replace(/^@media( ?)/m, '')
+
+  useEffect(() => {
+    const mql = globalThis?.matchMedia(query)
+    const matcher = (e: MediaQueryListEvent) => matchValue.set(e.matches)
+    mql.addEventListener('change', matcher)
+    return () => mql.removeEventListener('change', matcher)
+  }, [matchValue, query])
+
+  return matchValue
+}
 
 export function useMatchMedia() {
   const theme = useTheme()

package/index.ts

@@ -59,3 +59,5 @@ export * from './UspList/UspListItem'
 export * from './hooks'
 export * from './icons'
 export * from './utils/cookie'
+export * from './utils/sitemap'
+export * from './utils/robots'

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/next-ui",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "8.0.6-canary.3",
+  "version": "8.1.0-canary.10",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "eslintConfig": {
@@ -17,6 +17,7 @@
     "@emotion/server": "^11.11.0",
     "@emotion/styled": "^11.11.0",
     "cookie": "^0.6.0",
+    "next-sitemap": "4.2.3",
     "react-is": "^18.2.0"
   },
   "devDependencies": {
@@ -25,14 +26,14 @@
     "typescript": "5.3.3"
   },
   "peerDependencies": {
-    "@graphcommerce/eslint-config-pwa": "^8.0.6-canary.3",
-    "@graphcommerce/framer-next-pages": "^8.0.6-canary.3",
-    "@graphcommerce/framer-scroller": "^8.0.6-canary.3",
-    "@graphcommerce/framer-utils": "^8.0.6-canary.3",
-    "@graphcommerce/image": "^8.0.6-canary.3",
-    "@graphcommerce/lingui-next": "^8.0.6-canary.3",
-    "@graphcommerce/prettier-config-pwa": "^8.0.6-canary.3",
-    "@graphcommerce/typescript-config-pwa": "^8.0.6-canary.3",
+    "@graphcommerce/eslint-config-pwa": "^8.1.0-canary.10",
+    "@graphcommerce/framer-next-pages": "^8.1.0-canary.10",
+    "@graphcommerce/framer-scroller": "^8.1.0-canary.10",
+    "@graphcommerce/framer-utils": "^8.1.0-canary.10",
+    "@graphcommerce/image": "^8.1.0-canary.10",
+    "@graphcommerce/lingui-next": "^8.1.0-canary.10",
+    "@graphcommerce/prettier-config-pwa": "^8.1.0-canary.10",
+    "@graphcommerce/typescript-config-pwa": "^8.1.0-canary.10",
     "@lingui/core": "^4.2.1",
     "@lingui/macro": "^4.2.1",
     "@lingui/react": "^4.2.1",

package/utils/robots.ts

@@ -0,0 +1,41 @@
+import { GetServerSidePropsContext } from 'next'
+
+type Stringifyable = boolean | string | number | null | undefined
+
+/**
+ * Tagged template literal for robots.txt that will automatically stringify values and indent them correctly.
+ * https://developers.google.com/search/docs/crawling-indexing/robots/robots_txt#syntax
+ */
+export function robotsTxt(strings: TemplateStringsArray, ...values: Stringifyable[]) {
+  return strings
+    .reduce((acc, str, i) => {
+      let value = values[i]
+
+      if (Array.isArray(value)) {
+        const [conditional, val] = value
+        value = conditional ? val : null
+      }
+      if (!value) value = ''
+      if (typeof value === 'boolean') value = value ? 'true' : 'false'
+      if (typeof value === 'number') value = String(value)
+
+      return acc + str + value
+    }, '')
+    .split('\n')
+    .map((v) => v.trim())
+    .join('\n')
+    .trim()
+}
+
+// eslint-disable-next-line @typescript-eslint/require-await
+export async function getServerSidePropsRobotsTxt(
+  context: GetServerSidePropsContext,
+  robots: string,
+) {
+  context.res.setHeader('Content-Type', 'text/plain')
+  context.res.write(robots)
+  context.res.end()
+  context.res.setHeader('Cache-Control', `public, s-maxage=${60 * 60 * 2}`)
+
+  return { props: {} }
+}

package/utils/sitemap.ts

@@ -0,0 +1,47 @@
+import { GetServerSidePropsContext, GetStaticPathsResult } from 'next'
+import { getServerSideSitemapLegacy, ISitemapField } from 'next-sitemap'
+import { canonicalize } from '../PageMeta/PageMeta'
+
+export function excludeSitemap(excludes: string[]) {
+  const regexp = excludes.map((exclude) => new RegExp(exclude.replace(/\*/g, '.*?')))
+
+  return (path: string) => !regexp.some((pattern) => pattern.test(`/${path}`))
+}
+
+export function staticPathsToString(
+  path: GetStaticPathsResult<{ url: string[] | string }>['paths'][0],
+) {
+  if (typeof path === 'string') return path
+  if (typeof path.params.url === 'string') return path.params.url
+  return path.params.url.join('/')
+}
+
+export function toSitemapFields(
+  context: GetServerSidePropsContext,
+  paths: string[],
+): ISitemapField[] {
+  const lastmod = new Date().toISOString()
+  const options = {
+    locale: context.locale,
+    defaultLocale: context.defaultLocale,
+    pathname: '/',
+    isLocaleDomain: false,
+  }
+
+  const sitemapPaths = paths.map<ISitemapField>((path) => ({
+    loc: canonicalize(options, `/${path}`) ?? '',
+    lastmod,
+    changefreq: 'daily',
+    priority: 0.7,
+  }))
+
+  return sitemapPaths
+}
+
+export function getServerSidePropsSitemap(
+  context: GetServerSidePropsContext,
+  paths: ISitemapField[],
+) {
+  context.res.setHeader('Cache-Control', `public, s-maxage=${60 * 60 * 2}`)
+  return getServerSideSitemapLegacy(context, paths)
+}