From 2a70d28665c2abda7d7d4fafc3d231a0ad2e2bec Mon Sep 17 00:00:00 2001
From: frectonz <fraol0912@gmail.com>
Date: Tue, 25 Jun 2024 03:26:11 +0300
Subject: [PATCH] feat: show version number on header

---
 src/main.rs              | 18 ++++++++++++++++--
 ui/src/api.ts            |  5 +++++
 ui/src/routes/__root.tsx | 11 +++++++++++
 3 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/main.rs b/src/main.rs
index f8dd869..695b15d 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -2154,13 +2154,18 @@ mod responses {
         pub columns: Vec<String>,
         pub rows: Vec<Vec<serde_json::Value>>,
     }
+
+    #[derive(Serialize)]
+    pub struct Version {
+        pub version: String,
+    }
 }
 
 mod handlers {
     use serde::Deserialize;
     use warp::Filter;
 
-    use crate::{rejections, Database};
+    use crate::{rejections, responses::Version, Database};
 
     fn with_state<T: Clone + Send>(
         state: &T,
@@ -2194,8 +2199,9 @@ mod handlers {
             .and(warp::path!("query"))
             .and(warp::body::json::<QueryBody>())
             .and_then(query);
+        let version = warp::get().and(warp::path!("version")).and_then(version);
 
-        overview.or(tables).or(table).or(query).or(data)
+        overview.or(tables).or(table).or(query).or(data).or(version)
     }
 
     #[derive(Deserialize)]
@@ -2257,6 +2263,14 @@ mod handlers {
             .map_err(|_| warp::reject::custom(rejections::InternalServerError))?;
         Ok(warp::reply::json(&tables))
     }
+
+    async fn version() -> Result<impl warp::Reply, warp::Rejection> {
+        let version = Version {
+            version: env!("CARGO_PKG_VERSION").to_owned(),
+        };
+
+        Ok(warp::reply::json(&version))
+    }
 }
 
 mod rejections {
diff --git a/ui/src/api.ts b/ui/src/api.ts
index 23f8ab2..2e6defe 100644
--- a/ui/src/api.ts
+++ b/ui/src/api.ts
@@ -57,6 +57,10 @@ const query = z.object({
   rows: z.any().array().array(),
 });
 
+const version = z.object({
+  version: z.string(),
+});
+
 const $fetch = createZodFetcher();
 
 export const fetchOverview = () => $fetch(overview, `${BASE_URL}/`);
@@ -74,3 +78,4 @@ export const fetchQuery = (value: string) =>
     },
     body: JSON.stringify({ query: value }),
   });
+export const fetchVersion = () => $fetch(version, `${BASE_URL}/version`);
diff --git a/ui/src/routes/__root.tsx b/ui/src/routes/__root.tsx
index a53fd9a..27f3459 100644
--- a/ui/src/routes/__root.tsx
+++ b/ui/src/routes/__root.tsx
@@ -12,6 +12,8 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { cn } from "@/lib/utils";
 import { setTheme, useTheme } from "@/provider/theme.provider";
+import { useQuery } from "@tanstack/react-query";
+import { fetchVersion } from "@/api";
 
 const TanStackRouterDevtools = import.meta.env.PROD
   ? () => null // Render nothing in production
@@ -30,6 +32,12 @@ export const Route = createRootRoute({
 export function Root() {
   const theme = useTheme();
   const changeTheme = setTheme();
+
+  const { data } = useQuery({
+    queryKey: ["version"],
+    queryFn: () => fetchVersion(),
+  });
+
   return (
     <>
       <div
@@ -71,6 +79,9 @@ export function Root() {
           </Link>
 
           <div className="flex gap-4 items-center">
+            <p className="text-primary hidden sm:block text-xs text-right">
+              [{data?.version ?? ""}]
+            </p>
             <button
               className="text-foreground "
               onClick={() => {