ShadCN Implementation

2026-04-01 03:57:04 +02:00
parent d68d476482
commit 3546239396
37 changed files with 1073 additions and 320 deletions
--- a/docs/port-plan.md
+++ b/docs/port-plan.md
@@ -21,7 +21,7 @@

 1. Create Django migrations from the new model set.
 2. Migrate the new database.
-3. Run `import_legacy_data` to ingest `cincin_phase1.sqlite` and `dalcorso.sqlite`.
+3. Run `import_legacy_data` to ingest the bundled legacy SQLite files in `data/legacy/`.
 4. Rebuild auth credentials by forcing password resets for imported users.
 5. Move ETL scripts into Django management commands later instead of repo-root scripts.

--- a/docs/session-handoff-2026-04-01-ui-reset.md
+++ b/docs/session-handoff-2026-04-01-ui-reset.md
@@ -0,0 +1,396 @@
+# Session Handoff
+
+Date: April 1, 2026
+
+Workspace root: [`/home/sandy/HUB-master`](/home/sandy/HUB-master)
+
+Port root: [`/home/sandy/HUB-master/django-port`](/home/sandy/HUB-master/django-port)
+
+This document supersedes the earlier handoff for the continuation work done after [`session-handoff-2026-04-01.md`](/home/sandy/HUB-master/django-port/docs/session-handoff-2026-04-01.md).
+
+## 1. What Happened In This Continuation
+
+The continuation work completed six major areas:
+
+1. business access scoping was tightened across the backend API
+2. missing user and invoice update/delete flows were added
+3. a local `.gitignore` was added for the `django-port` subtree
+4. the temporary UI layer was replaced manually with a local `shadcn-svelte` style component system, then restyled again into a strict black-background, white-text, vanilla shadcn look
+5. the `django-port` subtree was made self-contained for data and repo portability
+6. startup and portability docs were tightened so the folder can be pushed as its own repo and started on another machine with only local env files and dependency installs
+
+Important note:
+
+- this UI work does **not** depend on the external `shadcn-svelte` CLI
+- the component layer now exists as local source files inside the repo
+
+## 2. Backend Changes Since The Previous Handoff
+
+Primary backend file still in play:
+
+- [`/home/sandy/HUB-master/django-port/backend/apps/api/views.py`](/home/sandy/HUB-master/django-port/backend/apps/api/views.py)
+
+### 2.1 Business Scoping Hardening
+
+Scoping helpers were added or expanded so non-superusers now default to business-limited data more consistently:
+
+- scoped vendors
+- scoped categories
+- scoped products
+- scoped invoices
+- vendor access checks
+- invoice payload access validation
+
+Effects:
+
+- dashboard overview is no longer global for non-superusers
+- vendors list now defaults to allowed businesses
+- vendor detail is denied outside allowed businesses
+- invoices list defaults to allowed businesses
+- invoice detail is resolved through scoped querysets
+- inventory now derives visibility from scoped products instead of the earlier brittle ad hoc filter
+- business summary inventory count is tied to that business’s vendor/category graph instead of the earlier global count
+
+### 2.2 User And Invoice CRUD Completion
+
+Invoice service logic was consolidated in:
+
+- [`/home/sandy/HUB-master/django-port/backend/apps/operations/services.py`](/home/sandy/HUB-master/django-port/backend/apps/operations/services.py)
+
+The service now has a shared persistence path for create and update:
+
+- `create_invoice_from_payload`
+- `update_invoice_from_payload`
+
+Added backend routes:
+
+- `PUT /api/invoices/<invoice_id>/`
+- `DELETE /api/invoices/<invoice_id>/`
+- `GET /api/settings/users/<user_id>/`
+- `PUT /api/settings/users/<user_id>/`
+- `DELETE /api/settings/users/<user_id>/`
+
+Routing file:
+
+- [`/home/sandy/HUB-master/django-port/backend/apps/api/urls.py`](/home/sandy/HUB-master/django-port/backend/apps/api/urls.py)
+
+### 2.3 Safety Notes
+
+Current user deletion behavior:
+
+- users cannot delete their own account through the new user detail endpoint
+
+Current invoice write validation:
+
+- business access is checked
+- vendor access is checked
+- category access is checked for non-superusers
+- product access is checked for non-superusers
+
+## 3. Frontend/API Surface Added Since The Previous Handoff
+
+API client file:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/api/client.ts`](/home/sandy/HUB-master/django-port/frontend/src/lib/api/client.ts)
+
+Added frontend client methods:
+
+- `updateInvoice`
+- `deleteInvoice`
+- `updateUser`
+- `deleteUser`
+
+Frontend pages updated to use those flows:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/invoices/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/invoices/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/settings/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/settings/+page.svelte)
+
+Behavior:
+
+- invoice page now supports create, edit, and delete
+- settings page now supports create, edit, and delete for users
+
+## 4. Gitignore Added
+
+Added:
+
+- [`/home/sandy/HUB-master/django-port/.gitignore`](/home/sandy/HUB-master/django-port/.gitignore)
+
+It ignores:
+
+- `venv`
+- Python caches
+- Django static/media outputs
+- `frontend/node_modules`
+- Svelte/Vite build artifacts
+- common log and editor files
+
+Important update from the latest continuation:
+
+- the live Django database is **no longer ignored**
+- this was changed intentionally so `backend/db.sqlite3` can be committed if the user wants the shipped data included when pushing `django-port` to another repository
+
+## 4.1 Self-Contained Data Packaging
+
+The project no longer depends on workspace-root legacy SQLite files.
+
+Bundled data now lives inside the port itself:
+
+- [`/home/sandy/HUB-master/django-port/backend/db.sqlite3`](/home/sandy/HUB-master/django-port/backend/db.sqlite3)
+- [`/home/sandy/HUB-master/django-port/data/legacy/cincin_phase1.sqlite`](/home/sandy/HUB-master/django-port/data/legacy/cincin_phase1.sqlite)
+- [`/home/sandy/HUB-master/django-port/data/legacy/dalcorso.sqlite`](/home/sandy/HUB-master/django-port/data/legacy/dalcorso.sqlite)
+
+Defaults in:
+
+- [`/home/sandy/HUB-master/django-port/backend/config/settings.py`](/home/sandy/HUB-master/django-port/backend/config/settings.py)
+
+now point `LEGACY_CINCIN_DB` and `LEGACY_DALCORSO_DB` at `django-port/data/legacy/` instead of the workspace root.
+
+Documentation for this was added/updated in:
+
+- [`/home/sandy/HUB-master/django-port/README.md`](/home/sandy/HUB-master/django-port/README.md)
+- [`/home/sandy/HUB-master/django-port/backend/README.md`](/home/sandy/HUB-master/django-port/backend/README.md)
+- [`/home/sandy/HUB-master/django-port/docs/port-plan.md`](/home/sandy/HUB-master/django-port/docs/port-plan.md)
+- [`/home/sandy/HUB-master/django-port/data/legacy/README.md`](/home/sandy/HUB-master/django-port/data/legacy/README.md)
+
+Additional portability setup in the latest pass:
+
+- [`/home/sandy/HUB-master/django-port/backend/.env.example`](/home/sandy/HUB-master/django-port/backend/.env.example)
+- [`/home/sandy/HUB-master/django-port/frontend/.env.example`](/home/sandy/HUB-master/django-port/frontend/.env.example)
+
+The root README now includes:
+
+- fresh-machine backend setup
+- fresh-machine frontend setup
+- repo contents that should be pushed
+- explicit note that files outside `django-port` are no longer required
+
+## 5. Current UI Architecture
+
+This changed substantially.
+
+The old situation was:
+
+- temporary `button.svelte`
+- temporary `card.svelte`
+- warm custom palette
+- mixed per-page raw inputs/selects/textareas
+
+The current situation is:
+
+- a local manual `shadcn-svelte` style component layer lives under [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui)
+- global styling now uses a dark vanilla shadcn-like token set
+- screens have been migrated onto those primitives
+
+### 5.1 Core UI Files
+
+Utility helper:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/utils.ts`](/home/sandy/HUB-master/django-port/frontend/src/lib/utils.ts)
+
+Core primitives:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/button.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/button.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-header.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-header.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-title.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-title.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-description.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-description.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-content.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-content.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-footer.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/card-footer.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/input.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/input.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/label.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/label.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/select.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/select.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/textarea.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/ui/textarea.svelte)
+
+Global theme:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/app.css`](/home/sandy/HUB-master/django-port/frontend/src/app.css)
+
+### 5.2 Visual Direction Now In Effect
+
+The latest user correction explicitly required:
+
+- white text
+- black backgrounds
+- purely vanilla shadcn look
+- no leftover warm/custom brand styling
+
+Current global direction:
+
+- background is near-black
+- foreground is near-white
+- cards are dark
+- primary action is light-on-dark inversion
+- muted surfaces are dark zinc-like blocks
+- typography uses a plain system sans stack rather than the earlier decorative direction
+
+### 5.3 Shell Layout
+
+Shell files:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/lib/components/app-shell/sidebar.svelte`](/home/sandy/HUB-master/django-port/frontend/src/lib/components/app-shell/sidebar.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/+layout.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/+layout.svelte)
+
+Current shell behavior:
+
+- dark app frame
+- left navigation in a sticky card
+- active route highlighted
+- main content area wrapped in a dark bordered panel
+
+## 6. Pages Converted To The Manual Shadcn Layer
+
+The following pages are now on the new local component layer and dark token system:
+
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/login/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/login/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/dashboard/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/dashboard/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/invoices/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/invoices/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/vendors/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/vendors/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/inventory/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/inventory/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/events/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/events/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/schedule/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/schedule/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/settings/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/settings/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/devices/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/devices/+page.svelte)
+- [`/home/sandy/HUB-master/django-port/frontend/src/routes/app/business/[id]/+page.svelte`](/home/sandy/HUB-master/django-port/frontend/src/routes/app/business/[id]/+page.svelte)
+
+## 7. Current Quality/Verification State
+
+Backend verification used:
+
+```bash
+python3 -m compileall django-port/backend
+```
+
+This passed after the backend continuation work.
+
+Frontend verification used:
+
+```bash
+npm run check
+```
+
+This now passes with:
+
+- `0 errors`
+- `0 warnings`
+
+That is an improvement over the prior state where the frontend still had a set of accessibility warnings and one intermediate TypeScript regression during the CRUD/UI migration.
+
+## 8. What Is Better Now
+
+Compared with the prior handoff, the project is in a materially better state:
+
+- backend scoping is more defensible
+- missing user/invoice CRUD is no longer missing
+- repo noise in `django-port` is reduced via `.gitignore`
+- the data needed to rerun the importer now lives under `django-port`
+- the live Django database can now be committed with the subtree for portability
+- UI is no longer based on temporary one-off primitives
+- the frontend no longer mixes multiple visual directions
+- the current visual direction now matches the user’s final explicit correction: black backgrounds, white text, vanilla shadcn feel
+
+## 9. Remaining Gaps / Risks
+
+Even after this continuation, there are still real gaps.
+
+### 9.1 UI Is Manual, Not CLI-Generated
+
+The component layer is local and manual.
+
+That is acceptable for the user’s stated direction, but it means:
+
+- future new components are still hand-authored unless someone later chooses to bring in the CLI workflow
+
+### 9.2 Some Interaction Primitives Are Still Native
+
+The visual system is consistent enough now, but some lower-level interaction pieces are still native rather than componentized, for example:
+
+- plain checkbox controls
+- some inline destructive text buttons
+- some per-row action buttons inside lists
+
+If the next session wants to push polish further, likely next UI candidates are:
+
+- checkbox
+- badge
+- alert
+- table or data-list wrappers
+- reusable stat-card component
+
+### 9.3 API Structure Is Still Large
+
+This is unchanged from the earlier handoff:
+
+- [`/home/sandy/HUB-master/django-port/backend/apps/api/views.py`](/home/sandy/HUB-master/django-port/backend/apps/api/views.py) is still too large
+
+Correctness was prioritized over structural refactor.
+
+### 9.4 No Automated Backend Test Coverage
+
+Still missing:
+
+- API tests
+- model/service tests
+- end-to-end tests
+
+### 9.5 Repo Portability Depends On What Gets Committed
+
+The folder is now prepared so it can stand alone, but another machine still only gets what is actually pushed.
+
+To make the subtree truly self-contained in a new repository, the pushed repo should include at minimum:
+
+- `backend/`
+- `frontend/`
+- `data/legacy/`
+- `docs/`
+- `.gitignore`
+- `README.md`
+- `backend/db.sqlite3` if the preloaded application data should ship too
+
+It should **not** need:
+
+- repo-root legacy databases outside `django-port`
+- repo-root frontend/backend folders outside `django-port`
+- local `venv`
+- local `node_modules`
+- `.svelte-kit`
+
+Recommended startup files for another machine:
+
+- `backend/.env` copied from `backend/.env.example`
+- `frontend/.env` copied from `frontend/.env.example`
+
+Only the host/origin values should need adjustment if the deployment URLs differ from the local defaults.
+
+## 10. Recommended Next Steps
+
+If another Codex instance continues from here, recommended order is:
+
+1. do manual browser QA on the dark UI across the main routes
+2. fix any remaining visual inconsistencies discovered in that manual pass
+3. decide whether `backend/db.sqlite3` should be committed in the destination repo as seeded app data
+4. add reusable primitives for checkbox/badge/alert if more UI polish is desired
+5. only after UI stabilizes, consider splitting `apps/api/views.py`
+6. add targeted API tests for business scoping and user/invoice CRUD
+
+## 11. Immediate Startup Context For The Next Codex
+
+The project is no longer at a bootstrap stage.
+
+The current state should be understood as:
+
+- Django backend is functioning
+- Svelte frontend is functioning
+- auth works
+- scoping is better than before
+- user/invoice CRUD exists
+- UI layer is now local manual shadcn-style and dark
+
+So the next session should not redo scaffolding.
+
+It should assume the task is now one of:
+
+- polish
+- QA
+- test coverage
+- structural cleanup