build info on bottom left of screen area

src/pages/PageContainer.tsx

@@ -1,4 +1,4 @@
-import { Container, SxProps, Theme } from "@mui/material";
+import { Container, SxProps, Theme, Typography } from "@mui/material";
 import { makeStyles } from "@mui/styles";
 import classNames from "classnames";
 // import { useMobile } from "hooks";
@@ -47,6 +47,23 @@ const useStyles = makeStyles((theme: Theme) => ({
     flexDirection: "column",
     justifyContent: "center",
     alignItems: "center"
+  },
+  buildInfo: {
+    position: "fixed" as const,
+    bottom: 56,
+    left: 8,
+    fontSize: 10,
+    lineHeight: 1.3,
+    opacity: 0.35,
+    color: theme.palette.text.secondary,
+    pointerEvents: "none" as const,
+    zIndex: 1,
+    [theme.breakpoints.up("sm")]: {
+      bottom: 8,
+    },
+    [theme.breakpoints.up("md")]: {
+      left: `calc(${theme.spacing(9)} + 8px)`,
+    }
   }
 }))
 
@@ -78,8 +95,13 @@ export const PageContainer: React.FunctionComponent<Props> = (props: Props) => {
       }}
       disableGutters
       maxWidth={false}
-      children={<>{children}</>}
+    >
-    />
+      {children}
+      <Typography component="div" className={classes.buildInfo}>
+        {new Date(__BUILD_DATE__).toLocaleDateString()}<br />
+        {__GIT_HASH__}
+      </Typography>
+    </Container>
   );
 };
 

src/vite-env.d.ts

@@ -1 +1,4 @@
 /// <reference types="vite/client" />
+
+declare const __BUILD_DATE__: string
+declare const __GIT_HASH__: string

vite.config.ts

@@ -5,6 +5,7 @@ import { VitePWA } from 'vite-plugin-pwa';
 import * as path from 'path' // ✅ Import path module
 import { readFileSync, renameSync, existsSync, unlinkSync } from 'node:fs'
 import { fileURLToPath } from 'node:url'
+import { execSync } from 'node:child_process'
 
 const rootDir = path.dirname(fileURLToPath(import.meta.url))
 
@@ -49,7 +50,19 @@ function emitLocalnetShellAsIndexHtml (mode: string): Plugin {
 // https://vitejs.dev/config/
 export default defineConfig(({ command, mode }): UserConfig => {
   const useLocalnetShell = mode === LOCALNET_MODE
+
+  let gitHash = 'unknown'
+  try {
+    gitHash = execSync('git rev-parse --short HEAD').toString().trim()
+  } catch {}
+
+  const buildDate = new Date().toISOString()
+
   return {
+  define: {
+    __BUILD_DATE__: JSON.stringify(buildDate),
+    __GIT_HASH__: JSON.stringify(gitHash),
+  },
   plugins: [
     useLocalnetShellHtml(mode, command),
     emitLocalnetShellAsIndexHtml(mode),