forked from crowetic/commerce
Added i18n for custom pages
This commit is contained in:
parent
e9092a4031
commit
7bc2c408ee
@ -1,11 +1,13 @@
|
|||||||
import { FC } from 'react'
|
import { FC } from 'react'
|
||||||
import cn from 'classnames'
|
import cn from 'classnames'
|
||||||
import Link from 'next/link'
|
import Link from 'next/link'
|
||||||
|
import { useRouter } from 'next/router'
|
||||||
|
import type { Page } from '@lib/bigcommerce/api/operations/get-all-pages'
|
||||||
import getSlug from '@utils/get-slug'
|
import getSlug from '@utils/get-slug'
|
||||||
import { Github } from '@components/icon'
|
import { Github } from '@components/icon'
|
||||||
import { Logo, Container } from '@components/ui'
|
import { Logo, Container } from '@components/ui'
|
||||||
import type { Page } from '@lib/bigcommerce/api/operations/get-all-pages'
|
|
||||||
import { I18nWidget } from '@components/core'
|
import { I18nWidget } from '@components/core'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
className?: string
|
className?: string
|
||||||
children?: any
|
children?: any
|
||||||
@ -15,8 +17,8 @@ interface Props {
|
|||||||
const LEGAL_PAGES = ['terms-of-use', 'shipping-returns', 'privacy-policy']
|
const LEGAL_PAGES = ['terms-of-use', 'shipping-returns', 'privacy-policy']
|
||||||
|
|
||||||
const Footer: FC<Props> = ({ className, pages }) => {
|
const Footer: FC<Props> = ({ className, pages }) => {
|
||||||
|
const { sitePages, legalPages } = usePages(pages)
|
||||||
const rootClassName = cn(className)
|
const rootClassName = cn(className)
|
||||||
const { sitePages, legalPages } = getPages(pages)
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<footer className={rootClassName}>
|
<footer className={rootClassName}>
|
||||||
@ -106,18 +108,22 @@ const Footer: FC<Props> = ({ className, pages }) => {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPages(pages?: Page[]) {
|
function usePages(pages?: Page[]) {
|
||||||
|
const { locale } = useRouter()
|
||||||
const sitePages: Page[] = []
|
const sitePages: Page[] = []
|
||||||
const legalPages: Page[] = []
|
const legalPages: Page[] = []
|
||||||
|
|
||||||
if (pages) {
|
if (pages) {
|
||||||
pages.forEach((page) => {
|
pages.forEach((page) => {
|
||||||
if (page.url) {
|
const slug = page.url && getSlug(page.url)
|
||||||
if (LEGAL_PAGES.includes(getSlug(page.url))) {
|
|
||||||
legalPages.push(page)
|
if (!slug) return
|
||||||
} else {
|
if (locale && !slug.startsWith(`${locale}/`)) return
|
||||||
sitePages.push(page)
|
|
||||||
}
|
if (isLegalPage(slug, locale)) {
|
||||||
|
legalPages.push(page)
|
||||||
|
} else {
|
||||||
|
sitePages.push(page)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -128,6 +134,11 @@ function getPages(pages?: Page[]) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isLegalPage = (slug: string, locale?: string) =>
|
||||||
|
locale
|
||||||
|
? LEGAL_PAGES.some((p) => `${locale}/${p}` === slug)
|
||||||
|
: LEGAL_PAGES.includes(slug)
|
||||||
|
|
||||||
// Sort pages by the sort order assigned in the BC dashboard
|
// Sort pages by the sort order assigned in the BC dashboard
|
||||||
function bySortOrder(a: Page, b: Page) {
|
function bySortOrder(a: Page, b: Page) {
|
||||||
return (a.sort_order ?? 0) - (b.sort_order ?? 0)
|
return (a.sort_order ?? 0) - (b.sort_order ?? 0)
|
||||||
|
@ -22,7 +22,7 @@ export type ProductsHandlers = {
|
|||||||
const METHODS = ['GET']
|
const METHODS = ['GET']
|
||||||
|
|
||||||
// TODO: a complete implementation should have schema validation for `req.body`
|
// TODO: a complete implementation should have schema validation for `req.body`
|
||||||
const productApi: BigcommerceApiHandler<
|
const productsApi: BigcommerceApiHandler<
|
||||||
SearchProductsData,
|
SearchProductsData,
|
||||||
ProductsHandlers
|
ProductsHandlers
|
||||||
> = async (req, res, config, handlers) => {
|
> = async (req, res, config, handlers) => {
|
||||||
@ -45,4 +45,4 @@ const productApi: BigcommerceApiHandler<
|
|||||||
|
|
||||||
export const handlers = { getProducts }
|
export const handlers = { getProducts }
|
||||||
|
|
||||||
export default createApiHandler(productApi, handlers, {})
|
export default createApiHandler(productsApi, handlers, {})
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
export interface CommerceAPIConfig {
|
export interface CommerceAPIConfig {
|
||||||
|
locale?: string
|
||||||
commerceUrl: string
|
commerceUrl: string
|
||||||
apiToken: string
|
apiToken: string
|
||||||
cartCookie: string
|
cartCookie: string
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
"keen-slider": "^5.2.4",
|
"keen-slider": "^5.2.4",
|
||||||
"lodash.debounce": "^4.0.8",
|
"lodash.debounce": "^4.0.8",
|
||||||
"lodash.random": "^3.2.0",
|
"lodash.random": "^3.2.0",
|
||||||
"next": "^9.5.6-canary.13",
|
"next": "^9.5.6-canary.14",
|
||||||
"next-seo": "^4.11.0",
|
"next-seo": "^4.11.0",
|
||||||
"next-themes": "^0.0.4",
|
"next-themes": "^0.0.4",
|
||||||
"nextjs-progressbar": "^0.0.6",
|
"nextjs-progressbar": "^0.0.6",
|
||||||
|
@ -7,19 +7,24 @@ import { Layout, HTMLContent } from '@components/core'
|
|||||||
export async function getStaticProps({
|
export async function getStaticProps({
|
||||||
preview,
|
preview,
|
||||||
params,
|
params,
|
||||||
|
locale,
|
||||||
}: GetStaticPropsContext<{ pages: string[] }>) {
|
}: GetStaticPropsContext<{ pages: string[] }>) {
|
||||||
const { pages } = await getAllPages()
|
const { pages } = await getAllPages()
|
||||||
const slug = params?.pages.join('/')
|
const path = params?.pages.join('/')
|
||||||
|
const slug = locale ? `${locale}/${path}` : path
|
||||||
|
|
||||||
const pageItem = pages.find((p) => (p.url ? getSlug(p.url) === slug : false))
|
const pageItem = pages.find((p) => (p.url ? getSlug(p.url) === slug : false))
|
||||||
const data = pageItem && (await getPage({ variables: { id: pageItem.id! } }))
|
const data = pageItem && (await getPage({ variables: { id: pageItem.id! } }))
|
||||||
const page = data?.page
|
const page = data?.page
|
||||||
|
|
||||||
if (!page) {
|
if (!page) {
|
||||||
|
// We throw to make sure this fails at build time as this is never expected to happen
|
||||||
throw new Error(`Page with slug '${slug}' not found`)
|
throw new Error(`Page with slug '${slug}' not found`)
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
props: { pages, page },
|
props: { pages, page },
|
||||||
|
revalidate: 60 * 60, // Every hour
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
68
yarn.lock
68
yarn.lock
@ -1534,20 +1534,20 @@
|
|||||||
meow "^7.0.0"
|
meow "^7.0.0"
|
||||||
prettier "^2.0.5"
|
prettier "^2.0.5"
|
||||||
|
|
||||||
"@next/env@9.5.6-canary.13":
|
"@next/env@9.5.6-canary.14":
|
||||||
version "9.5.6-canary.13"
|
version "9.5.6-canary.14"
|
||||||
resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.6-canary.13.tgz#20c0a3d7874a346f2b0fc92ab93f8d1f8fc345ec"
|
resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.6-canary.14.tgz#6dd9ae250531b9649e6f55d340277f7f429b05bd"
|
||||||
integrity sha512-+WpW8mMUS6IvWeqa1EaFtbTrQWCqNMumJJt8wjBwbjUZ0hCfdwgWsB0f1kz7jKkGBUMms9h2NlsKzayIMlPwxw==
|
integrity sha512-evDDFWN93/vTNlxJhFHvc5Nwp7uf3UtQZGa+D+31LFlGIVZtTP8G6l5U8HDUVkFeL/CD5cDefm6OotQp1W1PvA==
|
||||||
|
|
||||||
"@next/polyfill-module@9.5.6-canary.13":
|
"@next/polyfill-module@9.5.6-canary.14":
|
||||||
version "9.5.6-canary.13"
|
version "9.5.6-canary.14"
|
||||||
resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.6-canary.13.tgz#f380e2319442308e30b05ac200f8cdf6703ce5bf"
|
resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.6-canary.14.tgz#de851cd2780095156309db45d9e27a85db377621"
|
||||||
integrity sha512-GwV5F0+QU/EY+GjgfAK/lRWBtUnZ9AJpLChpv9ZX0V//SJ7xnSpEeW0JJcG1PQhrV2BSmRTdxRUoISAf94f3mg==
|
integrity sha512-OVOPKfxsi56RPHyXKv/Wrqq2uYbYbwh9kMBskqfNCI05lAoiBaXetABa8JcO2xUO+WM6MPUSmxlyWuN5LLJqXA==
|
||||||
|
|
||||||
"@next/react-dev-overlay@9.5.6-canary.13":
|
"@next/react-dev-overlay@9.5.6-canary.14":
|
||||||
version "9.5.6-canary.13"
|
version "9.5.6-canary.14"
|
||||||
resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.6-canary.13.tgz#378fd911deaf476cb1417c20be13a66aaa9aed50"
|
resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.6-canary.14.tgz#993fb9ad23b186aa098348a8c156b4f7ba1dda24"
|
||||||
integrity sha512-gFMZEYNY1FukamOE9hV13iz3ohfbKPpmpDP0+M70qXzAI4VWIyyKBE9fszctRJsoFR0jn4fQ4gj/lxlOMYSjZw==
|
integrity sha512-hPpNDFWBTDQwa1nRMltxpSD0uewkP0jP6CCfGqyVSZugl7N+6VYgdTvM4s/ZZTaL+OKbd2rUdI/U6V7IQVn+4Q==
|
||||||
dependencies:
|
dependencies:
|
||||||
"@babel/code-frame" "7.10.4"
|
"@babel/code-frame" "7.10.4"
|
||||||
ally.js "1.4.1"
|
ally.js "1.4.1"
|
||||||
@ -1560,10 +1560,10 @@
|
|||||||
stacktrace-parser "0.1.10"
|
stacktrace-parser "0.1.10"
|
||||||
strip-ansi "6.0.0"
|
strip-ansi "6.0.0"
|
||||||
|
|
||||||
"@next/react-refresh-utils@9.5.6-canary.13":
|
"@next/react-refresh-utils@9.5.6-canary.14":
|
||||||
version "9.5.6-canary.13"
|
version "9.5.6-canary.14"
|
||||||
resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.6-canary.13.tgz#6fd123d844abe2d3124803a5475d65dca45b914f"
|
resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.6-canary.14.tgz#738a20723b6895299132694cfa7bf629fdaeb1fe"
|
||||||
integrity sha512-0BMrGaiAqFC5ncyPnleOthVQiR/WPhPF8lVzngpvoObpSHVljQiA2cJdC9VzBCm8MtUwgVb1pswPodV9elUHww==
|
integrity sha512-uZawKMFl0hxzFF2lPGqo80zVj2XQRrlGN+o37XFQt+W0pR8GgLHNk8xikrPNz7dOwW1s7DNSAwujKmDiutc0og==
|
||||||
|
|
||||||
"@nodelib/fs.scandir@2.1.3":
|
"@nodelib/fs.scandir@2.1.3":
|
||||||
version "2.1.3"
|
version "2.1.3"
|
||||||
@ -5697,10 +5697,10 @@ next-tick@~1.0.0:
|
|||||||
resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
|
resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
|
||||||
integrity sha1-yobR/ogoFpsBICCOPchCS524NCw=
|
integrity sha1-yobR/ogoFpsBICCOPchCS524NCw=
|
||||||
|
|
||||||
next@^9.5.6-canary.13:
|
next@^9.5.6-canary.14:
|
||||||
version "9.5.6-canary.13"
|
version "9.5.6-canary.14"
|
||||||
resolved "https://registry.yarnpkg.com/next/-/next-9.5.6-canary.13.tgz#6bae2095483d42d979936ff0f0d816f73a3c3488"
|
resolved "https://registry.yarnpkg.com/next/-/next-9.5.6-canary.14.tgz#13f0496199589ed40880f6c4ef97f14bfdbd8996"
|
||||||
integrity sha512-AwwAIAn9mUPfj99c6CtN4OBABXjekwK9lS5J9iuqk3oP3O7Tt676N1Wkln71IBb3iLrcHLZxQjpr2RUR2T2S1g==
|
integrity sha512-uUcWxznWWMjNBA9fqJ82avTuVe7Rud0/129oRZRsQX+VH5qqhxeBbupEfzP65AihyLD+X5olGZQ2SsmqWqubJQ==
|
||||||
dependencies:
|
dependencies:
|
||||||
"@ampproject/toolbox-optimizer" "2.7.0-alpha.1"
|
"@ampproject/toolbox-optimizer" "2.7.0-alpha.1"
|
||||||
"@babel/code-frame" "7.10.4"
|
"@babel/code-frame" "7.10.4"
|
||||||
@ -5721,10 +5721,10 @@ next@^9.5.6-canary.13:
|
|||||||
"@babel/runtime" "7.11.2"
|
"@babel/runtime" "7.11.2"
|
||||||
"@babel/types" "7.11.5"
|
"@babel/types" "7.11.5"
|
||||||
"@hapi/accept" "5.0.1"
|
"@hapi/accept" "5.0.1"
|
||||||
"@next/env" "9.5.6-canary.13"
|
"@next/env" "9.5.6-canary.14"
|
||||||
"@next/polyfill-module" "9.5.6-canary.13"
|
"@next/polyfill-module" "9.5.6-canary.14"
|
||||||
"@next/react-dev-overlay" "9.5.6-canary.13"
|
"@next/react-dev-overlay" "9.5.6-canary.14"
|
||||||
"@next/react-refresh-utils" "9.5.6-canary.13"
|
"@next/react-refresh-utils" "9.5.6-canary.14"
|
||||||
ast-types "0.13.2"
|
ast-types "0.13.2"
|
||||||
babel-plugin-transform-define "2.0.0"
|
babel-plugin-transform-define "2.0.0"
|
||||||
babel-plugin-transform-react-remove-prop-types "0.4.24"
|
babel-plugin-transform-react-remove-prop-types "0.4.24"
|
||||||
@ -5755,8 +5755,8 @@ next@^9.5.6-canary.13:
|
|||||||
schema-utils "2.7.1"
|
schema-utils "2.7.1"
|
||||||
stream-browserify "3.0.0"
|
stream-browserify "3.0.0"
|
||||||
style-loader "1.2.1"
|
style-loader "1.2.1"
|
||||||
styled-jsx "3.3.0"
|
styled-jsx "3.3.1"
|
||||||
use-subscription "1.4.1"
|
use-subscription "1.5.0"
|
||||||
vm-browserify "1.1.2"
|
vm-browserify "1.1.2"
|
||||||
watchpack "2.0.0-beta.13"
|
watchpack "2.0.0-beta.13"
|
||||||
web-vitals "0.2.4"
|
web-vitals "0.2.4"
|
||||||
@ -7644,10 +7644,10 @@ style-loader@1.2.1:
|
|||||||
loader-utils "^2.0.0"
|
loader-utils "^2.0.0"
|
||||||
schema-utils "^2.6.6"
|
schema-utils "^2.6.6"
|
||||||
|
|
||||||
styled-jsx@3.3.0:
|
styled-jsx@3.3.1:
|
||||||
version "3.3.0"
|
version "3.3.1"
|
||||||
resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.3.0.tgz#32335c1a3ecfc923ba4f9c056eeb3d4699006b09"
|
resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-3.3.1.tgz#d79f306c42c99cefbe8e76f35dad8100dc5c9ecc"
|
||||||
integrity sha512-sh8BI5eGKyJlwL4kNXHjb27/a/GJV8wP4ElRIkRXrGW3sHKOsY9Pa1VZRNxyvf3+lisdPwizD9JDkzVO9uGwZw==
|
integrity sha512-RhW71t3k95E3g7Zq3lEBk+kmf+p4ZME7c5tfsYf9M5mq6CgIvFXkbvhawL2gWriXLRlMyKAYACE89Qa2JnTqUw==
|
||||||
dependencies:
|
dependencies:
|
||||||
"@babel/types" "7.8.3"
|
"@babel/types" "7.8.3"
|
||||||
babel-plugin-syntax-jsx "6.18.0"
|
babel-plugin-syntax-jsx "6.18.0"
|
||||||
@ -8041,10 +8041,10 @@ url-parse-lax@^3.0.0:
|
|||||||
dependencies:
|
dependencies:
|
||||||
prepend-http "^2.0.0"
|
prepend-http "^2.0.0"
|
||||||
|
|
||||||
use-subscription@1.4.1:
|
use-subscription@1.5.0:
|
||||||
version "1.4.1"
|
version "1.5.0"
|
||||||
resolved "https://registry.yarnpkg.com/use-subscription/-/use-subscription-1.4.1.tgz#edcbcc220f1adb2dd4fa0b2f61b6cc308e620069"
|
resolved "https://registry.yarnpkg.com/use-subscription/-/use-subscription-1.5.0.tgz#0df66fdf97b9a340147ad72f76fac1db6f56d240"
|
||||||
integrity sha512-7+IIwDG/4JICrWHL/Q/ZPK5yozEnvRm6vHImu0LKwQlmWGKeiF7mbAenLlK/cTNXrTtXHU/SFASQHzB6+oSJMQ==
|
integrity sha512-/FVRiB2I7NDjzWoNBYPt6YkkvleMm/lFtxj1hH6nX2TVrJ/5UTbovw9OE1efv2Zl0HoAYuTjM7zHd9OsABn5sg==
|
||||||
dependencies:
|
dependencies:
|
||||||
object-assign "^4.1.1"
|
object-assign "^4.1.1"
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user