From 5740248b969fa20a6d087b1167b810cdad464684 Mon Sep 17 00:00:00 2001
From: Max Hohlfeld <maxhohlfeld@posteo.de>
Date: Mon, 11 Nov 2024 20:27:01 +0100
Subject: [PATCH] refactor: rework index

---
 src/filters.rs                          | 15 +++++++++++++-
 templates/availability/new_or_edit.html | 24 +++++++++++++++++------
 templates/index.html                    | 26 ++++++++++++++-----------
 3 files changed, 47 insertions(+), 18 deletions(-)

diff --git a/src/filters.rs b/src/filters.rs
index 6049564e..44e429ad 100644
--- a/src/filters.rs
+++ b/src/filters.rs
@@ -1,3 +1,5 @@
+use crate::models::Function;
+
 pub fn show_area_query(a: &Option<i32>, first: bool) -> ::askama::Result<String> {
     let char = if first { '?' } else { '&' };
 
@@ -27,7 +29,7 @@ pub fn insert_value(option: &Option<String>) -> askama::Result<String> {
 
 pub fn is_some_and_eq<T>(option: &Option<T>, other: &T) -> askama::Result<bool>
 where
-    T: Eq
+    T: Eq,
 {
     Ok(option.as_ref().is_some_and(|x| x == other))
 }
@@ -35,3 +37,14 @@ where
 pub fn invert(b: &bool) -> askama::Result<bool> {
     return Ok(!b);
 }
+
+pub fn show_tree(f: &Function) -> askama::Result<String> {
+    let tags = match f {
+        Function::Posten => r#"<span class="tag is-info is-light">Posten</span>"#,
+        Function::Wachhabender => {
+            r#"<span class="tag is-info is-light">Posten</span><span class="tag is-info">Wachhabender</span>"#
+        }
+    };
+
+    Ok(format!(r#"<div class="tags">{tags}</div>"#))
+}
diff --git a/templates/availability/new_or_edit.html b/templates/availability/new_or_edit.html
index c1575da6..a25ba418 100644
--- a/templates/availability/new_or_edit.html
+++ b/templates/availability/new_or_edit.html
@@ -79,14 +79,26 @@
           <div class="field-body">
             <div class="field is-grouped">
               <div class="control">
-                {% if id.is_some() %}
-                <input class="button is-link" type="submit" value="Bearbeiten">
-                {% else %}
-                <input class="button is-link" type="submit" value="Erstellen">
-                {% endif %}
+                <button class="button is-success">
+                  <svg class="icon">
+                    <use href="/static/feather-sprite.svg#check-circle" />
+                  </svg>
+                  <span>
+                    {% if id.is_some() %}
+                    Speichern
+                    {% else %}
+                    Erstellen
+                    {% endif %}
+                  </span>
+                </button>
               </div>
               <div class="control">
-                <a class="button is-link is-light" href="/?date={{ date }}" hx-boost="true">Zurück</a>
+                <a class="button is-link is-light" hx-boost="true" href="/?date={{ date }}">
+                  <svg class="icon">
+                    <use href="/static/feather-sprite.svg#arrow-left" />
+                  </svg>
+                  <span>Zurück</span>
+                </a>
               </div>
             </div>
           </div>
diff --git a/templates/index.html b/templates/index.html
index 603a315b..38e28674 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -141,13 +141,7 @@
             <tr>
               <td>{{ u.name }}</td>
               <td>
-                {% match u.function %}
-                {% when Function::Posten %}
-                <span class="tag is-info is-light">Posten</span>
-                {% when Function::Wachhabender %}
-                <span class="tag is-info">Wachhabender</span>
-                {% else %}
-                {% endmatch %}
+                {{ u.function|show_tree|safe }}
               </td>
               <td>
                 {% if availabillity.start_time.is_some() && availabillity.end_time.is_some() %}
@@ -163,10 +157,20 @@
               <td>
                 {% if availabillity.user_id == user.id %}
                 <div class="buttons is-right">
-                  <a class="button is-link" hx-boost="true"
-                    href="/availabillity/edit/{{ availabillity.id }}">Bearbeiten</a>
-                  <button class="button is-danger" hx-delete="/availabillity/delete/{{ availabillity.id }}"
-                    hx-target="closest tr" hx-swap="delete">Löschen</button>
+                  <a class="button is-primary is-light" hx-boost="true"
+                    href="/availabillity/edit/{{ availabillity.id }}">
+                    <svg class="icon">
+                      <use href="/static/feather-sprite.svg#edit" />
+                    </svg>
+                    <span>Bearbeiten</span>
+                  </a>
+                  <button class="button is-danger is-light" hx-delete="/availabillity/delete/{{ availabillity.id }}"
+                    hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed">
+                    <svg class="icon">
+                      <use href="/static/feather-sprite.svg#x-circle" />
+                    </svg>
+                    <span>Löschen</span>
+                  </button>
                 </div>
                 {% endif %}
               </td>