fix building process for hub

.github/workflows/hub_pipeline.yml

@@ -26,6 +26,22 @@ jobs:
           go-version: '1.25'
           cache-dependency-path: ${{ env.WORKING_DIR }}/go.sum
 
+      # --- NEW: Build Vue Frontend ---
+      # Go requires the ui/dist folder to exist for the go:embed directive to compile
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+          cache-dependency-path: ${{ env.WORKING_DIR }}/ui/package-lock.json
+
+      - name: Build Vue Frontend
+        working-directory: ${{ env.WORKING_DIR }}/ui
+        run: |
+          npm ci
+          npm run build
+      # -------------------------------
+
       # TODO: Uncomment this when we write the Fuzz tests!
       # - name: Run Go Tests
       #   working-directory: ${{ env.WORKING_DIR }}

Hub/Dockerfile

@@ -1,20 +1,39 @@
-# STAGE 1: Builder
-FROM golang:1.25 AS builder
+# STAGE 1: Frontend Builder
+FROM node:20-alpine AS frontend-builder
+WORKDIR /app/ui
+
+# Install dependencies
+COPY ui/package*.json ./
+RUN npm ci
+
+# Copy source and build the Vue SPA
+COPY ui/ ./
+RUN npm run build
+
+# STAGE 2: Go Builder
+FROM golang:1.25 AS go-builder
 WORKDIR /build
 
+# Cache Go modules
 COPY go.mod go.sum ./
 RUN go mod download
+
+# Copy the Go source code
 COPY . .
 
+# CRITICAL: Copy the compiled Vue app from Stage 1 into the Go build context
+# so the `//go:embed all:dist` directive can find it.
+COPY --from=frontend-builder /app/ui/dist ./ui/dist
+
+# Build the binary
 RUN CGO_ENABLED=0 GOOS=linux go build -ldflags="-w -s" -o honeywire-hub ./cmd/hub/main.go
 
-# STAGE 2: Distroless
+# STAGE 3: Distroless Production Image
 # The "static" image contains literally nothing except SSL certificates and a non-root user.
 FROM gcr.io/distroless/static-debian12:nonroot
-
 WORKDIR /app
-COPY --from=builder /build/honeywire-hub /app/
 
-# Expose port and run
+COPY --from=go-builder /build/honeywire-hub /app/
+
 EXPOSE 8080
 CMD ["/app/honeywire-hub"]

Hub/ui/src/views/Login.vue

@@ -46,7 +46,7 @@ const doLogin = async () => {
             </button>
         </div>
 
-        <div class="w-full max-w-[400px] space-y-8 z-10">
+        <div class="w-full max-w-100 space-y-8 z-10">
             <div class="flex flex-col items-center">
                 <div class="w-16 h-16 flex items-center justify-center rounded-xl bg-white dark:bg-[#121215] border border-slate-200 dark:border-zinc-800/80 shadow-sm mb-5 p-3">
                     <svg class="w-full h-full text-slate-900 dark:text-white fill-current shrink-0" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">