Implement password authentication and registration

w4 · Oct 30, 2021 · 5fd9217 · 5fd9217
1 parent 9acf633
commit 5fd9217
Show file tree

Hide file tree

Showing 13 changed files with 400 additions and 34 deletions.
diff --git a/Cargo.lock b/Cargo.lock
diff --git a/chartered-db/src/lib.rs b/chartered-db/src/lib.rs
@@ -131,6 +131,8 @@ pub enum Error {
     MissingOrganisation,
     /// Version {0} already exists for this crate
     VersionConflict(String),
+    /// Username is already taken
+    UsernameTaken,
 }
 
 impl Error {

diff --git a/chartered-db/src/schema.rs b/chartered-db/src/schema.rs
@@ -95,6 +95,7 @@ table! {
         id -> Integer,
         uuid -> Binary,
         username -> Text,
+        password -> Nullable<Text>,
         name -> Nullable<Text>,
         nick -> Nullable<Text>,
         email -> Nullable<Text>,

diff --git a/chartered-db/src/users.rs b/chartered-db/src/users.rs
@@ -3,9 +3,12 @@ use super::{
     permissions::UserPermission,
     schema::{user_crate_permissions, user_sessions, user_ssh_keys, users},
     uuid::SqlUuid,
-    ConnectionPool, Result,
+    ConnectionPool, Error, Result,
+};
+use diesel::result::DatabaseErrorKind;
+use diesel::{
+    insert_into, prelude::*, result::Error as DieselError, Associations, Identifiable, Queryable,
 };
-use diesel::{insert_into, prelude::*, Associations, Identifiable, Queryable};
 use rand::{thread_rng, Rng};
 use std::sync::Arc;
 use thrussh_keys::PublicKeyBase64;
@@ -15,6 +18,7 @@ pub struct User {
     pub id: i32,
     pub uuid: SqlUuid,
     pub username: String,
+    pub password: Option<String>,
     pub name: Option<String>,
     pub nick: Option<String>,
     pub email: Option<String>,
@@ -172,6 +176,33 @@ impl User {
         .await?
     }
 
+    pub async fn register(
+        conn: ConnectionPool,
+        username: String,
+        password_hash: String,
+    ) -> Result<()> {
+        tokio::task::spawn_blocking(move || {
+            let conn = conn.get()?;
+
+            let res = diesel::insert_into(users::table)
+                .values((
+                    users::username.eq(&username),
+                    users::uuid.eq(SqlUuid::random()),
+                    users::password.eq(&password_hash),
+                ))
+                .execute(&conn);
+
+            match res {
+                Ok(_) => Ok(()),
+                Err(DieselError::DatabaseError(DatabaseErrorKind::UniqueViolation, _)) => {
+                    Err(Error::UsernameTaken)
+                }
+                Err(e) => Err(e.into()),
+            }
+        })
+        .await?
+    }
+
     /// Parses an ssh key from its `ssh-add -L` format (`ssh-ed25519 AAAAC3N...`) and
     /// inserts it to the database for the user.
     pub async fn insert_ssh_key(

diff --git a/chartered-frontend/src/dark.sass b/chartered-frontend/src/dark.sass
@@ -52,6 +52,9 @@ html, body
     &.btn-danger
       color: white
 
+  .btn-outline-primary:hover
+    color: white
+
   .btn-outline-light
     border-color: $link-color
 

diff --git a/chartered-frontend/src/index.tsx b/chartered-frontend/src/index.tsx
@@ -26,6 +26,7 @@ import CreateOrganisation from "./pages/organisations/CreateOrganisation";
 import User from "./pages/User";
 import Search from "./pages/Search";
 import { backgroundFix } from "./overscrollColourFixer";
+import Register from "./pages/Register";
 
 if (
   window.matchMedia &&
@@ -53,6 +54,12 @@ function App() {
             path="/login"
             component={() => <Login />}
           />
+          <PublicRoute
+            extract
+            unauthedOnly
+            path="/register"
+            component={() => <Register />}
+          />
           <PublicRoute
             exact
             unauthedOnly

diff --git a/chartered-frontend/src/pages/Login.tsx b/chartered-frontend/src/pages/Login.tsx
@@ -5,7 +5,7 @@ import {
   SyntheticEvent,
   MouseEventHandler,
 } from "react";
-import { useLocation } from "react-router-dom";
+import { useLocation, Link } from "react-router-dom";
 
 import { useAuth } from "../useAuth";
 import { useUnauthenticatedRequest } from "../util";
@@ -17,18 +17,25 @@ import {
   IconDefinition,
 } from "@fortawesome/free-brands-svg-icons";
 import { faSignInAlt } from "@fortawesome/free-solid-svg-icons";
+import { PersonPlus } from "react-bootstrap-icons";
 
 interface OAuthProviders {
   providers: string[];
 }
 
+interface Prompt {
+  message: string;
+  kind: string;
+}
+
 export default function Login() {
   const location = useLocation();
   const auth = useAuth();
 
+  const [ackLocation, setAckLocation] = useState(false);
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
-  const [error, setError] = useState("");
+  const [prompt, setPrompt] = useState<Prompt | null>(null);
   const [loading, setLoading] = useState<string | null>(null);
   const isMountedRef = useRef(null);
 
@@ -38,8 +45,9 @@ export default function Login() {
     });
 
   useEffect(() => {
-    if (location.state?.error) {
-      setError(location.state.error);
+    if (location.state?.prompt && !ackLocation) {
+      setPrompt(location.state.prompt);
+      setAckLocation(true);
     }
 
     isMountedRef.current = true;
@@ -51,13 +59,13 @@ export default function Login() {
   const handleSubmit = async (evt: SyntheticEvent) => {
     evt.preventDefault();
 
-    setError("");
+    setPrompt(null);
     setLoading("password");
 
     try {
       await auth?.login(username, password);
     } catch (e: any) {
-      setError(e.message);
+      setPrompt({ message: e.message, kind: "danger" });
     } finally {
       if (isMountedRef.current) {
         setLoading(null);
@@ -66,13 +74,13 @@ export default function Login() {
   };
 
   const handleOAuthLogin = async (provider: string) => {
-    setError("");
+    setPrompt(null);
     setLoading(provider);
 
     try {
       await auth?.oauthLogin(provider);
     } catch (e: any) {
-      setError(e.message);
+      setPrompt({ message: e.message, kind: "danger" });
     }
   };
 
@@ -88,17 +96,17 @@ export default function Login() {
         >
           <div className="card-body">
             <div
-              className="alert alert-danger alert-dismissible"
+              className={`alert alert-${prompt?.kind} alert-dismissible`}
               role="alert"
-              style={{ display: error ? "block" : "none" }}
+              style={{ display: prompt ? "block" : "none" }}
             >
-              {error}
+              {prompt?.message}
 
               <button
                 type="button"
                 className="btn-close"
                 aria-label="Close"
-                onClick={() => setError("")}
+                onClick={() => setPrompt(null)}
               />
             </div>
 
@@ -146,9 +154,16 @@ export default function Login() {
               />
             </form>
 
+            <Link
+              to="/register"
+              className="btn btn-lg w-100 btn-outline-primary mt-2"
+            >
+              <PersonPlus /> Register
+            </Link>
+
             {oauthProviders?.providers.length > 0 ? (
               <>
-                <div className="side-lines mt-3">or</div>
+                <div className="side-lines mt-2">or</div>
 
                 {oauthProviders.providers.map((v, i) => (
                   <ButtonOrSpinner