diff --git a/components/cart/CartItem/CartItem.tsx b/components/cart/CartItem/CartItem.tsx index e1bb25db4..f769a4fe1 100644 --- a/components/cart/CartItem/CartItem.tsx +++ b/components/cart/CartItem/CartItem.tsx @@ -4,7 +4,6 @@ import { Trash, Plus, Minus } from '@components/icon' import usePrice from '@lib/bigcommerce/use-price' import useUpdateItem from '@lib/bigcommerce/cart/use-update-item' import useRemoveItem from '@lib/bigcommerce/cart/use-remove-item' -import getPathname from '@lib/get-pathname' import s from './CartItem.module.css' const CartItem = ({ @@ -58,7 +57,13 @@ const CartItem = ({ return (
  • - +
    {item.name} diff --git a/components/product/ProductCard/ProductCard.tsx b/components/product/ProductCard/ProductCard.tsx index c3d95cd8c..2a5341f42 100644 --- a/components/product/ProductCard/ProductCard.tsx +++ b/components/product/ProductCard/ProductCard.tsx @@ -3,7 +3,6 @@ import cn from 'classnames' import Image from 'next/image' import Link from 'next/link' import type { ProductNode } from '@lib/bigcommerce/api/operations/get-all-products' -import getPathname from '@lib/get-pathname' import { Heart } from '@components/icon' import s from './ProductCard.module.css' @@ -25,7 +24,7 @@ const ProductCard: FC = ({ imgHeight, priority, }) => { - const src = getPathname(p.images.edges?.[0]?.node.urlOriginal!) + const src = p.images.edges?.[0]?.node.urlOriginal! if (variant === 'slim') { return ( @@ -40,6 +39,7 @@ const ProductCard: FC = ({ width={imgWidth} height={imgHeight} priority={priority} + quality="90" />
    ) @@ -69,6 +69,7 @@ const ProductCard: FC = ({ width={imgWidth} height={imgHeight} priority={priority} + quality="90" /> diff --git a/components/product/ProductView/ProductView.tsx b/components/product/ProductView/ProductView.tsx index 9e7a7863d..4663a4e89 100644 --- a/components/product/ProductView/ProductView.tsx +++ b/components/product/ProductView/ProductView.tsx @@ -6,12 +6,10 @@ import { FC, useState, useEffect } from 'react' import { useUI } from '@components/ui/context' import { Button, Container } from '@components/ui' import { Swatch, ProductSlider } from '@components/product' -import getPathname from '@lib/get-pathname' import useAddItem from '@lib/bigcommerce/cart/use-add-item' import { isDesktop } from '@lib/browser' import type { ProductNode } from '@lib/bigcommerce/api/operations/get-product' import { getProductOptions } from '../helpers' -import bcImageSrc from '@lib/bc-image-src' interface Props { className?: string @@ -60,10 +58,7 @@ const ProductView: FC = ({ product, className }) => { description: product.description, images: [ { - url: bcImageSrc({ - src: getPathname(product.images.edges?.[0]?.node.urlOriginal!), - width: 1200, - }), + url: product.images.edges?.[0]?.node.urlOriginal!, width: 800, height: 600, alt: product.name, @@ -84,14 +79,14 @@ const ProductView: FC = ({ product, className }) => {
    - {/** TODO: Change with Image Component **/} {product.images.edges?.map((image, i) => ( ))} diff --git a/lib/bc-image-src.ts b/lib/bc-image-src.ts deleted file mode 100644 index 2ae92774e..000000000 --- a/lib/bc-image-src.ts +++ /dev/null @@ -1,22 +0,0 @@ -type Props = { - src: string - width?: number -} - -type LoaderProps = Props & { root: string } - -function normalizeSrc(src: string) { - return src[0] === '/' ? src.slice(1) : src -} - -// This is the same loader used by Next.js in the Image Component, we have it here too -// so we can create image URLs for meta tags -function bcImageLoader({ root, src, width }: LoaderProps): string { - return `${root}${normalizeSrc( - width ? src.replace('/original/', `/${width}w/`) : src - )}` -} - -export default function bcImageSrc(props: Props) { - return bcImageLoader({ root: 'https://cdn11.bigcommerce.com/', ...props }) -} diff --git a/lib/get-pathname.ts b/lib/get-pathname.ts deleted file mode 100644 index dbf7734ad..000000000 --- a/lib/get-pathname.ts +++ /dev/null @@ -1,3 +0,0 @@ -export default function getPathname(url: string) { - return new URL(url).pathname -} diff --git a/next.config.js b/next.config.js index f00eded75..38bfd6c64 100644 --- a/next.config.js +++ b/next.config.js @@ -1,8 +1,7 @@ module.exports = { images: { sizes: [320, 480, 820, 1200, 1600], - path: 'https://cdn11.bigcommerce.com/', - loader: 'bigCommerce', + domains: ['cdn11.bigcommerce.com'], }, rewrites() { return [ diff --git a/package.json b/package.json index 15955ad14..f8d321ab4 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ "js-cookie": "^2.2.1", "lodash.debounce": "^4.0.8", "lodash.random": "^3.2.0", - "next": "file:../next.js/packages/next", + "next": "^9.5.6-canary.12", "next-seo": "^4.11.0", "next-themes": "^0.0.4", "nextjs-progressbar": "^0.0.6", diff --git a/yarn.lock b/yarn.lock index 6467442b7..e9605bf3c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1514,20 +1514,20 @@ meow "^7.0.0" prettier "^2.0.5" -"@next/env@9.5.6-canary.11": - version "9.5.6-canary.11" - resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.6-canary.11.tgz#95e1e668a19ba7cadd7047305bf64e23ba7d2c4f" - integrity sha512-mFnvhl39lkEf8BuULn5wX6kN9TnSo5HW/J65AGEAMFoQio9aMpjnaTqYIavg+j8ddlWpVWxK0ypMjY3D8GXz1A== +"@next/env@9.5.6-canary.12": + version "9.5.6-canary.12" + resolved "https://registry.yarnpkg.com/@next/env/-/env-9.5.6-canary.12.tgz#5680e9f1cfed54d7529086f519352307337f3ea1" + integrity sha512-cZ2ETTduAi+ThD6rk6FNzQWAOI0QRg0De54EqG4+2YFAU/FwWeoVy6c8nkaO1KE3qCVqXEyuat2Q6knA4E/sFA== -"@next/polyfill-module@9.5.6-canary.11": - version "9.5.6-canary.11" - resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.6-canary.11.tgz#681828311b562c40c43c2867c071d179e1bdd2ba" - integrity sha512-MTK9f7iNy5aIAg3saeCidL7Wjapv0UhX/e/TJA9HUxw/smqzfNBos8HW974T46r1QKwUIEdz7S+5xJDnx+XdAg== +"@next/polyfill-module@9.5.6-canary.12": + version "9.5.6-canary.12" + resolved "https://registry.yarnpkg.com/@next/polyfill-module/-/polyfill-module-9.5.6-canary.12.tgz#2ccd053b73ef350d690ecd85446de5ba7c40bcaa" + integrity sha512-2zOZYPJtzlPnObsjD9UEmOygQwvlSzeMGCwklFmH+ioR5ngaA7P4oXtqh8ocYAsjRVbZucJcT9Yn5roPbZfUNQ== -"@next/react-dev-overlay@9.5.6-canary.11": - version "9.5.6-canary.11" - resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.6-canary.11.tgz#4e397914b5d1a42fdbbf9fccf1de72f62d6232a5" - integrity sha512-Z+ScaXurAkaTRSbOUVVYew4ufZVsAHIkRJtTmaI1s3g5+nG5YjTSZRgTMmQVf6W1bZSJp7wGkYWD4cKvBHCojQ== +"@next/react-dev-overlay@9.5.6-canary.12": + version "9.5.6-canary.12" + resolved "https://registry.yarnpkg.com/@next/react-dev-overlay/-/react-dev-overlay-9.5.6-canary.12.tgz#eef065cd2d37e446aef78ffea974fcf9066bcdcd" + integrity sha512-ELQCF4/CX/PygiOa9PD7iCu62PqWrIK3jVj9PuascEhoF8au3N987ElJ7he57MuD6TLNpy5a8G7IxYUEPV55rA== dependencies: "@babel/code-frame" "7.10.4" ally.js "1.4.1" @@ -1540,10 +1540,10 @@ stacktrace-parser "0.1.10" strip-ansi "6.0.0" -"@next/react-refresh-utils@9.5.6-canary.11": - version "9.5.6-canary.11" - resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.6-canary.11.tgz#c97fa5cdfdbdd90db4d2c56065193fa2cdd076ad" - integrity sha512-ve7rdJp8CrgoCpKqF/09C3RYryA7NgYy0+Op7r5l6PTUv9AQoDs2RUGia3l2Irsz7bCSSBUxah41peZBgNn7Cw== +"@next/react-refresh-utils@9.5.6-canary.12": + version "9.5.6-canary.12" + resolved "https://registry.yarnpkg.com/@next/react-refresh-utils/-/react-refresh-utils-9.5.6-canary.12.tgz#f2f0cc30e646af4daefd5d0f50681ac231fbd826" + integrity sha512-jX6JwC8IHzHo1BV2yayPaOnXpM9KWF2/NM1SWTCZlfplBF5Rm1nQTG0WX8MF0CUpLh+DBeXmJ3Xzve/IGLdZmw== "@nodelib/fs.scandir@2.1.3": version "2.1.3" @@ -5664,8 +5664,10 @@ next-tick@~1.0.0: resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c" integrity sha1-yobR/ogoFpsBICCOPchCS524NCw= -"next@file:../next.js/packages/next": - version "9.5.6-canary.11" +next@^9.5.6-canary.12: + version "9.5.6-canary.12" + resolved "https://registry.yarnpkg.com/next/-/next-9.5.6-canary.12.tgz#84c8c3202ae09b0fe2ca12254931eb43501b5aee" + integrity sha512-JkOoQnMmJw/so0A3WnYSw3/XOnVGg/unUGcYsDBme0mkX8d9ooO/xC7QI01V3BW9A62txusoFMUxFjFrymGDiQ== dependencies: "@ampproject/toolbox-optimizer" "2.7.0-alpha.1" "@babel/code-frame" "7.10.4" @@ -5686,10 +5688,10 @@ next-tick@~1.0.0: "@babel/runtime" "7.11.2" "@babel/types" "7.11.5" "@hapi/accept" "5.0.1" - "@next/env" "9.5.6-canary.11" - "@next/polyfill-module" "9.5.6-canary.11" - "@next/react-dev-overlay" "9.5.6-canary.11" - "@next/react-refresh-utils" "9.5.6-canary.11" + "@next/env" "9.5.6-canary.12" + "@next/polyfill-module" "9.5.6-canary.12" + "@next/react-dev-overlay" "9.5.6-canary.12" + "@next/react-refresh-utils" "9.5.6-canary.12" ast-types "0.13.2" babel-plugin-transform-define "2.0.0" babel-plugin-transform-react-remove-prop-types "0.4.24"