login system

assets/styles/theme.css

@@ -105,3 +105,7 @@
   --fg-selected: #f8fafc;
   --bg-selected: #1a1a1a;
 }
+
+.error {
+  color: rgb(211, 56, 48);
+}

src/backend/auth.rs

@@ -0,0 +1,23 @@
+use dioxus::prelude::*;
+
+#[derive(Debug, Clone, PartialEq, Eq, serde::Serialize, serde::Deserialize)]
+pub struct User {
+    username: String,
+    password: String,
+}
+
+#[server]
+pub async fn login(username: String, password: String) -> Result<String, ServerFnError> {
+    let users = crate::backend::get_mongo::<User>("users").await?;
+
+    match users
+        .find_one(mongodb::bson::doc! {
+            "username": username,
+            "password": password,
+        })
+        .await?
+    {
+        Some(v) => Ok(String::new()),
+        None => Err(ServerFnError::new(format!("Invalid credentials"))),
+    }
+}

src/backend/mod.rs

@@ -1,3 +1,5 @@
+pub mod auth;
+
 use crate::components::server::Server;
 use dioxus::prelude::*;
 
@@ -45,11 +47,6 @@ fn build_or_filter(input: &str, fields: &[&str]) -> mongodb::bson::Document {
     mongodb::bson::doc! { "$or": or_clauses }
 }
 
-#[server]
-pub async fn log_in(username: String, password: String) -> Result<String, ServerFnError> {
-    Ok(format!("{username}@{password}"))
-}
-
 #[server]
 pub async fn get_servers(search: String) -> Result<Vec<Server>, ServerFnError> {
     let servers = get_mongo::<Server>("servers").await?;

src/login.rs

@@ -8,6 +8,7 @@ const LOGIN_CSS: Asset = asset!("/assets/styles/login.css");
 pub fn Login() -> Element {
     let username = use_signal(|| String::new());
     let password = use_signal(|| String::new());
+    let error: Signal<Option<String>> = use_signal(|| None);
 
     let is_disabled = {
         let username = username.clone();
@@ -18,16 +19,20 @@ pub fn Login() -> Element {
     let log_in = {
         let username = username.clone();
         let password = password.clone();
+        let mut error = error.clone();
         move || async move {
             if username().is_empty() || password().is_empty() {
                 return;
             }
-            match backend::log_in(username.read().clone(), password.read().clone()).await {
+            error.set(None);
+            match backend::auth::login(username.read().clone(), password.read().clone()).await {
                 Ok(id) => {
                     utils::set_cookie("session_id", &id);
                     utils::redirect("/dashboard");
                 }
-                Err(_) => {}
+                Err(e) => error.set(Some(
+                    e.to_string().replace("error running server function: ", ""),
+                )),
             }
         }
     };
@@ -68,6 +73,10 @@ pub fn Login() -> Element {
                     }
                 }
 
+                if let Some(e) = &*error.read() {
+                    p { class: "error", "{e}" }
+                }
+
                 button {
                     disabled: is_disabled(),
                     onclick: move |_| log_in(),

src/utils.rs

@@ -1,4 +1,3 @@
-use dioxus::prelude::use_navigator;
 use wasm_bindgen::JsCast;
 use web_sys::{window, HtmlDocument};
 
@@ -38,5 +37,5 @@ pub fn get_cookie(name: &str) -> Option<String> {
 }
 
 pub fn redirect(target: &str) {
-    use_navigator().push(target);
+    web_sys::window().unwrap().location().set_href(target).unwrap();
 }