This commit is contained in:
Belen Curcio 2021-01-11 12:12:51 -03:00
parent 1742ae8ea6
commit e42c511e3d
9 changed files with 570 additions and 774 deletions

View File

@ -12,9 +12,15 @@ interface Props {
imgProps?: Omit<ImageProps, 'src'>
}
const ProductCard: FC<Props> = ({ className, product, variant, imgProps }) => {
const ProductCard: FC<Props> = ({
className,
product,
variant,
imgProps,
...props
}) => {
return (
<Link href={`product/${product.slug}`}>
<Link href={`product/${product.slug}`} {...props}>
<a
className={cn(s.root, { [s.simple]: variant === 'simple' }, className)}
>
@ -25,11 +31,11 @@ const ProductCard: FC<Props> = ({ className, product, variant, imgProps }) => {
{product.name}
</span>
</div>
{product.images?[0] && (
{product?.images && (
<Image
quality="85"
alt={product.name}
src={product.images[0].url}
src={product.images[0].url!}
height={320}
width={320}
layout="fixed"
@ -54,11 +60,11 @@ const ProductCard: FC<Props> = ({ className, product, variant, imgProps }) => {
<WishlistButton
className={s.wishlistButton}
productId={product.id}
variant={product.variants?[0]}
variant={product.variant[0]!}
/>
</div>
<div className={s.imageContainer}>
{product.images?[0] && (
{product?.images && (
<Image
alt={product.name}
className={s.productImage}

View File

@ -9,7 +9,7 @@ interface Props {
variant?: 'primary' | 'secondary'
}
const Maquee: FC<Props> = ({
const Marquee: FC<Props> = ({
className = '',
children,
variant = 'primary',
@ -32,4 +32,4 @@ const Maquee: FC<Props> = ({
)
}
export default Maquee
export default Marquee

View File

@ -47,7 +47,7 @@ const WishlistButton: FC<Props> = ({
} else {
await addItem({
productId,
variantId: variant?.id,
variantId: variant?.id!,
})
}

View File

@ -1,21 +1,23 @@
import { ProductNode } from '@framework/api/operations/get-all-products'
import { ProductEdge } from '@framework/schema'
export function normalizeProduct(productNode: ProductNode | any): Product {
export function normalizeProduct(productNode: ProductEdge): Product {
// console.log(productNode)
const {
entityId: id,
images,
variants,
productOptions,
prices,
path,
...rest
node: {
entityId: id,
images,
variants,
productOptions,
prices,
path,
...rest
},
} = productNode
return {
id,
path,
slug: path.slice(1, -1),
images: images.edges?.map(
slug: path?.slice(1, -1),
images: images?.edges?.map(
({ node: { urlOriginal, altText, ...rest } }: any) => ({
url: urlOriginal,
alt: altText,

View File

@ -0,0 +1,49 @@
/**
* Generates definitions for REST API endpoints that are being
* used by ../api using https://github.com/drwpow/swagger-to-ts
*/
const { readFileSync, promises } = require('fs')
const path = require('path')
const fetch = require('node-fetch')
const swaggerToTS = require('@manifoldco/swagger-to-ts').default
async function getSchema(filename) {
const url = `https://next-api.stoplight.io/projects/8433/files/${filename}`
const res = await fetch(url)
if (!res.ok) {
throw new Error(`Request failed with ${res.status}: ${res.statusText}`)
}
return res.json()
}
const schemas = Object.entries({
'../api/definitions/catalog.ts':
'BigCommerce_Catalog_API.oas2.yml?ref=version%2F20.930',
'../api/definitions/store-content.ts':
'BigCommerce_Store_Content_API.oas2.yml?ref=version%2F20.930',
'../api/definitions/wishlist.ts':
'BigCommerce_Wishlist_API.oas2.yml?ref=version%2F20.930',
// swagger-to-ts is not working for the schema of the cart API
// '../api/definitions/cart.ts':
// 'BigCommerce_Server_to_Server_Cart_API.oas2.yml',
})
async function writeDefinitions() {
const ops = schemas.map(async ([dest, filename]) => {
const destination = path.join(__dirname, dest)
const schema = await getSchema(filename)
const definition = swaggerToTS(schema.content, {
prettierConfig: 'package.json',
})
await promises.writeFile(destination, definition)
console.log(`✔️ Added definitions for: ${dest}`)
})
await Promise.all(ops)
}
writeDefinitions()

View File

@ -8,7 +8,7 @@
"analyze": "BUNDLE_ANALYZE=both yarn build",
"find:unused": "next-unused",
"generate": "graphql-codegen",
"generate:definitions": "node framework/bigcommerce/lib/generate-definitions.js"
"generate:definitions": "node framework/bigcommerce/scripts/generate-definitions.js"
},
"prettier": {
"semi": false,
@ -46,7 +46,9 @@
"dependencies": {
"@reach/portal": "^0.11.2",
"@tailwindcss/ui": "^0.6.2",
"@types/node-fetch": "2",
"@vercel/fetch": "^6.1.0",
"@vercel/fetch-cached-dns": "^2.0.1",
"body-scroll-lock": "^3.1.5",
"bowser": "^2.11.0",
"classnames": "^2.2.6",
@ -60,12 +62,14 @@
"next": "^10.0.5-canary.11",
"next-seo": "^4.11.0",
"next-themes": "^0.0.4",
"node-fetch": "^2.6.1",
"postcss-nesting": "^7.0.1",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react-merge-refs": "^1.1.0",
"react-ticker": "^1.2.2",
"swr": "^0.3.11",
"swr": "^0.4.0",
"tabbable": "^5.1.5",
"tailwindcss": "^1.9"
},
"devDependencies": {

View File

@ -102,11 +102,11 @@ export default function Home({
/>
))}
</Marquee>
<HomeAllProductsGrid
{/* <HomeAllProductsGrid
newestProducts={products}
categories={categories}
brands={brands}
/>
/> */}
</>
)
}

1233
yarn.lock

File diff suppressed because it is too large Load Diff