Project setup: Next.js, Clean Architecture, Husky, CI, SonarCloud

.env.example

@@ -0,0 +1,3 @@
+# FRONT END
+NEXT_PUBLIC_API_URL=http://localhost:3001/api/
+NEXT_PUBLIC_FRONT_URL=

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,29 @@
+## PR Type
+
+<!-- feature | fix | refactor | docs | chore | hotfix -->
+
+## Summary
+
+<!-- 1-2 line summary -->
+
+## Description
+
+<!-- Context, what, why, how to test -->
+
+## What's Changed
+
+- [ ]
+- [ ]
+- [ ]
+
+## Screen
+
+<!-- Optional — screenshots if UI change -->
+
+## Will
+
+<!-- Optional — follow-up to another issue, e.g.: Relates to #XX or To be continued in #XX -->
+
+---
+
+<!-- Don't forget: Closes #XX or Fixes #XX -->

.github/workflows/ci.yml

@@ -0,0 +1,72 @@
+name: CI
+
+on:
+  push:
+    branches: [main, develop]
+  pull_request:
+    branches: [main, develop]
+    types: [opened, synchronize, reopened]
+
+jobs:
+  check:
+    name: Lint, format, typecheck, build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@41ff72655975bd51cab0327fa583b6e92b6d3061 # v4
+
+      - name: Setup Node
+        uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
+        with:
+          node-version: '20'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile --ignore-scripts
+
+      - name: Lint
+        run: pnpm exec eslint . --max-warnings 0
+
+      - name: Format check
+        run: pnpm run format:check
+
+      - name: Typecheck
+        run: pnpm run typecheck
+
+      - name: Test
+        run: pnpm test
+
+      - name: Build
+        run: pnpm run build
+
+  sonarcloud:
+    name: SonarCloud
+    runs-on: ubuntu-latest
+    needs: check
+    if: github.ref == 'refs/heads/main' || (github.event_name == 'pull_request' && github.base_ref == 'main')
+    steps:
+      - name: Checkout
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+        with:
+          fetch-depth: 0
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@41ff72655975bd51cab0327fa583b6e92b6d3061 # v4
+
+      - name: Setup Node
+        uses: actions/setup-node@a0853c24544627f65ddf259abe73b1d18a591444 # v5
+        with:
+          node-version: '20'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile --ignore-scripts
+
+      - name: Test with coverage
+        run: pnpm run test:coverage
+
+      - name: SonarCloud scan
+        uses: SonarSource/sonarqube-scan-action@2f77a1ec69fb1d595b06f35ab27e97605bdef703 # v5
+        env:
+          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

.gitignore

@@ -0,0 +1,43 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+.pnpm-store/
+.vscode/
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.husky/pre-commit

@@ -0,0 +1,2 @@
+#!/usr/bin/env sh
+pnpm exec lint-staged

.husky/pre-push

@@ -0,0 +1,11 @@
+#!/usr/bin/env sh
+# Block direct push to main and develop — use a branch and open a PR.
+while read local_ref local_sha remote_ref remote_sha; do
+  case "$remote_ref" in
+    refs/heads/main|refs/heads/develop)
+      echo "Direct push to ${remote_ref#refs/heads/} is not allowed. Use a feature branch and open a PR."
+      exit 1
+      ;;
+  esac
+done
+exit 0

.prettierignore

@@ -0,0 +1,6 @@
+.next
+out
+node_modules
+pnpm-lock.yaml
+.next
+*.min.js

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}

README.md

