Add bootstrap-table

backend/src/wishlist.rs

@@ -1,12 +1,19 @@
 use askama_axum::{IntoResponse, Response, Template};
-use axum::{extract::{Path, State}, response::Redirect, Extension, Form};
+use axum::{
+    extract::{Path, State},
+    response::Redirect,
+    Extension, Form,
+};
 use axum_extra::response::Html;
 use chrono::Utc;
 use http::StatusCode;
 use serde::Deserialize;
-use sqlx::{SqlitePool, Row};
+use sqlx::{Row, SqlitePool};
 
-use crate::{middlewares::is_authorized, user::{get_user_roles_display, get_user_wishlist_items, UserData, UserWishlistItem}};
+use crate::{
+    middlewares::is_authorized,
+    user::{get_user_roles_display, get_user_wishlist_items, UserData, UserWishlistItem},
+};
 
 struct HtmlTemplate<T>(T);
 
@@ -48,17 +55,17 @@ pub async fn wishlists(
         .await
         .unwrap();
 
-        let userid = user_data.as_ref().map(|s| s.id.clone()).unwrap_or_default();
+    let userid = user_data.as_ref().map(|s| s.id.clone()).unwrap_or_default();
 
-        if is_authorized("/userwishlists", user_data, db_pool.clone()).await {
+    if is_authorized("/userwishlists", user_data, db_pool.clone()).await {
-            // Get user roles
+        // Get user roles
-            let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
+        let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
 
-            let template = WishListsTemplate {
+        let template = WishListsTemplate {
-                logged_in,
+            logged_in,
-                name,
+            name,
-                users,
+            users,
-                user_roles,
+            user_roles,
         };
         HtmlTemplate(template).into_response()
     } else {
@@ -97,11 +104,11 @@ pub async fn user_wishlist(
         .await
         .unwrap();
 
-        if is_authorized("/wishlist", user_data, db_pool.clone()).await {
+    if is_authorized("/wishlist", user_data, db_pool.clone()).await {
-            // Get user roles
+        // Get user roles
-            let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
+        let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
 
-            // Get user wishlist
+        // Get user wishlist
         let user_wishlist_items = get_user_wishlist_items(user_id, &db_pool.clone()).await;
 
         // Is viewed and viewing user the same (my wishlist)?
@@ -151,10 +158,10 @@ pub async fn user_wishlist_add(
     let userid = user_data.as_ref().map(|s| s.id.clone()).unwrap_or_default();
 
     if is_authorized("/wishlist", user_data, db_pool.clone()).await {
-            // Get user roles
+        // Get user roles
-            let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
+        let user_roles = get_user_roles_display(userid, &db_pool.clone()).await;
 
-            // Get user wishlist items
+        // Get user wishlist items
         let user_wishlist_items = get_user_wishlist_items(user_id, &db_pool.clone()).await;
 
         // Create the wishlist template.
@@ -181,7 +188,7 @@ pub async fn user_wishlist_add_item(
     Path(user_id): Path<i64>,
     State(db_pool): State<SqlitePool>,
     Extension(user_data): Extension<Option<UserData>>,
-    Form(item_form): Form<ItemForm>
+    Form(item_form): Form<ItemForm>,
 ) -> impl IntoResponse {
     if is_authorized("/wishlist", user_data.clone(), db_pool.clone()).await {
         // Insert new item to database
@@ -209,12 +216,12 @@ pub async fn user_wishlist_add_item(
 pub async fn user_wishlist_bought_item(
     Path(user_id): Path<i64>,
     State(db_pool): State<SqlitePool>,
-    Extension(user_data): Extension<Option<UserData>>
+    Extension(user_data): Extension<Option<UserData>>,
 ) -> impl IntoResponse {
     if is_authorized("/wishlist", user_data.clone(), db_pool.clone()).await {
         // Update item to purchased
         sqlx::query("update wishlist_items set purchased_by = ? where id = ?")
-            .bind(user_data.as_ref().unwrap().id)// Created by current user
+            .bind(user_data.as_ref().unwrap().id) // Created by current user
             .bind(user_id)
             .execute(&db_pool)
             .await
@@ -222,7 +229,7 @@ pub async fn user_wishlist_bought_item(
 
         // Redirect to user wishlist
         // Extract the user data.
-        let row = sqlx::query( "SELECT user_id FROM wishlist_items WHERE id = ?")
+        let row = sqlx::query("SELECT user_id FROM wishlist_items WHERE id = ?")
             .bind(user_id)
             .fetch_one(&db_pool)
             .await
@@ -239,14 +246,14 @@ pub async fn user_wishlist_bought_item(
 pub async fn user_wishlist_received_item(
     Path(user_id): Path<i64>,
     State(db_pool): State<SqlitePool>,
-    Extension(user_data): Extension<Option<UserData>>
+    Extension(user_data): Extension<Option<UserData>>,
 ) -> impl IntoResponse {
     if is_authorized("/wishlist", user_data.clone(), db_pool.clone()).await {
         // Update item received time
         let now = Utc::now().timestamp();
 
         sqlx::query("update wishlist_items set received_at = ? where id = ?")
-            .bind(now)// Received now
+            .bind(now) // Received now
             .bind(user_id)
             .execute(&db_pool)
             .await

backend/templates/authorized.html

@@ -9,6 +9,7 @@
                 <li><a href="/dashboard">Web links</a></li>
                 <li><a href="/cottagecalendar">Cottage Calendar</a></li>
                 <li><a href="/wishlists">Wish lists</a></li>
+                <li><a href="/giftexchanges">Gift Exchanges</a></li>
             </ul>
             {% for user_role in user_roles %}
                 {% if user_role.role_name == "admin" %}

backend/templates/base.html

@@ -8,10 +8,14 @@
   <link rel="icon" type="image/x-icon" href="/assets/favicon.png">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="description" content="">
-  <meta name="author" content="">
+  <meta name="author" content="Chris Jean-Marie">
 
   <!-- Bootstrap CSS -->
-  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.css">
+</head>
 
 <body>
   <div class="container-fluid">
@@ -51,7 +55,11 @@
   </div>
 
   <!-- Bootstrap JS Bundle with Popper -->
-  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
+    crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.23.5/dist/bootstrap-table.min.js"></script>
 </body>
 
 </html>

backend/templates/useradmin.html

@@ -2,11 +2,11 @@
 {% block title %}User Administration{% endblock %}
 {% block center %}
 <h1>Users</h1>
-<table class="table table-striped table-bordered">
+<table data-toggle="table" class="table table-striped table-bordered">
     <thead>
         <tr>
-            <th scope="col">Name</th>
+            <th data-sortable="true" data-field="name" scope="col">Name</th>
-            <th scope="col">email</th>
+            <th data-sortable="true" data-field="email" scope="col">email</th>
         </tr>
     </thead>
     <tbody>

backend/templates/userwishlist.html

@@ -12,11 +12,11 @@
 <a href="/userwishlist/add/{{ user.id }}">Add</a>
 {% endif %}
 <div class="table-responsive overflow-auto">
-<table class="table table-striped table-bordered">
+<table data-toggle="table" class="table table-striped table-bordered">
     <thead>
         <tr>
-            <th scope="col">Item</th>
+            <th data-sortable="true" data-field="item" scope="col">Item</th>
-            <th scope="col">State</th>
+            <th data-sortable="true" data-field="state" scope="col">State</th>
             <th scope="col">Action</th>
         </tr>
     </thead>

backend/templates/userwishlists.html

@@ -2,11 +2,11 @@
 {% block title %}Wish Lists{% endblock %}
 {% block center %}
 <h1>Wishlists</h1>
-<table class="table table-striped table-bordered">
+<table data-toggle="table" class="table table-striped table-bordered">
     <thead>
         <tr>
-            <th scope="col">Name</th>
+            <th data-sortable="true" data-field="name" scope="col">Name</th>
-            <th scope="col">email</th>
+            <th data-sortable="true" data-field="email" scope="col">email</th>
         </tr>
     </thead>
     <tbody>