feat: add health API to retrieve application version and display in sidebar

Signed-off-by: Noste <83548733+Noooste@users.noreply.github.com>

frontend/src/components/layout/sidebar.tsx

@@ -3,6 +3,8 @@ import {cn} from '@/lib/utils';
 import {Database, Key, LayoutDashboard, LogOut, Server, User} from 'lucide-react';
 import {useAuthStore} from '@/store/auth-store';
 import {Button} from '@/components/ui/button';
+import { useQuery } from '@tanstack/react-query';
+import { healthApi, garageApi } from '@/lib/api';
 
 interface NavItem {
   title: string;
@@ -46,6 +48,24 @@ export function Sidebar({ isOpen, onClose }: SidebarProps) {
     logout();
   };
 
+  const { data: uiVersion } = useQuery({
+    queryKey: ['ui-version'],
+    queryFn: healthApi.getVersion,
+    staleTime: 5 * 60 * 1000,
+    retry: false,
+  });
+
+  const { data: nodeInfo } = useQuery({
+    queryKey: ['garage-version'],
+    queryFn: () => garageApi.getNodeInfo('self'),
+    staleTime: 5 * 60 * 1000,
+    retry: false,
+  });
+
+  const garageVersion = nodeInfo
+    ? Object.values(nodeInfo.success)[0]?.garageVersion
+    : undefined;
+
   return (
     <div
       className={cn(
@@ -107,6 +127,13 @@ export function Sidebar({ isOpen, onClose }: SidebarProps) {
           </Button>
         </div>
       )}
+      {(uiVersion || garageVersion) && (
+        <div className="px-4 pb-3 text-xs text-muted-foreground text-center">
+          {uiVersion && `UI ${uiVersion}`}
+          {uiVersion && garageVersion && ' | '}
+          {garageVersion && `Garage ${garageVersion}`}
+        </div>
+      )}
     </div>
   );
 }