4
0
forked from crowetic/commerce

Context Performance

This commit is contained in:
Belen Curcio 2020-10-26 20:13:05 -03:00
parent f6beae6e38
commit 2da59ba533
5 changed files with 33 additions and 28 deletions

View File

@ -1,6 +1,6 @@
import { FC, useEffect, useState, useCallback } from 'react'
import { validate } from 'email-validator'
import { Info } from'@components/icons'
import { Info } from '@components/icons'
import { useUI } from '@components/ui/context'
import { Logo, Button, Input } from '@components/ui'
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>
)}
<Input placeholder="Email" onChange={setEmail} />
<Input placeholder="Email" onChange={setEmail} type="email" />
<div className="pt-2 w-full flex flex-col">
<Button
variant="slim"

View File

@ -70,8 +70,8 @@ const LoginView: FC<Props> = () => {
</a>
</div>
)}
<Input placeholder="Email" onChange={setEmail} />
<Input placeholder="Password" onChange={setPassword} />
<Input placeholder="Email" onChange={setEmail} type="email" />
<Input placeholder="Password" onChange={setPassword} type="password" />
<Button
variant="slim"

View File

@ -69,8 +69,8 @@ const SignUpView: FC<Props> = () => {
)}
<Input placeholder="First Name" onChange={setFirstName} />
<Input placeholder="Last Name" onChange={setLastName} />
<Input placeholder="Email" onChange={setEmail} />
<Input placeholder="Password" onChange={setPassword} />
<Input placeholder="Email" onChange={setEmail} type="email" />
<Input placeholder="Password" onChange={setPassword} type="password" />
<span className="text-accents-8">
<span className="inline-block align-middle ">
<Info width="15" height="15" />

View File

@ -20,15 +20,17 @@ const Input: React.FC<Props> = (props) => {
}
return (
<input
className={rootClassName}
onChange={handleOnChange}
autoComplete="off"
autoCorrect="off"
autoCapitalize="off"
spellCheck="false"
{...rest}
/>
<label>
<input
className={rootClassName}
onChange={handleOnChange}
autoComplete="off"
autoCorrect="off"
autoCapitalize="off"
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 { SSRProvider, OverlayProvider } from 'react-aria'
@ -144,18 +144,21 @@ export const UIProvider: FC = (props) => {
const setModalView = (view: MODAL_VIEWS) =>
dispatch({ type: 'SET_MODAL_VIEW', view })
const value = {
...state,
openSidebar,
closeSidebar,
openDropdown,
closeDropdown,
openModal,
closeModal,
setModalView,
openToast,
closeToast,
}
const value = useMemo(
() => ({
...state,
openSidebar,
closeSidebar,
openDropdown,
closeDropdown,
openModal,
closeModal,
setModalView,
openToast,
closeToast,
}),
[state]
)
return <UIContext.Provider value={value} {...props} />
}