forked from crowetic/commerce
Merge branch 'master' of https://github.com/okbel/e-comm-example
This commit is contained in:
commit
5962657b7d
@ -1,6 +1,6 @@
|
|||||||
import { FC, useEffect, useState, useCallback } from 'react'
|
import { FC, useEffect, useState, useCallback } from 'react'
|
||||||
import { validate } from 'email-validator'
|
import { validate } from 'email-validator'
|
||||||
import { Info } from'@components/icons'
|
import { Info } from '@components/icons'
|
||||||
import { useUI } from '@components/ui/context'
|
import { useUI } from '@components/ui/context'
|
||||||
import { Logo, Button, Input } from '@components/ui'
|
import { Logo, Button, Input } from '@components/ui'
|
||||||
import useSignup from '@lib/bigcommerce/use-signup'
|
import useSignup from '@lib/bigcommerce/use-signup'
|
||||||
@ -59,7 +59,7 @@ const ForgotPassword: FC<Props> = () => {
|
|||||||
<div className="text-red border border-red p-3">{message}</div>
|
<div className="text-red border border-red p-3">{message}</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<Input placeholder="Email" onChange={setEmail} />
|
<Input placeholder="Email" onChange={setEmail} type="email" />
|
||||||
<div className="pt-2 w-full flex flex-col">
|
<div className="pt-2 w-full flex flex-col">
|
||||||
<Button
|
<Button
|
||||||
variant="slim"
|
variant="slim"
|
||||||
|
@ -20,15 +20,17 @@ const Input: React.FC<Props> = (props) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<input
|
<label>
|
||||||
className={rootClassName}
|
<input
|
||||||
onChange={handleOnChange}
|
className={rootClassName}
|
||||||
autoComplete="off"
|
onChange={handleOnChange}
|
||||||
autoCorrect="off"
|
autoComplete="off"
|
||||||
autoCapitalize="off"
|
autoCorrect="off"
|
||||||
spellCheck="false"
|
autoCapitalize="off"
|
||||||
{...rest}
|
spellCheck="false"
|
||||||
/>
|
{...rest}
|
||||||
|
/>
|
||||||
|
</label>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import React, { FC } from 'react'
|
import React, { FC, useMemo } from 'react'
|
||||||
import { ThemeProvider } from 'next-themes'
|
import { ThemeProvider } from 'next-themes'
|
||||||
import { SSRProvider, OverlayProvider } from 'react-aria'
|
import { SSRProvider, OverlayProvider } from 'react-aria'
|
||||||
|
|
||||||
@ -144,18 +144,21 @@ export const UIProvider: FC = (props) => {
|
|||||||
const setModalView = (view: MODAL_VIEWS) =>
|
const setModalView = (view: MODAL_VIEWS) =>
|
||||||
dispatch({ type: 'SET_MODAL_VIEW', view })
|
dispatch({ type: 'SET_MODAL_VIEW', view })
|
||||||
|
|
||||||
const value = {
|
const value = useMemo(
|
||||||
...state,
|
() => ({
|
||||||
openSidebar,
|
...state,
|
||||||
closeSidebar,
|
openSidebar,
|
||||||
openDropdown,
|
closeSidebar,
|
||||||
closeDropdown,
|
openDropdown,
|
||||||
openModal,
|
closeDropdown,
|
||||||
closeModal,
|
openModal,
|
||||||
setModalView,
|
closeModal,
|
||||||
openToast,
|
setModalView,
|
||||||
closeToast,
|
openToast,
|
||||||
}
|
closeToast,
|
||||||
|
}),
|
||||||
|
[state]
|
||||||
|
)
|
||||||
|
|
||||||
return <UIContext.Provider value={value} {...props} />
|
return <UIContext.Provider value={value} {...props} />
|
||||||
}
|
}
|
||||||
|
@ -60,10 +60,10 @@ export default function Home({
|
|||||||
// products, then fill them with products from the products list, this
|
// products, then fill them with products from the products list, this
|
||||||
// is useful for new commerce sites that don't have a lot of products
|
// is useful for new commerce sites that don't have a lot of products
|
||||||
return {
|
return {
|
||||||
featured: rangeMap(
|
featured: rangeMap(6, (i) => featuredProducts[i] ?? products.shift())
|
||||||
6,
|
.filter(nonNullable)
|
||||||
(i) => featuredProducts[i] ?? products.shift()
|
.sort((a, b) => a.node.prices.price.value - b.node.prices.price.value)
|
||||||
).filter(nonNullable),
|
.reverse(),
|
||||||
bestSelling: rangeMap(
|
bestSelling: rangeMap(
|
||||||
6,
|
6,
|
||||||
(i) => bestSellingProducts[i] ?? products.shift()
|
(i) => bestSellingProducts[i] ?? products.shift()
|
||||||
@ -86,7 +86,7 @@ export default function Home({
|
|||||||
))}
|
))}
|
||||||
</Grid>
|
</Grid>
|
||||||
<Marquee variant="secondary">
|
<Marquee variant="secondary">
|
||||||
{bestSelling.slice(0, 3).map(({ node }) => (
|
{bestSelling.slice(3, 6).map(({ node }) => (
|
||||||
<ProductCard
|
<ProductCard
|
||||||
key={node.path}
|
key={node.path}
|
||||||
product={node}
|
product={node}
|
||||||
@ -118,7 +118,7 @@ export default function Home({
|
|||||||
))}
|
))}
|
||||||
</Grid>
|
</Grid>
|
||||||
<Marquee>
|
<Marquee>
|
||||||
{bestSelling.slice(3, 6).map(({ node }) => (
|
{bestSelling.slice(0, 3).map(({ node }) => (
|
||||||
<ProductCard
|
<ProductCard
|
||||||
key={node.path}
|
key={node.path}
|
||||||
product={node}
|
product={node}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user