indy form

src/pages/login/IndyForm.tsx

@@ -1,7 +1,8 @@
-import { Stack } from "@mui/material"
+import { Stack, Typography } from "@mui/material"
 import type { FC } from "react"
 
 import * as form from "codeforlife/components/form"
+import { Link } from "codeforlife/components/router"
 import { useNavigate } from "codeforlife/hooks"
 import { submitForm } from "codeforlife/utils/form"
 
@@ -18,15 +19,37 @@ const IndyForm: FC<IndyFormProps> = () => {
   return (
     <BaseForm
       themedBoxProps={{ userType: "independent" }}
-      header="text"
-      subheader="text"
+      header="Welcome"
+      subheader="Please enter your login details."
       initialValues={{ email: "", password: "" }}
       onSubmit={submitForm(loginWithEmail, {
         then: () => {
           navigate(paths.indy.dashboard._)
         },
       })}
     >
+      <form.EmailField required helperText="Enter your email address" />
+      <form.PasswordField required helperText="Enter your password" />
+      <Stack>
+        <Typography variant="body2" fontWeight="bold" mb={0}>
+          Forgotten your password?
+        </Typography>
+        <Typography variant="body2">
+          Don&apos;t worry, you can&nbsp;
+          <Link to={paths.resetPassword.independent._}>
+            reset your password
+          </Link>
+          .
+        </Typography>
+      </Stack>
+      <Stack direction="row">
+        <Typography variant="body2" fontWeight="bold" my={0}>
+          Part of a school or club?&nbsp;
+          <Link fontWeight="normal" to={paths.login.student._}>
+            Log in here
+          </Link>
+        </Typography>
+      </Stack>
       <Stack alignItems="end">
         <form.SubmitButton>Log in</form.SubmitButton>
       </Stack>