feat: add counts to tabs

src/app/handlers/index.rs

@@ -12,7 +12,7 @@ use crate::{
     },
     env::Env,
     model::{
-        team::TeamTab,
+        team::{HomeTab, TeamTab},
         upload::{UploadList, UploadStats},
     },
 };
@@ -25,8 +25,13 @@ pub async fn get_index(
     SessionUser(user): SessionUser,
     Query(query): Query<ListQuery>,
 ) -> poem::Result<Html<String>> {
-    // Get the tab data for the teams the user belongs to. This is used by the nested 'teams.html'
-    // template, which will render the tabs for the teams.
+    let home = HomeTab::get_for_user(&env.pool, user.id)
+        .await
+        .map_err(|err| {
+            tracing::error!(%user.id, ?err, "Unable to get home tab for user");
+            poem::error::InternalServerError(err)
+        })?;
+
     let tabs = TeamTab::get_for_user(&env.pool, user.id)
         .await
         .map_err(|err| {
@@ -54,6 +59,7 @@ pub async fn get_index(
         "index.html",
         minijinja::context! {
             query,
+            home,
             tabs,
             stats,
             uploads,
@@ -71,6 +77,13 @@ pub async fn get_tab(
     SessionUser(user): SessionUser,
     Query(query): Query<ListQuery>,
 ) -> poem::Result<Response> {
+    let home = HomeTab::get_for_user(&env.pool, user.id)
+        .await
+        .map_err(|err| {
+            tracing::error!(%user.id, ?err, "Unable to get home tab for user");
+            poem::error::InternalServerError(err)
+        })?;
+
     let tabs = TeamTab::get_for_user(&env.pool, user.id)
         .await
         .map_err(|err| {
@@ -96,6 +109,7 @@ pub async fn get_tab(
         "tab.html",
         minijinja::context! {
             query,
+            home,
             tabs,
             stats,
             uploads,

src/app/handlers/teams.rs

@@ -14,7 +14,7 @@ use crate::{
     },
     env::Env,
     model::{
-        team::{Team, TeamMember, TeamTab},
+        team::{HomeTab, Team, TeamMember, TeamTab},
         upload::{UploadList, UploadStats},
     },
 };
@@ -50,6 +50,13 @@ pub async fn get_team(
         return Err(poem::Error::from_status(StatusCode::FORBIDDEN));
     };
 
+    let home = HomeTab::get_for_user(&env.pool, user.id)
+        .await
+        .map_err(|err| {
+            tracing::error!(%user.id, ?err, "Unable to get home tab for user");
+            InternalServerError(err)
+        })?;
+
     let tabs = TeamTab::get_for_user(&env.pool, user.id)
         .await
         .map_err(|err| {
@@ -73,6 +80,7 @@ pub async fn get_team(
         minijinja::context! {
             query,
             tabs,
+            home,
             team,
             membership,
             stats,
@@ -112,6 +120,13 @@ pub async fn get_tab(
         return Err(poem::Error::from_status(StatusCode::FORBIDDEN));
     };
 
+    let home = HomeTab::get_for_user(&env.pool, user.id)
+        .await
+        .map_err(|err| {
+            tracing::error!(%user.id, ?err, "Unable to get home tab for user");
+            InternalServerError(err)
+        })?;
+
     let tabs = TeamTab::get_for_user(&env.pool, user.id)
         .await
         .map_err(|err| {
@@ -135,6 +150,7 @@ pub async fn get_tab(
         minijinja::context! {
             query,
             tabs,
+            home,
             team,
             membership,
             stats,

src/model/team.rs

@@ -189,6 +189,24 @@ impl TeamTab {
     }
 }
 
+#[derive(Debug, FromRow, Serialize)]
+pub struct HomeTab {
+    pub count: i64,
+}
+
+impl HomeTab {
+    pub async fn get_for_user(pool: &SqlitePool, user: Key<User>) -> sqlx::Result<Self> {
+        sqlx::query_as(
+            "SELECT COUNT(uploads.id) AS count \
+            FROM uploads \
+            WHERE uploads.owner_user = $1",
+        )
+        .bind(user)
+        .fetch_one(pool)
+        .await
+    }
+}
+
 #[derive(Debug, FromRow, Serialize)]
 pub struct TeamList {
     pub id: Key<Team>,

src/model/user.rs

@@ -280,13 +280,13 @@ impl User {
 
 #[derive(Debug, FromRow, Serialize)]
 pub struct UserStats {
-    pub total: i32,
+    pub count: i32,
     pub enabled: i32,
 }
 
 impl UserStats {
     pub async fn get(pool: &SqlitePool) -> sqlx::Result<UserStats> {
-        sqlx::query_as("SELECT COUNT(*) AS total, SUM(enabled) AS enabled FROM users")
+        sqlx::query_as("SELECT COUNT(*) AS count, SUM(enabled) AS enabled FROM users")
             .fetch_one(pool)
             .await
     }

style/components/label.css

@@ -0,0 +1,7 @@
+@layer components {
+  .label {
+    @apply rounded-full bg-blue-300 text-blue-900 dark:bg-blue-600 dark:text-blue-100;
+    @apply text-sm leading-none px-2 pt-[0.2rem] pb-[0.3rem];
+  }
+}
+

style/components/tabs.css

@@ -3,14 +3,16 @@
     @apply flex flex-row;
 
     .tab {
-      @apply flex flex-row gap-1 rounded-t-lg bg-transparent cursor-pointer px-4 py-2;
+      @apply flex flex-row items-center gap-1 rounded-t-md bg-transparent cursor-pointer px-4 py-2;
       @apply hover:bg-neutral-200 dark:hover:bg-gray-800/25;
+      @apply border border-b-0 border-transparent;
+
+      margin-bottom: -1px;
 
       &.active {
-        @apply border border-b-0 border-slate-400 dark:border-gray-700;
+        @apply border-slate-400 dark:border-gray-700;
         @apply bg-neutral-100 dark:bg-gray-800;
 
-        margin-bottom: -1px;
         z-index: 1;
       }
     }

style/main.css

@@ -4,6 +4,7 @@
 @import "components/drop.css";
 @import "components/dropdown.css";
 @import "components/form.css";
+@import "components/label.css";
 @import "components/modal.css";
 @import "components/panel.css";
 @import "components/select.css";

templates/uploads/deleted.html

@@ -1,5 +1,5 @@
 {% include "uploads/stats.html" %}
-{% if stats.total == 0 %}
+{% if stats.count == 0 %}
   <div id="uploads-table" hx-swap-oob="true" class="text italic text-center p-8">
     You have not uploaded any files yet.
   </div>

templates/uploads/list.html

@@ -40,7 +40,7 @@
         </button>
       </div>
     </div>
-    {% if stats.total == 0 %}
+    {% if stats.count == 0 %}
       <div id="uploads-table" class="text italic text-center p-8">
         You have not uploaded any files yet.
       </div>

templates/uploads/tabs.html

@@ -1,15 +1,17 @@
 <div id="team-tab-list" class="tabs" hx-swap-oob="true">
   <a hx-get="/tab" hx-swap="none" class="tab{% if not team %} active{% endif %}">
     <span class="icon-house"></span>
-    Your Uploads
+    <span>Your Uploads</span>
+    <span class="label">{{ home.count }}</span>
   </a>
   {% for tab in tabs %}
     <a
       class="tab{% if team and tab.id == team.id %} active{% endif %}"
       hx-get="/teams/{{ tab.slug }}/tab"
       hx-swap="none">
       <span class="hidden md:inline-block icon-users"></span>
-      {{ tab.name }}
+      <span>{{ tab.name }}</span>
+      <span class="label">{{ tab.count }}</span>
     </a>
   {% endfor %}
 </div>