Updated users schema

service/migrations/000011_create_users/up.sql

@@ -4,5 +4,5 @@ CREATE TABLE IF NOT EXISTS users (
   role TEXT NOT NULL,
   first_name TEXT NOT NULL,
   last_name TEXT NOT NULL,
-  verified BOOLEAN NOT NULL DEFAULT FALSE,
+  verified BOOLEAN NOT NULL DEFAULT FALSE
 );

service/src/auth/model.rs

@@ -27,6 +27,7 @@ impl RegisterUser {
       role: "user".to_string(),
       first_name: self.first_name,
       last_name: self.last_name,
+      verified: false,
     })
   }
 }
@@ -45,6 +46,7 @@ pub struct QueryUser {
   pub role: String,
   pub first_name: String,
   pub last_name: String,
+  pub verified: bool,
 }
 
 impl QueryUser {
@@ -67,6 +69,7 @@ pub struct InsertUser {
   pub role: String,
   pub first_name: String,
   pub last_name: String,
+  pub verified: bool,
 }
 
 impl InsertUser {

service/src/auth/routes.rs

@@ -350,6 +350,7 @@ pub fn init_routes(config: &mut web::ServiceConfig) {
   };
   let mut u = r.convert_to_insert().unwrap();
   u.role = "admin".to_string();
+  u.verified = true;
   let _ = InsertUser::insert(u);
   config.service(web::scope("auth")
     .service(register)

service/src/db/schema.rs

@@ -46,5 +46,6 @@ diesel::table! {
     role -> Text,
     first_name -> Text,
     last_name -> Text,
+    verified -> Bool,
   }
 }

ui/src/components/Topbar/index.tsx

@@ -10,6 +10,7 @@ import {
   Card,
   Checkbox,
   Container,
+  Grid,
   Group,
   Menu,
   Modal,
@@ -147,11 +148,25 @@ export default function Topbar() {
                   <Text ta='center' fz='sm' c='dimmed'>
                     {user.role}
                   </Text>
+                  <Grid mt='xl'>
+                    <Grid.Col span={6}>
                       <Button
                         fullWidth
                         radius='md'
-                    mt='xl'
-                    size='md'
+                        size='xs'
+                        variant='default'
+                        onClick={() => {
+                          toggle(undefined);
+                        }}
+                      >
+                        Profile
+                      </Button>
+                    </Grid.Col>
+                    <Grid.Col span={6}>
+                      <Button
+                        fullWidth
+                        radius='md'
+                        size='xs'
                         variant='default'
                         onClick={async () => {
                           const response = await logout();
@@ -163,6 +178,8 @@ export default function Topbar() {
                       >
                         Logout
                       </Button>
+                    </Grid.Col>
+                  </Grid>
                 </Card>
               </Menu.Dropdown>
             </Menu>
@@ -207,9 +224,6 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
     if (!/[!@#$%^&*]/.test(value)) {
       return 'Password must contain at least one special character';
     }
-    if (/(.)\1\1/.test(value)) {
-      return 'Password must not contain more than 2 repeating characters';
-    }
     return null;
   }
 
@@ -223,13 +237,12 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
     return null;
   }
 
-  const form = useForm({
+  const registerForm = useForm({
     initialValues: {
       firstName: '',
       lastName: '',
       email: '',
-      password: '',
-      remember: false
+      password: ''
     },
     validate: {
       firstName: (value) => (value.trim().length > 0 ? null : 'First name is required'),
@@ -239,10 +252,26 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
     }
   });
 
+  const loginForm = useForm({
+    initialValues: {
+      email: '',
+      password: '',
+      remember: false
+    }
+  });
+
+  const resetForm = useForm({
+    initialValues: {
+      email: ''
+    }
+  });
+
   function onClose() {
     toggle(undefined);
-    if (!form.values.remember) {
-      form.reset();
+    registerForm.reset();
+    resetForm.reset();
+    if (!loginForm.values.remember) {
+      loginForm.reset();
     }
   }
 
@@ -258,8 +287,8 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
             </Anchor>
           </Text>
           <Paper withBorder shadow='md' p={30} mt={30} radius='md'>
-            <form onSubmit={form.onSubmit(async (values) => console.log(values))}>
-              <TextInput label='Email' placeholder='you@example.com' required {...form.getInputProps('email')} />
+            <form onSubmit={resetForm.onSubmit(async (values) => console.log(values))}>
+              <TextInput label='Email' placeholder='you@example.com' required {...resetForm.getInputProps('email')} />
               <Button type='submit' fullWidth mt='xl'>
                 Reset password
               </Button>
@@ -278,7 +307,7 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
 
           <Paper withBorder shadow='md' p={30} mt={30} radius='md'>
             <form
-              onSubmit={form.onSubmit(async (values) => {
+              onSubmit={registerForm.onSubmit(async (values) => {
                 const id = notifications.show({
                   loading: true,
                   title: `Creating account`,
@@ -327,16 +356,27 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
                 }
               })}
             >
-              <TextInput label='First name' placeholder='John' required {...form.getInputProps('firstName')} />
-              <TextInput label='Last name' placeholder='Smith' required mt='md' {...form.getInputProps('lastName')} />
-              <TextInput label='Email' placeholder='you@example.com' required {...form.getInputProps('email')} />
+              <TextInput label='First name' placeholder='John' required {...registerForm.getInputProps('firstName')} />
+              <TextInput
+                label='Last name'
+                placeholder='Smith'
+                required
+                mt='md'
+                {...registerForm.getInputProps('lastName')}
+              />
+              <TextInput
+                label='Email'
+                placeholder='you@example.com'
+                required
+                {...registerForm.getInputProps('email')}
+              />
               <PasswordInput
                 label='Password'
                 description='Passwords must be at least 10 characters long, contain at least one number, one uppercase letter, one lowercase letter, and one special character.'
                 placeholder='Your password'
                 required
                 mt='md'
-                {...form.getInputProps('password')}
+                {...registerForm.getInputProps('password')}
               />
               <Button type='submit' fullWidth mt='xl'>
                 Sign up
@@ -356,7 +396,7 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
 
           <Paper withBorder shadow='md' p={30} mt={30} radius='md'>
             <form
-              onSubmit={form.onSubmit(async (values) => {
+              onSubmit={loginForm.onSubmit(async (values) => {
                 const response = await login(values.email, values.password);
                 if (response) {
                   setUser(response.user);
@@ -371,16 +411,16 @@ function LoginModal({ type, toggle, setUser }: LoginModalProps) {
                 }
               })}
             >
-              <TextInput label='Email' placeholder='you@example.com' required {...form.getInputProps('email')} />
+              <TextInput label='Email' placeholder='you@example.com' required {...loginForm.getInputProps('email')} />
               <PasswordInput
                 label='Password'
                 placeholder='Your password'
                 required
                 mt='md'
-                {...form.getInputProps('password')}
+                {...loginForm.getInputProps('password')}
               />
               <Group justify='space-between' mt='lg'>
-                <Checkbox label='Remember me' {...form.getInputProps('remember')} />
+                <Checkbox label='Remember me' {...loginForm.getInputProps('remember')} />
                 <Anchor component='a' size='sm' onClick={() => toggle('reset')}>
                   Forgot password?
                 </Anchor>