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

update to agility/next

Browse Source
This commit is contained in:
Joel Varty
2021-06-09 23:17:19 -04:00
parent 17f458b45b
commit e836a5950f
26 changed files with 26612 additions and 6639 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
components/agility-modules/BestsellingProducts.tsx
View File

@@ -2,34 +2,36 @@ import React, { FC } from 'react'
import { ProductCard } from '@components/product'
import { Grid, Marquee, Hero } from '@components/ui'
import { ModuleWithInit } from '@agility/nextjs'
interface Fields {
interface ICustomData {
bestSelling: any
}
interface Props {
fields: Fields,
customData: any
interface IModule {
}
const BestsellingProducts:FC<Props> = ({fields, customData}) => {
const bestSelling = customData.bestSelling
const BestsellingProducts: ModuleWithInit<IModule, ICustomData> = ({ customData }) => {
const bestSelling = customData.bestSelling
return (
<Marquee variant="secondary">
{bestSelling.slice(0, 12).map(({ node }:any) => (
<ProductCard
key={node.path}
product={node}
variant="slim"
imgWidth={320}
imgHeight={320}
imgLayout="fixed"
/>
))}
</Marquee>
{bestSelling.slice(0, 12).map(({ node }: any) => (
<ProductCard
key={node.path}
product={node}
variant="slim"
imgWidth={320}
imgHeight={320}
imgLayout="fixed"
/>
))}
</Marquee>
)
}
export default BestsellingProducts

16
components/agility-modules/FeaturedProducts.tsx
View File

@@ -1,16 +1,22 @@
import { FC } from "react"
import { Grid, Marquee, Hero } from '@components/ui'
import { ProductCard } from '@components/product'
import { ModuleWithInit } from "@agility/nextjs"
interface Fields {
interface ICustomData {
featured: any
}
interface Props {
fields: Fields,
customData: any
interface IModule {
}
const FeaturedProducts:FC<Props> = ({fields, customData}) => {
const FeaturedProducts: ModuleWithInit<IModule, ICustomData> = ({ customData }) => {
if (! customData) {
return <div>No featured products returned.</div>
}
const featured:any = customData.featured
return (

7
components/agility-modules/Hero.tsx
View File

@@ -1,6 +1,7 @@
import React, { FC } from 'react'
import { Hero } from '@components/ui'
import * as AgilityTypes from "@agility/types"
import { Module } from '@agility/nextjs'
interface Fields {
@@ -9,11 +10,7 @@ interface Fields {
cTA?:AgilityTypes.URLField
}
interface Props {
fields: Fields
}
const HeroModule:FC<Props> = ({fields}) => {
const HeroModule:Module<Fields> = ({ module: {fields }}) => {
return (
<Hero

17
components/agility-modules/HomeAllProductsGrid.tsx
View File

@@ -1,20 +1,27 @@
import React, { FC } from 'react'
import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
import { ModuleWithInit } from '@agility/nextjs'
interface Fields {
interface ICustomData {
categories: any
newestProducts: any
brands: any
}
interface Props {
fields: Fields,
customData: any
interface IModule {
}
const HomeAllProductsGridModule:FC<Props> = ({fields, customData}) => {
const HomeAllProductsGridModule: ModuleWithInit<IModule, ICustomData> = ({ customData }) => {
const categories = customData.categories
const newestProducts = customData.newestProducts
const brands = customData.brands
if (!categories) return <div>No data</div>
return (
<HomeAllProductsGrid
categories={categories}

8
components/agility-modules/Orders.tsx
View File

@@ -2,17 +2,13 @@ import React, { FC } from 'react'
import { Container, Text } from '@components/ui'
import { Bag } from '@components/icons'
import { Module } from '@agility/nextjs'
interface Fields {
}
interface Props {
fields: Fields,
customData: any
}
const Orders: FC<Props> = ({ fields, customData }) => {
const Orders: Module<Fields> = ({ }) => {
return (
<Container>
<Text variant="pageHeading">My Orders</Text>

11
components/agility-modules/ProductDetails.tsx
View File

@@ -3,19 +3,16 @@ import { Hero } from '@components/ui'
import * as AgilityTypes from "@agility/types"
import { GetProductResult } from '@framework/api/operations/get-product'
import { ProductView } from '@components/product'
import { Module } from '@agility/nextjs'
interface Fields {
}
interface Props {
fields: Fields,
dynamicPageItem:any
}
const HeroModule:FC<Props> = ({fields, dynamicPageItem}) => {
const HeroModule:Module<Fields> = ({ dynamicPageItem }) => {
const product:any = dynamicPageItem
return (
<ProductView product={dynamicPageItem} />
<ProductView product={product} />
)
}

19
components/agility-modules/ProductSearch.tsx
View File

@@ -15,6 +15,8 @@ import {
getDesignerPath,
useSearchMeta,
} from '@lib/search'
import { ModuleWithInit } from '@agility/nextjs'
const SORT = Object.entries({
'latest-desc': 'Latest arrivals',
@@ -23,21 +25,24 @@ const SORT = Object.entries({
'price-desc': 'Price: High to low',
})
interface Fields {
interface ICustomData {
categories: any
brands: any
}
interface Props {
fields: Fields,
customData: any
interface IModule {
}
const ProductSearch: FC<Props> = ({ fields, customData }) => {
const ProductSearch: ModuleWithInit<IModule, ICustomData> = ({ customData }) => {
const categories:[any] = customData.categories
const brands:[any] = customData.brands
const [activeFilter, setActiveFilter] = useState('')
const [toggleFilter, setToggleFilter] = useState(false)
const [toggleFilter, setToggleFilter] = useState(false)
const router = useRouter()
const { asPath } = router
@@ -447,4 +452,6 @@ const ProductSearch: FC<Props> = ({ fields, customData }) => {
)
}
export default ProductSearch

6
components/agility-modules/Profile.tsx
View File

@@ -2,6 +2,7 @@ import React, { FC } from 'react'
import useCustomer from '@framework/use-customer'
import { Container, Text } from '@components/ui'
import { Module } from '@agility/nextjs'
interface Fields {
heading: string,
@@ -10,11 +11,8 @@ interface Fields {
notLoggedInMessage: string
}
interface Props {
fields: Fields
}
const ProfileModule:FC<Props> = ({fields}) => {
const ProfileModule:Module<Fields> = ({ module: {fields}}) => {
const { data } = useCustomer()
return (

7
components/agility-modules/RichTextArea.tsx
View File

@@ -1,15 +1,14 @@
import React, {FC} from 'react';
import { Text, Container } from '@components/ui'
import { Module } from '@agility/nextjs';
interface Fields {
textblob:string,
}
interface Props {
fields: Fields
}
const RichTextArea:Module<Fields> = ({ module: {fields} }) => {
const RichTextArea:FC<Props> = ({fields}) => {
return (
<Container>

58
components/agility-modules/Wishlist.tsx
View File

@@ -5,6 +5,7 @@ import useWishlist from '@framework/wishlist/use-wishlist'
import { Heart } from '@components/icons'
import { Text, Container } from '@components/ui'
import { WishlistCard } from '@components/wishlist'
import { Module } from '@agility/nextjs'
interface Fields {
@@ -13,40 +14,35 @@ interface Fields {
addItemsMessage?: string
}
interface Props {
fields: Fields,
customData: any
}
const Wishlist: FC<Props> = ({ fields, customData }) => {
const Wishlist: Module<Fields> = ({ module: { fields } }) => {
const { data, isEmpty } = useWishlist({ includeProducts: true })
return (
<Container>
<div className="mt-3 mb-20">
<Text variant="pageHeading">{fields.heading}</Text>
<div className="group flex flex-col">
{isEmpty ? (
<div className="flex-1 px-12 py-24 flex flex-col justify-center items-center ">
<span className="border border-dashed border-secondary flex items-center justify-center w-16 h-16 bg-primary p-12 rounded-lg text-primary">
<Heart className="absolute" />
</span>
<h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
{fields.emptyMessage}
</h2>
<p className="text-accents-6 px-10 text-center pt-2">
{fields.addItemsMessage}
</p>
</div>
) : (
data &&
data.items?.map((item) => (
<WishlistCard key={item.id} item={item} />
))
)}
</div>
</div>
</Container>
<Container>
<div className="mt-3 mb-20">
<Text variant="pageHeading">{fields.heading}</Text>
<div className="group flex flex-col">
{isEmpty ? (
<div className="flex-1 px-12 py-24 flex flex-col justify-center items-center ">
<span className="border border-dashed border-secondary flex items-center justify-center w-16 h-16 bg-primary p-12 rounded-lg text-primary">
<Heart className="absolute" />
</span>
<h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
{fields.emptyMessage}
</h2>
<p className="text-accents-6 px-10 text-center pt-2">
{fields.addItemsMessage}
</p>
</div>
) : (
data &&
data.items?.map((item) => (
<WishlistCard key={item.id} item={item} />
))
)}
</div>
</div>
</Container>
)
}

4
components/agility-modules/index.ts
View File

@@ -33,10 +33,8 @@ const allModules = [
* Find the component for a module by name.
* @param moduleName
*/
const getModule = (moduleName: string): any | null => {
export const getModule = (moduleName: string): any | null => {
const obj = allModules.find(m => m.name.toLowerCase() === moduleName.toLowerCase())
if (!obj) return null
return obj.module
}
export default getModule