admin/security: show flash, confirm action with modal

crates/ezidam/src/routes/admin/settings.rs

@@ -72,10 +72,15 @@ pub async fn settings_update_branding(
 }
 
 #[get("/admin/settings/security")]
-pub async fn settings_security(admin: JwtAdmin) -> Result<Page> {
+pub async fn settings_security(
-    Ok(Page::AdminSettingsSecurity(
+    admin: JwtAdmin,
-        super::content::AdminSettingsSecurity { user: admin.0 },
+    flash: Option<FlashMessage<'_>>,
-    ))
+) -> Result<Template> {
+    let page = Page::AdminSettingsSecurity(super::content::AdminSettingsSecurity { user: admin.0 });
+
+    Ok(flash
+        .map(|flash| Page::with_flash(page.clone(), flash))
+        .unwrap_or_else(|| page.into()))
 }
 
 #[derive(Debug, FromForm)]
@@ -90,10 +95,11 @@ pub async fn settings_security_form(
     form: Form<SecurityForm>,
     ip_address: IpAddr,
     cookie_jar: &CookieJar<'_>,
-) -> Result<Redirect> {
+) -> Result<Flash<Redirect>> {
     let mut transaction = db.begin().await?;
 
-    if let Some(logout_everyone) = form.logout_everyone {
+    let (flash_kind, flash_message) = match form.logout_everyone {
+        Some(logout_everyone) => {
             if logout_everyone {
                 // Generate key id
                 let key_id = task::spawn_blocking(id::KeyID::default).await?;
@@ -162,9 +168,20 @@ pub async fn settings_security_form(
                 cookie.set_same_site(SameSite::Strict);
                 cookie.set_max_age(Duration::minutes(JWT_DURATION_MINUTES));
                 cookie_jar.add(cookie);
+
+                (FlashKind::Success, "Everyone has been logged out.")
+            } else {
+                (FlashKind::Warning, "Nothing to do.")
             }
         }
+        None => (FlashKind::Warning, "Nothing to do."),
+    };
+
     transaction.commit().await?;
 
-    Ok(Redirect::to(uri!(settings_security)))
+    Ok(Flash::new(
+        Redirect::to(uri!(settings_security)),
+        flash_kind,
+        flash_message,
+    ))
 }

crates/ezidam/templates/pages/admin/settings/security.html.tera

@@ -16,6 +16,13 @@
 <!-- Page body -->
 <div class="page-body">
     <div class="container-xl">
+
+        {% if flash %}
+        <div class="alert alert-{{flash.0}}" role="alert">
+            <h4 class="alert-title">{{ flash.1 | safe }}</h4>
+        </div>
+        {% endif %}
+
         <div class="card">
             <div class="row g-0">
                 <div class="col-3 d-none d-md-block border-end">
@@ -39,15 +46,13 @@
                         </p>
                         <p>This might take some time, but should not be long.</p>
 
-                        <div class="row align-items-center">
+                        <div class="row align-items-center mb-4">
 
                             <!-- Logout everyone -->
                             <div class="col-auto">
-                                <form action="" method="post">
+                                <a class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#modal-logout-confirm">
-                                    <button class="btn btn-danger" type="submit" name="logout_everyone" value="true">
                                     Logout everyone
-                                    </button>
+                                </a>
-                                </form>
                             </div>
 
                         </div>
@@ -57,4 +62,48 @@
         </div>
     </div>
 </div>
+
+
+<!-- Logout everyone modal -->
+<div class="modal modal-blur" tabindex="-1" id="modal-logout-confirm">
+    <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
+        <div class="modal-content">
+
+            <div class="modal-status bg-danger"></div>
+
+            <div class="modal-body text-center py-4">
+
+                <div class="text-danger mb-2">
+                    {% include "icons/alert-triangle-large" %}
+                </div>
+
+                <h3>Do you want to log out everyone?</h3>
+                <div class="mt-2">All users will be logged out.</div>
+                <div class="mt-2">This might take some time, but should not be long.</div>
+
+            </div>
+
+            <div class="modal-footer">
+                <div class="w-100">
+                    <div class="row">
+
+                        <div class="col">
+                            <a href="#" class="btn w-100" data-bs-dismiss="modal">Cancel</a>
+                        </div>
+
+                        <div class="col">
+                            <form action="" method="post">
+                                <button type="submit" name="logout_everyone" value="true" class="btn btn-danger w-100">
+                                    Logout everyone
+                                </button>
+                            </form>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+</div>
 {% endblock content %}