feat: improved ingress form and account settings

src/server/routes/html/account.rs

@@ -17,7 +17,7 @@ use crate::{
 
 use super::render_block;
 
-page_data!(AccountData, "auth/account.html", {
+page_data!(AccountData, "auth/account_settings.html", {
     user: User
 });
 

src/server/routes/html/ingress_form.rs

@@ -46,6 +46,8 @@ pub struct IngressParams {
 page_data!(IngressFormData, "ingress_form.html", {
     instructions: String,
     content: String,
+    category: String,
+    error: String,
 });
 
 pub async fn process_ingress_form(
@@ -56,15 +58,6 @@ pub async fn process_ingress_form(
     let user = auth.current_user.ok_or_else(|| {
         AppError::Auth("You must be signed in".to_string()).with_template(state.templates.clone())
     })?;
-    // let user = match auth.current_user {
-    //     Some(user) => user,
-    //     None => {
-    //         return Err(HtmlError::new(
-    //             AppError::Auth("You must be signed in".to_string()),
-    //             state.templates,
-    //         ))
-    //     }
-    // };
 
     if input.content.clone().is_some_and(|c| c.len() < 2) && input.files.is_empty() {
         let output = render_template(
@@ -72,17 +65,13 @@ pub async fn process_ingress_form(
             IngressFormData {
                 instructions: input.instructions.clone(),
                 content: input.content.clone().unwrap(),
+                category: input.category.clone(),
+                error: "You need to either add files or content".to_string(),
             },
             state.templates.clone(),
         )?;
 
         return Ok(output.into_response());
-
-        // return Ok((
-        //     StatusCode::UNAUTHORIZED,
-        //     Html("Invalid input, make sure you fill in either content or add files"),
-        // )
-        //     .into_response());
     }
 
     info!("{:?}", input);

templates/auth/account_settings.html

@@ -5,7 +5,7 @@
     opacity: 0.5;
   }
 </style>
-<main class="grow flex flex-col prose container mx-auto mt-2">
+<main class="grow flex flex-col prose container mx-auto mt-2 sm:mt-4">
   <h1 class="text-center">Account Settings</h1>
   <div class="form-control">
     <label class="label">
@@ -22,7 +22,8 @@
     {% if user.api_key %}
     <input type="text" name="api-key" value="{{ user.api_key }}" class="input text-gray-100! input-bordered w-full"
       disabled />
-    <a href="https://www.icloud.com/shortcuts/66985f7b98a74aaeac6ba29c3f1f0960" class="btn btn-accent mt-4">Download
+    <a href="https://www.icloud.com/shortcuts/66985f7b98a74aaeac6ba29c3f1f0960"
+      class="btn btn-accent mt-4 w-full">Download
       iOS
       shortcut</a>
     {% else %}

templates/auth/signin_form.html

@@ -18,7 +18,7 @@
     <div class="form-control">
       <label class="floating-label">
         <span>Email</span>
-        <input type="email" placeholder="Email" class="input input-md w-full validator" required />
+        <input name="email" type="email" placeholder="Email" class="input input-md w-full validator" required />
         <div class="validator-hint hidden">Enter valid email address</div>
       </label>
     </div>
@@ -26,7 +26,8 @@
     <div class="form-control mt-4">
       <label class="floating-label">
         <span>Password</span>
-        <input type="password" class="input validator w-full" required placeholder="Password" minlength="8" />
+        <input name="password" type="password" class="input validator w-full" required placeholder="Password"
+          minlength="8" />
     </div>
 
     <div class="form-control mt-4">
@@ -35,12 +36,15 @@
         <span class="label-text">Remember me</span>
       </label>
     </div>
+
     <div class="mt-4" id="login-result"></div>
+
     <div class="form-control mt-6">
       <button id="submit-btn" class="btn btn-primary w-full">
         Login
       </button>
     </div>
+
   </form>
   <div class="divider">OR</div>
   <div class="text-center text-sm">

templates/index/signed_in_view.html

@@ -1,10 +1,10 @@
 <div class="flex justify-center grow mt-2 sm:mt-4 gap-6">
   <div class="container">
     <!-- Search Bar -->
-    <div class="form-control w-full mx-auto mt-8">
+    <div class="form-control w-full mx-auto mt-8 flex flex-col justify-center">
       <h1 class="textl-lg text-center pb-5">So here you can search all your ingressed documents</h1>
-      <input type="text" placeholder="Search your knowledge base" class="input input-bordered w-full" name="query"
+      <input type="text" placeholder="Search your knowledge base" class="mx-auto input input-bordered w-full sm:w-3/4"
-        hx-get="/search" hx-target="#search-results" />
+        name="query" hx-get="/search" hx-target="#search-results" />
       <div id="search-results" class="mt-4">
         <!-- Results will be populated here by HTMX -->
       </div>

templates/ingress_form.html

@@ -1,19 +1,40 @@
-<div class="card">
+<form class="space-y-4 mt-2 w-full" hx-post="/ingress-form" enctype="multipart/form-data">
-  <form class="space-y-2" hx-post="/ingress-form" enctype="multipart/form-data">
+  <div class="form-control">
-    <h1 class="text-2xl">Add content to the database </h1>
+    <label class="floating-label">
-    <label class="label label-text">Instructions</label>
+      <span>Instructions</span>
-    <textarea name="instructions" class="textarea w-full input-bordered"
+      <textarea name="instructions" class="textarea w-full validator"
-      placeholder="Enter instructions for the AI here, help it understand what its seeing or how it should relate to the database">{{instructions
+        placeholder="Enter instructions for the AI here, help it understand what its seeing or how it should relate to the database"
-      }}</textarea>
+        required>{{ instructions }}</textarea>
-    <label class="label label-text">Content (optional)</label>
+      <div class="validator-hint hidden">Instructions are required</div>
-    <textarea name="content" class="textarea w-full input-bordered" placeholder="Additional content">{{content
+    </label>
-      }}</textarea>
+  </div>
-    <label class="label label-text">Category</label>
-    <input type="text" name="category" class="input input-bordered" placeholder="Category for ingress">
 
+  <div class="form-control">
+    <label class="floating-label">
+      <span>Content</span>
+      <textarea name="content" class="textarea input-bordered w-full"
+        placeholder="Enter the content you want to ingress, it can be an URL or a text snippet">{{ content
+        }}</textarea>
+    </label>
+  </div>
+
+  <div class="form-control">
+    <label class="floating-label">
+      <span>Category</span>
+      <input type="text" name="category" class="input input-bordered validator w-full"
+        placeholder="Category for ingress" value="{{ category }}" required />
+      <div class="validator-hint hidden">Category is required</div>
+    </label>
+  </div>
+
+  <div class="form-control">
     <label class="label label-text">Files</label>
-    <input type="file" name="files" multiple class="file-input file-input-bordered" />
+    <input type="file" name="files" multiple class="file-input file-input-bordered w-full" />
-    <button type="submit" class="btn btn-primary">Submit</button>
+  </div>
-  </form>
+
-  <div id="ingress-result"></div>
+  <div id="error-message" class="text-error text-center {% if not error %}hidden{% endif %}">{{ error }}</div>
-</div>
+
+  <div class="form-control mt-6">
+    <button type="submit" class="btn btn-primary w-full">Submit</button>
+  </div>
+</form>