Add version build time to sidebar.

Co-authored-by: Jayant Bhawal <bhawal.jayant@gmail.com>

Author: samad-yar-khan

web-server/pages/api/internal/version.ts

@@ -23,6 +23,7 @@ type CheckNewVersionResponse = {
   current_github_commit: string;
   is_update_available: boolean;
   latest_docker_image_build_date: Date;
+  current_docker_image_build_date: Date;
 };
 
 type DockerHubAPIResponse = {
@@ -142,7 +143,8 @@ async function checkNewImageRelease(): Promise<CheckNewVersionResponse> {
       dockerLatestRemoteTag: latestTag,
       localVersionInfo: versionInfo
     }),
-    latest_docker_image_build_date: latestRemoteDate
+    latest_docker_image_build_date: latestRemoteDate,
+    current_docker_image_build_date: new Date(versionInfo.current_build_date)
   };
 }
 

web-server/src/layouts/ExtendedSidebarLayout/Sidebar/index.tsx

@@ -7,10 +7,14 @@ import {
   useTheme,
   lighten
 } from '@mui/material';
+import { format } from 'date-fns';
 import { useContext, useMemo } from 'react';
 
+import { FlexBox } from '@/components/FlexBox';
 import Scrollbar from '@/components/Scrollbar';
+import { Line } from '@/components/Text';
 import { SidebarContext } from '@/contexts/SidebarContext';
+import { useSelector } from '@/store';
 
 import SidebarMenu from './SidebarMenu';
 import SidebarTopSection from './SidebarTopSection';
@@ -61,6 +65,13 @@ function Sidebar() {
 const SidebarContent = () => {
   const theme = useTheme();
 
+  const imageStatus = useSelector((s) => s.app.latestImageStatus);
+
+  const formattedDate = format(
+    new Date(imageStatus.current_docker_image_build_date),
+    'dd MMM yyyy HH:mm:ss'
+  );
+
   return (
     <>
       <Scrollbar>
@@ -75,6 +86,11 @@ const SidebarContent = () => {
         <SidebarMenu />
       </Scrollbar>
       <Divider sx={{ background: theme.colors.alpha.trueWhite[10] }} />
+      <FlexBox justifyCenter alignCenter height="60px">
+        <Line small medium secondary>
+          Build: {formattedDate}
+        </Line>
+      </FlexBox>
     </>
   );
 };

web-server/src/types/resources.ts

@@ -1020,6 +1020,7 @@ export type IntegrationsLinkedAtMap = Record<keyof IntegrationsMap, DateString>;
 export type ImageStatusApiResponse = {
   latest_docker_image: string;
   is_update_available: boolean;
+  current_docker_image_build_date: DateString;
 };
 
 export type DB_OrgRepo = {