refactor: show version of diving

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "diving"
-version = "0.5.5"
+version = "0.5.6"
 authors = ["Tree Xie <[email protected]>"]
 edition = "2021"
 keywords = ["diving", "image", "dive"]

src/controller.rs

@@ -10,10 +10,11 @@ use http::header;
 use http::Uri;
 use lru::LruCache;
 use once_cell::sync::OnceCell;
-use serde::Deserialize;
+use serde::{Deserialize, Serialize};
 use std::num::NonZeroUsize;
 use std::sync::Mutex;
 
+const VERSION: &str = env!("CARGO_PKG_VERSION");
 type JSONResult<T> = HTTPResult<Json<T>>;
 
 pub fn new_router() -> Router {
@@ -55,14 +56,24 @@ async fn analyze(Query(params): Query<AnalyzeParams>) -> JSONResult<DockerAnalyz
     Ok(Json(result))
 }
 
-async fn get_latest_images() -> JSONResult<Vec<String>> {
+#[derive(Debug, Serialize)]
+#[serde(rename_all = "camelCase")]
+struct LatestImageResp {
+    pub images: Vec<String>,
+    pub version: String,
+}
+
+async fn get_latest_images() -> JSONResult<LatestImageResp> {
     let mut image_list = vec![];
     if let Ok(cache) = get_latest_image_cache().lock() {
         for (name, _) in cache.iter() {
             image_list.push(name.clone());
         }
     }
-    Ok(Json(image_list))
+    Ok(Json(LatestImageResp{
+        images: image_list,
+        version: VERSION.to_string(),
+    }))
 }
 
 #[derive(Debug, Deserialize)]

web/src/App.tsx

@@ -442,6 +442,7 @@ interface ImageDescriptions {
   created: string;
 }
 interface AppState {
+  version: string;
   gotResult: boolean;
   loading: boolean;
   imageDescriptions: ImageDescriptions;
@@ -455,6 +456,12 @@ interface AppState {
   latestAnalyzeImages: string[];
   bigModifiedFileList: ModifiedFile[];
 }
+
+interface LatestImages {
+  images: string[];
+  version: string;
+}
+
 interface App {
   state: AppState;
 }
@@ -483,17 +490,19 @@ class App extends Component {
       arch,
       latestAnalyzeImages: [],
       bigModifiedFileList: [],
+      version: "",
     };
   }
   async componentDidMount() {
     if (this.state.imageName) {
       this.onSearch(this.state.imageName);
     }
-    const { data } = await axios.get<string[]>("/api/latest-images", {
+    const { data } = await axios.get<LatestImages>("/api/latest-images", {
       timeout: 5 * 1000,
     });
     this.setState({
-      latestAnalyzeImages: data,
+      latestAnalyzeImages: data.images,
+      version: data.version,
     });
   }
   async onSearch(value: String) {
@@ -564,6 +573,7 @@ class App extends Component {
       arch,
       latestAnalyzeImages,
       bigModifiedFileList,
+      version,
     } = this.state;
     const onToggleExpand = (key: string) => {
       const opt = Object.assign({}, this.state.fileTreeViewOption);
@@ -951,7 +961,7 @@ class App extends Component {
               >
                 <Space>
                   {getLogoIcon(isDarkMode())}
-                  <span>Diving</span>
+                  <span>Diving {version}</span>
                 </Space>
               </div>
               {gotResult && <div className="search">{getSearchView()}</div>}