4
0
forked from crowetic/commerce
This commit is contained in:
Luis Alvarez 2020-10-26 19:12:15 -05:00
commit 5962657b7d
4 changed files with 35 additions and 30 deletions

View File

@ -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"

View File

@ -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>
) )
} }

View File

@ -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} />
} }

View File

@ -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}