add version card to settings, branch push protection

frontend/Dockerfile

@@ -1,16 +1,23 @@
 # Build stage
 FROM node:20-alpine AS builder
 
-WORKDIR /app
+WORKDIR /app/frontend
 
-# Copy package files
-COPY package*.json ./
+# Copy package files first for better caching
+COPY frontend/package*.json ./
 
 # Install dependencies
 RUN npm ci
 
 # Copy source code and config files
-COPY . .
+COPY frontend/ ./
+COPY VERSION ../VERSION
+
+# Build arguments
+ARG VITE_APP_VERSION
+ARG VITE_APP_BUILD_LABEL
+ENV VITE_APP_VERSION=$VITE_APP_VERSION
+ENV VITE_APP_BUILD_LABEL=$VITE_APP_BUILD_LABEL
 
 # Build the application
 RUN npm run build
@@ -19,10 +26,10 @@ RUN npm run build
 FROM nginx:alpine
 
 # Copy custom nginx config
-COPY nginx.conf /etc/nginx/nginx.conf
+COPY frontend/nginx.conf /etc/nginx/nginx.conf
 
 # Copy built application from builder
-COPY --from=builder /app/dist /usr/share/nginx/html
+COPY --from=builder /app/frontend/dist /usr/share/nginx/html
 
 EXPOSE 80
 

frontend/src/components/Sidebar.tsx

@@ -171,6 +171,7 @@ export const Sidebar: React.FC<SidebarProps> = ({
           <h1 className="text-2xl text-slate-900 dark:text-white flex items-center gap-3 tracking-tight" style={{ fontFamily: 'Excalifont' }}>
             <Logo className="w-10 h-10" />
             <span className="mt-1">ExcaliDash</span>
+            <span className="text-xs font-bold text-red-500 mt-2" style={{ fontFamily: 'sans-serif' }}>BETA</span>
           </h1>
         </div>
 

frontend/src/pages/Settings.tsx

@@ -3,7 +3,7 @@ import { Layout } from '../components/Layout';
 import { useNavigate } from 'react-router-dom';
 import * as api from '../api';
 import type { Collection } from '../types';
-import { Database, FileJson, Upload, Moon, Sun } from 'lucide-react';
+import { Database, FileJson, Upload, Moon, Sun, Info } from 'lucide-react';
 import { ConfirmModal } from '../components/ConfirmModal';
 import { importDrawings } from '../utils/importUtils';
 import { useTheme } from '../context/ThemeContext';
@@ -18,6 +18,9 @@ export const Settings: React.FC = () => {
     const [importError, setImportError] = useState<{ isOpen: boolean; message: string }>({ isOpen: false, message: '' });
     const [importSuccess, setImportSuccess] = useState(false);
 
+    const appVersion = import.meta.env.VITE_APP_VERSION || 'Unknown version';
+    const buildLabel = import.meta.env.VITE_APP_BUILD_LABEL;
+
     useEffect(() => {
         const fetchCollections = async () => {
             try {
@@ -203,7 +206,25 @@ export const Settings: React.FC = () => {
                     </button>
                 </div>
 
-
+                {/* Version Info */}
+                <div className="flex flex-col items-center justify-center gap-4 p-8 bg-white dark:bg-neutral-900 border-2 border-black dark:border-neutral-700 rounded-2xl shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] dark:shadow-[4px_4px_0px_0px_rgba(255,255,255,0.2)]">
+                    <div className="w-16 h-16 bg-gray-50 dark:bg-neutral-800 rounded-2xl flex items-center justify-center border-2 border-gray-100 dark:border-neutral-700">
+                        <Info size={32} className="text-gray-600 dark:text-gray-400" />
+                    </div>
+                    <div className="text-center">
+                        <h3 className="text-xl font-bold text-slate-900 dark:text-white mb-1">Version Info</h3>
+                        <div className="text-sm text-slate-500 dark:text-neutral-400 font-medium flex flex-col items-center gap-1">
+                            <span className="font-mono text-base text-slate-900 dark:text-white">
+                                {appVersion}
+                            </span>
+                            {buildLabel && (
+                                <span className="text-xs uppercase tracking-wide text-red-500 dark:text-red-400">
+                                    {buildLabel}
+                                </span>
+                            )}
+                        </div>
+                    </div>
+                </div>
             </div>
 
             {/* Modals */}

frontend/vite.config.ts

@@ -1,5 +1,29 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
+import fs from "fs";
+import path from "path";
+
+const versionFilePath = path.resolve(__dirname, "../VERSION");
+let versionFromFile = "0.0.0";
+
+try {
+  const raw = fs.readFileSync(versionFilePath, "utf8").trim();
+  if (raw) {
+    versionFromFile = raw;
+  }
+} catch (error) {
+  console.warn("Unable to read VERSION file:", error);
+}
+
+if (
+  !process.env.VITE_APP_VERSION ||
+  process.env.VITE_APP_VERSION.trim().length === 0
+) {
+  process.env.VITE_APP_VERSION = versionFromFile;
+  if (!process.env.VITE_APP_BUILD_LABEL) {
+    process.env.VITE_APP_BUILD_LABEL = "local development build";
+  }
+}
 
 // https://vite.dev/config/
 export default defineConfig({