feat: Add recruiter dropdown to registration

scrum-gang · Feb 24, 2019 · c83995b · c83995b
1 parent bb6129f
commit c83995b
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 6 deletions.
diff --git a/src/Features/Authentication/Register.tsx b/src/Features/Authentication/Register.tsx
@@ -1,25 +1,28 @@
 import * as React from "react";
-import { Redirect } from "react-router-dom";
 import { toast } from "react-toastify";
 
 import {
   Button,
   createStyles,
+  FormControl,
   Grid,
+  InputLabel,
+  MenuItem,
+  OutlinedInput,
   Paper,
   Theme,
   Typography,
   withStyles,
   WithStyles
 } from "@material-ui/core";
 import { Field, Form, Formik, FormikActions } from "formik";
-import { TextField } from "formik-material-ui";
+import { Select, TextField } from "formik-material-ui";
 
 import userAPI from "../../api/userAPI";
 import UserType from "../../config/types/accountTypes";
 import { AuthRedirect, Protection } from "../../Shared/Authorization";
-import registrationSchema from "./registrationSchema";
 import ConfirmMessage from "./ConfirmMessageModal";
+import registrationSchema from "./registrationSchema";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -48,6 +51,7 @@ const Register: React.FunctionComponent<IProps> = ({ classes }) => {
     values: {
       email: string;
       password: string;
+      type: UserType;
       confirm: string;
     },
     actions: FormikActions<any>
@@ -57,7 +61,7 @@ const Register: React.FunctionComponent<IProps> = ({ classes }) => {
       .register({
         email: values.email,
         password: values.password,
-        type: UserType.APPLICANT
+        type: values.type
       })
       .then(response => {
         setRegistered(true);
@@ -82,7 +86,12 @@ const Register: React.FunctionComponent<IProps> = ({ classes }) => {
       >
         <Paper className={classes.registerContainer}>
           <Formik
-            initialValues={{ email: "", password: "", confirm: "" }}
+            initialValues={{
+              email: "",
+              password: "",
+              confirm: "",
+              type: UserType.APPLICANT
+            }}
             validationSchema={registrationSchema}
             onSubmit={handleSubmit}
           >
@@ -121,6 +130,24 @@ const Register: React.FunctionComponent<IProps> = ({ classes }) => {
                   type="password"
                   margin="dense"
                 />
+                <FormControl variant="outlined" margin="dense">
+                  <InputLabel htmlFor="type-simple">type</InputLabel>
+                  <Field
+                    name="type"
+                    margin="dense"
+                    component={Select}
+                    input={
+                      <OutlinedInput
+                        labelWidth={30}
+                        name="type"
+                        id="type-simple"
+                      />
+                    }
+                  >
+                    <MenuItem value={UserType.APPLICANT}>Applicant</MenuItem>
+                    <MenuItem value={UserType.RECRUITER}>Recruiter</MenuItem>
+                  </Field>
+                </FormControl>
                 <Button
                   type="submit"
                   size="large"

diff --git a/src/Features/Authentication/registrationSchema.ts b/src/Features/Authentication/registrationSchema.ts
@@ -1,4 +1,5 @@
 import * as Yup from "yup";
+import UserType from "../../config/types/accountTypes";
 
 const registrationSchema = Yup.object().shape({
   email: Yup.string()
@@ -9,7 +10,10 @@ const registrationSchema = Yup.object().shape({
     .required(),
   confirm: Yup.string() //tslint:disable-line
     .oneOf([Yup.ref("password"), null], "Passwords must match")
-    .required("Password confirm is required")
+    .required("Password confirm is required"),
+  type: Yup.string()
+    .oneOf(Object.values(UserType))
+    .required()
 });
 
 export default registrationSchema;