@@ -1 +1,35 @@
-# robot-front
+# robot-front
+
+Dashboard frontend for piloting a robot (ROS). Next.js, TypeScript, Tailwind. Clean Architecture with an API layer and gateways for REST/WebSocket.
+
+## Run
+
+```bash
+pnpm install
+pnpm dev
+```
+
+Open [http://localhost:3000](http://localhost:3000).
+
+- **Build** : `pnpm build` then `pnpm start`
+- **Lint / format / typecheck** : `pnpm lint`, `pnpm format:check`, `pnpm typecheck`
+
+## Project structure
+
+```
+src/
+├── app/                    # Next.js App Router (pages, layout, not-found)
+├── architecture/
+│   ├── api/                # HTTP client, WebSocket client, shared types
+│   └── gateways/           # Feature gateways (routes, DTOs, calls to robot API)
+├── components/             # UI components (ui/, dashboard/)
+│   ├── ui/                 # Base components (e.g. shadcn)
+│   └── dashboard/          # Dashboard-specific blocks
+└── types/                  # Shared generic types
+```
+
+- **architecture/api** : transport (client, ws.client) and types used by gateways.
+- **architecture/gateways** : one gateway per domain (e.g. auth, robot); each holds its DTOs and uses the API clients.
+- **components** : reusable UI and dashboard pieces (see [src/components/readme.md](src/components/readme.md) for shadcn/Tremor and Figma MCP).
+
+More detail: [docs/architecture.md](docs/architecture.md).

docs/architecture.md

@@ -0,0 +1,93 @@
+# Technical Stack – Frontend
+
+This document defines the technical stack used by the frontend. Initial version, non-exhaustive — to be iterated.
+
+---
+
+## 1. Framework & routing
+
+| Component | Tech        | Justification                                                         |
+| --------- | ----------- | --------------------------------------------------------------------- |
+| Framework | **Next.js** | Native routing, no manual route management (React Router DOM avoided) |
+| Runtime   | React 18+   | Components, hooks, concurrency                                        |
+
+---
+
+## 2. Architecture – Clean Architecture
+
+### Target structure
+
+```
+src/
+├── architecture/
+│   ├── api/           # DTOs (request/response), validation schemas, API typings
+│   └── gateways/      # Bridge client: routes, URL construction, calls to robot API
+├── app/               # Next.js App Router (pages, layouts)
+├── components/
+├── ...
+```
+
+- **`/architecture/api`** : DTOs (request/response), validation schemas, shared types — aligned with backend `robocoop_api`
+- **`/architecture/gateways`** : **bridge (client side)** — centralizes robot API base URL, route construction, REST/WebSocket calls (commands, status, alerts). Abstraction layer between UI and robot.
+
+---
+
+## 3. Package management & versions
+
+| Tool         | Usage                                               |
+| ------------ | --------------------------------------------------- |
+| **pnpm**     | Dependency management, locked versions              |
+| **lockfile** | `pnpm-lock.yaml` — committed, no drift between devs |
+
+**Goal** : define packages and versions upfront for a common base and avoid conflicts.
+
+To document in `package.json` / `pnpm-workspace.yaml` as needed:
+
+- Next.js
+- React
+- TypeScript
+- UI / state / validation libraries
+- Testing, lint, formatting tools
+
+---
+
+## 4. Git hooks & code quality
+
+| Tool            | Usage                            |
+| --------------- | -------------------------------- |
+| **Husky**       | Git hooks (commit, pre-commit)   |
+| **lint-staged** | Lint/format only on staged files |
+
+Example hooks:
+
+- Pre-commit: lint, format, types
+- Commit-msg: message validation (e.g. Conventional Commits)
+
+---
+
+## 5. CI / CD & Pull Requests
+
+### Target structure
+
+```
+.github/
+├── workflows/
+│   ├── ci.yml           # Tests, lint, build
+│   └── pr-checks.yml    # PR checks
+```
+
+### Behaviour
+
+- CI triggered on push and on PR open/update
+- On CI failure → merge blocked
+- Protected branches: PR required + CI green to merge
+
+---
+
+## 6. Next steps
+
+- [ ] Validate the choices above
+- [ ] Pin exact versions (package.json / .npmrc)
+- [ ] Detail `architecture/api` and `architecture/gateways`
+- [ ] Write `.github/workflows/` workflows
+- [ ] Configure Husky + lint-staged