Merge pull request #4 from axelmarciano/feat/dashboard

feat: add dashboard & prometheus metrics

Author: axelmarciano

Dockerfile

@@ -1,33 +1,24 @@
-# Start with the official Golang base image
-FROM golang:1.23-alpine AS builder
+FROM node:18-alpine AS dashboard-builder
+WORKDIR /app/dashboard
+COPY dashboard/package.json dashboard/package-lock.json ./
+RUN npm ci
+COPY dashboard ./
+RUN npm run build
 
-# Set the Current Working Directory inside the container
+FROM golang:1.23-alpine AS builder
 WORKDIR /app
-
-# Copy go mod and sum files
 COPY go.mod go.sum ./
-
-# Download all dependencies. Dependencies will be cached if the go.mod and go.sum files are not changed
 RUN go mod download
-
-# Copy the source from the current directory to the Working Directory inside the container
 COPY cmd ./cmd
 COPY internal ./internal
 COPY keys ./keys
 COPY config ./config
 COPY updates ./updates
-
-# Build the Go app
-RUN ls
 RUN GOOS=linux GOARCH=amd64 go build -o main ./cmd/api
 
-# Start a new stage from scratch
 FROM alpine:latest
-
-# Copy the Pre-built binary file from the previous stage
+RUN apk add --no-cache bash
 COPY --from=builder /app/main /app/main
-
+COPY --from=dashboard-builder /app/dashboard/dist /app/dashboard/dist
 EXPOSE 3000
-
-# Command to run the executable
 CMD ["/app/main"]

Dockerfile-ci

@@ -1,3 +1,13 @@
+FROM node:18-alpine AS dashboard-builder
+
+WORKDIR /app/dashboard
+
+COPY dashboard/package.json dashboard/package-lock.json ./
+RUN npm ci
+
+COPY dashboard ./
+RUN npm run build
+
 FROM golang:1.23-alpine
 
 RUN apk add --no-cache git bash curl unzip entr make tar
@@ -6,4 +16,6 @@ RUN go install github.com/cespare/reflex@latest
 
 ENV PATH="/go/bin:${PATH}"
 
+COPY --from=dashboard-builder /app/dashboard/dist /app/dashboard/dist
+
 CMD ["bash"]

Dockerfile-dev

@@ -26,7 +26,6 @@ COPY keys ./keys
 COPY config ./config
 COPY updates ./updates
 COPY test ./test
-COPY commands ./commands
 RUN if [ -f .env ]; then cp .env /app/.env; fi
 
 

Makefile

@@ -25,7 +25,7 @@ endif
 
 test_app:
 ifeq ($(DOCKER_FLAG),docker)
-	docker-compose exec ota-server sh -c "$(MAKE_COVERAGE_CMD)"
+	docker-compose --profile test run --rm -e "" ota-server-test go test -v -coverprofile=coverage.out ./...
 else
 	$(MAKE_COVERAGE_CMD)
 endif
@@ -42,9 +42,9 @@ endef
 
 define CLEAN_COVERAGE
 	if [ "$(shell uname -s)" = "Darwin" ]; then \
-		sed -i '' -e '/test/d' -e '/commands/d' -e '/cmd/d' -e '/lambda/d' coverage.out; \
+		sed -i '' -e '/test/d' -e '/cmd/d' coverage.out; \
 	else \
-		sed -i '/test/d;/commands/d;/cmd/d;/lambda/d' coverage.out; \
+		sed -i '/test/d;/cmd/d;' coverage.out; \
 	fi
 endef
 

cmd/api/main.go

@@ -2,19 +2,28 @@ package main
 
 import (
 	"expo-open-ota/config"
+	"expo-open-ota/internal/metrics"
 	"expo-open-ota/internal/router"
+	"github.com/gorilla/handlers"
 	"log"
 	"net/http"
 )
 
 func init() {
 	config.LoadConfig()
+	metrics.InitMetrics()
 }
 
 func main() {
 	router := infrastructure.NewRouter()
 	log.Println("Server is running on port 3000")
-	err := http.ListenAndServe(":3000", router)
+	corsOptions := handlers.CORS(
+		handlers.AllowedHeaders([]string{"Authorization", "Content-Type"}),
+		handlers.AllowedMethods([]string{"GET", "POST", "PUT", "DELETE", "OPTIONS"}),
+		handlers.AllowedOrigins([]string{"*"}),
+		handlers.AllowCredentials(),
+	)
+	err := http.ListenAndServe(":3000", corsOptions(router))
 	if err != nil {
 		log.Fatalf("Server failed to start: %v", err)
 	}

dashboard/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

dashboard/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 100,
+  "tabWidth": 2,
+  "singleQuote": true,
+  "bracketSameLine": true,
+  "trailingComma": "es5",
+  "arrowParens": "avoid",
+  "endOfLine": "auto"
+}

dashboard/README.md

@@ -0,0 +1,50 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+
+- Configure the top-level `parserOptions` property like this:
+
+```js
+export default tseslint.config({
+  languageOptions: {
+    // other options...
+    parserOptions: {
+      project: ['./tsconfig.node.json', './tsconfig.app.json'],
+      tsconfigRootDir: import.meta.dirname,
+    },
+  },
+})
+```
+
+- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
+- Optionally add `...tseslint.configs.stylisticTypeChecked`
+- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
+
+```js
+// eslint.config.js
+import react from 'eslint-plugin-react'
+
+export default tseslint.config({
+  // Set the react version
+  settings: { react: { version: '18.3' } },
+  plugins: {
+    // Add the react plugin
+    react,
+  },
+  rules: {
+    // other rules...
+    // Enable its recommended rules
+    ...react.configs.recommended.rules,
+    ...react.configs['jsx-runtime'].rules,
+  },
+})
+```

dashboard/components.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/index.css",
+    "baseColor": "zinc",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "iconLibrary": "lucide"
+}

dashboard/eslint.config.js

@@ -0,0 +1,28 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+
+export default tseslint.config(
+  { ignores: ['dist'] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      'react-hooks': reactHooks,
+      'react-refresh': reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      'react-refresh/only-export-components': [
+        'warn',
+        { allowConstantExport: true },
+      ],
+    },
+  },
+)