[react] feat: Added docs for components/SignIn
This commit is contained in:
parent
df45155cdb
commit
82015e992f
3 changed files with 47 additions and 50 deletions
|
@ -30,11 +30,18 @@ import { MfaInput, StringInput, PasswordInput } from '@freesewing/react/componen
|
|||
import { H1, H2, H3, H4 } from '@freesewing/react/components/Heading'
|
||||
|
||||
/*
|
||||
* This SignIn component holds the entire sign-in form
|
||||
*
|
||||
* @param {object} props - All React props
|
||||
* @param {function} props.onSuccess - Optional: A method to run when the sign in is successful
|
||||
* @param {function} props.silent - Optional: Silently login the user if we have a valid session
|
||||
*/
|
||||
|
||||
/**
|
||||
* The SignIn component holds the entire sign-in form
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {function} [props.onSuccess = false] - A method to run when the sign in is successful
|
||||
* @param {boolean} [props.silent] - Silently login the user if we have a valid session
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const SignIn = ({ onSuccess = false, silent = false }) => {
|
||||
const { account, setAccount, setToken, seenUser, setSeenUser } = useAccount()
|
||||
|
@ -331,6 +338,14 @@ const MfaForm = ({ mfaCode, setMfaCode, onSubmit, post = [] }) => (
|
|||
</WrapForm>
|
||||
)
|
||||
|
||||
/**
|
||||
* A component to handle the confirmation URL for a passwordless login link (aka magic link).
|
||||
*
|
||||
* @component
|
||||
* @param {object} props - All component props
|
||||
* @param {function} [props.onSuccess = false] - A method to run when the sign in is successful
|
||||
* @returns {JSX.Element}
|
||||
*/
|
||||
export const SignInConfirmation = ({ onSuccess = false }) => {
|
||||
// State
|
||||
const [error, setError] = useState(false)
|
||||
|
@ -349,6 +364,7 @@ export const SignInConfirmation = ({ onSuccess = false }) => {
|
|||
// Effects
|
||||
useEffect(() => {
|
||||
const newId = getSearchParam('id')
|
||||
if (!newId) setError('noId')
|
||||
const newCheck = getSearchParam('check')
|
||||
if (newId !== id) setId(newId)
|
||||
if (newCheck !== check) setCheck(newCheck)
|
||||
|
@ -396,6 +412,7 @@ export const SignInConfirmation = ({ onSuccess = false }) => {
|
|||
}
|
||||
|
||||
// Short-circuit errors
|
||||
if (error === 'noId') return <Popout type="error" title="Invalid Sign In URL">You seem to have arrived on this page in a way that is not supported</Popout>
|
||||
if (error && mfa)
|
||||
return error === 'signInFailed' ? (
|
||||
<>
|
||||
|
@ -425,47 +442,3 @@ export const SignInConfirmation = ({ onSuccess = false }) => {
|
|||
|
||||
return <p>fixme</p>
|
||||
}
|
||||
|
||||
/*
|
||||
* This is the generic component that will handle the Oauth callback
|
||||
*/
|
||||
export const OauthCallback = ({ provider = false }) => {
|
||||
const [error, setError] = useState(false)
|
||||
const backend = useBackend()
|
||||
const { setAccount, setToken, setSeenUser } = useAccount()
|
||||
|
||||
// Handle callback
|
||||
useEffect(() => {
|
||||
const oauthFlow = async () => {
|
||||
const state = getSearchParam('state')
|
||||
const code = getSearchParam('state')
|
||||
const [status, body] = await backend.oauthSignIn({ state, code, provider })
|
||||
if (status === 200 && body.account && body.token) {
|
||||
setAccount(body.account)
|
||||
setToken(body.token)
|
||||
setSeenUser(body.data.account.username)
|
||||
navigate('/welcome', true)
|
||||
} else setError(true)
|
||||
}
|
||||
oauthFlow()
|
||||
}, [])
|
||||
|
||||
if (!provider) return <p>You must provide a provider prop to this component</p>
|
||||
|
||||
return error ? (
|
||||
<>
|
||||
<h2>Oh no, something went wrong</h2>
|
||||
<p>
|
||||
Please{' '}
|
||||
<Link className={linkClasses} href="/support">
|
||||
escalate this to support
|
||||
</Link>
|
||||
</p>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<h2>One moment please</h2>
|
||||
<Spinner className="tw:w-8 tw:h-8 tw:m-auto tw:animate-spin" />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -32,3 +32,4 @@ jsdoc -c jsdoc.json components/Pattern/* > ../../sites/dev/prebuild/jsdoc/react/
|
|||
jsdoc -c jsdoc.json components/Popout/* > ../../sites/dev/prebuild/jsdoc/react/components/popout.json
|
||||
jsdoc -c jsdoc.json components/Profile/* > ../../sites/dev/prebuild/jsdoc/react/components/profile.json
|
||||
jsdoc -c jsdoc.json components/Role/* > ../../sites/dev/prebuild/jsdoc/react/components/role.json
|
||||
jsdoc -c jsdoc.json components/SignIn/* > ../../sites/dev/prebuild/jsdoc/react/components/signin.json
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue