[react] feat: Added docs for components/SignUp

packages/react/components/SignUp/index.mjs

@@ -27,7 +27,16 @@ import { EmailInput } from '@freesewing/react/components/Input'
 import { IconButton } from '@freesewing/react/components/Button'
 import { Spinner } from '@freesewing/react/components/Spinner'
 import { Consent } from '@freesewing/react/components/Account'
+import { Popout } from '@freesewing/react/components/Popout'
 
+/**
+ * The SignUp component holds the entire sign-up form
+ *
+ * @component
+ * @param {object} props - All component props
+ * @param {boolean} [props.embed = false] - Set this tot rue to use a H2 level heading instead of H1 so the form can be embedded in an existing page
+ * @returns {JSX.Element}
+ */
 export const SignUp = ({ embed = false }) => {
   // State
   const [email, setEmail] = useState('')
@@ -186,19 +195,31 @@ export const SignUp = ({ embed = false }) => {
   )
 }
 
+/**
+ * A component to handle the confirmation URL for a passwordless signup 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 SignUpConfirmation = ({ onSuccess = false }) => {
   // State
   const [id, setId] = useState()
+  const [error, setError] = useState(false)
   const [check, setCheck] = useState()
 
   // Effects
   useEffect(() => {
     const newId = getSearchParam('id')
+    if (!newId) setError('noId')
     const newCheck = getSearchParam('check')
     if (newId !== id) setId(newId)
     if (newCheck !== check) setCheck(newCheck)
   }, [id, check])
 
+  // Short-circuit errors
+  if (error === 'noId') return <Popout type="error" title="Invalid Sign Up URL">You seem to have arrived on this page in a way that is not supported</Popout>
   // If we do not (yet) have the data, show a loader
   if (!id || !check)
     return (

packages/react/mkdocs.sh

@@ -33,3 +33,4 @@ jsdoc -c jsdoc.json components/Popout/* > ../../sites/dev/prebuild/jsdoc/react/c
 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
+jsdoc -c jsdoc.json components/SignUp/* > ../../sites/dev/prebuild/jsdoc/react/components/signup.json

sites/dev/docs/reference/packages/react/components/signup/readme.mdx

@@ -2,6 +2,29 @@
 title: SignUp
 ---
 
-:::note
-This page is yet to be created
-:::
+import { DocusaurusDoc } from '@freesewing/react/components/Docusaurus'
+import { ComponentDocs } from '@site/src/components/component-docs.js'
+import * as jsdoc from '@site/prebuild/jsdoc/components.signup.mjs'
+import { SignUp, SignUpConfirmation } from '@freesewing/react/components/SignUp'
+
+<DocusaurusDoc>
+
+- [Components](#components)
+
+## Components
+
+The **SignUp** component family provides the following components:
+
+- [SignUp](#signup)
+- [SignUpConfirmation](#signupconfirmation)
+
+### SignUp
+
+<ComponentDocs docs={jsdoc.jsdocSignUp} example={SignUp} />
+
+### SignUpConfirmation
+
+<ComponentDocs docs={jsdoc.jsdocSignUpConfirmation} example={SignUpConfirmation} />
+
+</DocusaurusDoc>
+