Dashboard Demo · March 2026

CODITECT Auth Portal
Dashboard Walkthrough

A complete walkthrough of the auth.coditect.ai portal as deployed on March 14, 2026 — frontend v1.34.0-wpp-header running on GKE. Includes 15 annotated screenshots, architecture documentation (ADR/SDD/TDD-261), and the development timeline across concurrent work sessions.

Screenshots

Architecture Docs

Dev Sessions

ADR-261

Design Decision

Production Status — 2026-03-14

Backend API — v1.43.1 · 4/4 pods

Auth Portal — v1.34.0-wpp-header · 2/2 pods

Landing Page — Cloudflare Pages · live

Migrations — 4 applied · complete

Dashboard Gallery

15 screenshots from auth.coditect.ai captured on 2026-03-14 during the v1.34.0-wpp-header deployment walkthrough. Click any image to view full size.

ADR-261 v1.4.0 · 2026-03-14 Accepted

Landing Page to Auth Portal Full Integration

The coditect.ai landing page, auth.coditect.ai portal, and api.coditect.ai backend were three isolated systems. This ADR establishes the end-to-end pipeline connecting survey submission to automatic user registration, welcome communications, magic-link login, and a personalized dashboard backed by real project and payment data.

Decision Summary

Prior to this decision, three production systems operated independently with no integration between them. The disconnection created three failure modes: a broken conversion funnel, no real project data in the dashboard, and silent Stripe payments that never activated user projects.

The decision implements an end-to-end pipeline that closes all three gaps with the minimum set of additions to the existing Django + React stack.

Core Decision	Description
1. Unified Survey-Register	Single public endpoint creates User + Tenant, links Lead, generates 48-hour magic link token, returns JWTs. Idempotent on email.
2. Magic Link Auth	Passwordless first-login via single-use token. Sets `email_verified=True`. Redirects to `/home`.
3. Lead-to-User FK	Nullable FK enables dashboard to query real `LeadProject` records. SET_NULL on delete preserves history.
4. Staged Communications	Welcome email + SMS created as `LeadActivity` records, delivered out-of-band. Keeps response <500ms.
5. Client-Side Personalization	localStorage-based engine. No server round-trip. Hero/CTA variants for returning visitors.
6. Token Auto-Login	Auth portal checks `?token=` on load. Auto-verifies and redirects without user interaction.
7. Stripe Webhook Activation	`checkout.session.completed` → HMAC verify → `order.mark_paid()` → `LeadProject.status='pilot'` + 90-day subscription.

Design Decision D-8: WPP-Standard Layout

The auth portal Layout component must implement the WPP-standard header and sidebar pattern derived from wpp-viewer/viewer.jsx and wpp-viewer/components/Sidebar.jsx.

Header Element (left → right)	Implementation
Sidebar toggle	`PanelLeftClose` / `PanelLeft` icon — keyboard: `Cmd+B`
Category expand/collapse all	`Folder` / `ChevronsUpDown` — visible only when sidebar is open
Logo + title + subtitle	`h-9 w-9 rounded-lg` logo · "CODITECT" · "AI Infrastructure Platform"
Right side	Search (`/`, `Ctrl+K`), Pricing, Cart, Dark mode toggle, Auth controls

Sidebar Category	Items
OVERVIEW	Dashboard, Projects
INSTALLATION	Installations, Downloads
ACCOUNT	Settings, Billing, Support

Deployed: Frontend v1.34.0-wpp-header (commit 3dbf0cd) — GKE coditect-dev namespace, 2/2 pods running.

Deployment Record — 2026-03-14

Component	Version	Status
Backend API	v1.43.1-adr261-import-fix	4/4 Running
Auth Portal Frontend	v1.29.0-adr261-survey-integration → v1.34.0-wpp-header	2/2 Running
Landing Page	—	Cloudflare Pages · Live
Migrations	users/0007, leads/0007, leads/0008, leads/0009	Complete

Operational Issue	Workaround
ImportError CrashLoopBackOff — TenantMembership wrong module	Fixed in v1.43.1
Migration K8s Job SSL failure (`DATABASE_SSLMODE=disable`)	Run via `kubectl exec` on serving pods
arm64 image fails on amd64 GKE nodes	`docker buildx --platform linux/amd64`
63 PascalCase imports break on Linux case-sensitive fs	Fixed source files + Dockerfile symlink script
Django `send_mail()` non-functional in GKE (no SMTP)	Welcome emails sent via Google Workspace MCP

Changelog

Version	Date	Change
v1.4.0	2026-03-14	Added Design Decision D-8 — WPP-Standard Layout Pattern for Auth Portal
v1.3.0	2026-03-13	Added `/coditect-dashboard` cross-reference (login + persistent browser automation)
v1.2.0	2026-03-14	UUID-Based Dashboard URLs design decision + Frontend v1.30–v1.31 update record
v1.1.0	2026-03-14	Deployment Record — GKE topology, operational issues, E2E verification

SDD-261 v1.5.0 · 2026-03-14 Accepted

Software Design Document — Landing Page to Auth Portal Integration

System design covering component architecture, data flow, sequence diagrams for the three primary flows (survey-register, magic-link login, post-payment activation), security model, data model changes, and the WPP-Standard Layout component specification.

Deployment Topology (Actual Production)

System	Host	Technology	GKE Details
Landing page	coditect.ai	Static HTML + Vanilla JS	Cloudflare Pages
Auth portal	auth.coditect.ai	React + TypeScript (Vite) + nginx:1.25-alpine	Deployment: coditect-frontend, 2 replicas
Backend API	api.coditect.ai	Django 4.2 + DRF	Deployment: django-backend, 4 replicas
Database	Cloud SQL / AlloyDB	PostgreSQL (Citus)	Cluster: coditect-citus-dev

Component Architecture

Backend components — coditect-cloud-infra/backend/

File	Change
`users/models.py`	MagicLinkToken model (token_hash SHA-256, user FK, expires_at, used_at)
`users/views.py`	SurveyRegisterView, MagicLinkVerifyView, UserProjectsView
`leads/models.py`	Add phone, phone_country_code fields; add user nullable FK
`commerce/views.py`	Extend Stripe webhook for checkout.session.completed → LeadProject activation

Auth Portal components — coditect-cloud-frontend/src/

File	Change
`pages/welcome.tsx`	Magic link landing page; calls verifyMagicLink() on mount
`pages/projects-home.tsx`	Real API data from UserProjectsView (replaces mock)
`pages/dashboard.tsx`	Your Projects section backed by real API
`services/auth.service.ts`	verifyMagicLink(), getUserProjects() methods
`components/layout.tsx`	WPP-standard header + collapsible category sidebar (D-8)

Security Model

Property	Value	Rationale
Token entropy	384 bits (`secrets.token_urlsafe(48)`)	Resistant to brute-force
Storage	SHA-256 hash in DB; raw token in URL only	Token never stored in plaintext
Validity window	48 hours	Balances usability vs exposure
Reuse	Single-use; consumed on first verification	Prevents replay attacks
Access token expiry	1 hour	Limits localStorage exposure window
Refresh token expiry	7 days	Rotated on use
Stripe webhook	HMAC-SHA256 via STRIPE_WEBHOOK_SECRET	No DB writes on signature failure

Section 10: WPP-Standard Layout Component

The Layout component at src/components/layout.tsx implements the WPP-standard pattern. Pattern source: wpp-viewer/viewer.jsx + wpp-viewer/components/Sidebar.jsx.

State	Default	Description
`sidebarOpen`	true	Controls sidebar visibility
`collapsedSections`	{}	Per-category collapse state map
`searchOpen`	false	Command palette modal visibility

// Header structure (h-14, fixed top)
[PanelLeft toggle] [Folder toggle] [Logo + Title + Subtitle]  ...  [Search] [Pricing] [Cart] [DarkMode] [Logout]

// Sidebar structure (w-64, fixed left, below header)
▶ OVERVIEW (2)          ← collapsed category
▼ INSTALLATION (2)      ← expanded category
  │ Installations       ← active item (border-primary-500)
  │ Downloads
▼ ACCOUNT (3)
  │ Settings
  │ Billing
  │ Support

Keyboard Shortcut	Action
`Cmd+B` / `Ctrl+B`	Toggle sidebar
`/`	Open search (when not in input)
`Ctrl+K`	Open search
`Escape`	Close search

Deployed: v1.34.0-wpp-header, commit 3dbf0cd. ADR-261 D-8 design decision documents this pattern as the required standard for all CODITECT portal UIs.

TDD-261 v1.5.0 · 2026-03-14 Accepted

Technical Design Document — Landing Page to Auth Portal Integration

API contracts for all new and modified endpoints, migration execution order, rollback strategy, 20-section test plan, deployment sequence, error handling, and performance budgets.

Test Plan Overview

The test plan covers 20 named test sections (4.1–4.20), organized across functional areas:

Section	Area	Goal
4.1	E2E Pipeline	Survey form → authenticated dashboard with real project data
4.2	Migration Safety	Staging database migration run — 3 migrations in strict order
4.3	Stripe Webhook	checkout.session.completed → LeadProject pilot activation
4.4	Idempotency	Duplicate email submission does not create duplicate user
4.5	Personalization	localStorage state persists across sessions; hero/CTA variants
4.6	Token Security	Valid/expired/used/tampered token scenarios
4.7–4.10	CLI Registration	Interactive flow, --status flag, re-registration, --dashboard Playwright
4.11–4.12	License Activation	Key format validation, license.json persistence with KMS signature
4.13–4.14	Installations Dashboard	List/detail views, URL stability across token rotation
4.15	Layout	Sidebar, search modal, logout, theme default (light)
4.16–4.19	/coditect-dashboard	Account selection, token cascade, Playwright auto-login, persistent session
4.20	WPP Layout	7 sub-tests: toggle, expand/collapse, categories, active route, mobile, keyboard, styling

Section 4.20: WPP Layout Component Tests

Test	Assertion
4.20.1 Sidebar toggle	PanelLeftClose/PanelLeft renders for auth users; clicking toggles visibility
4.20.2 Folder expand/collapse all	ChevronsUpDown only visible when sidebar open; collapses/expands all
4.20.3 Category headers	ChevronRight/Folder when collapsed; ChevronDown/FolderOpen when expanded; count badge renders
4.20.4 Active route auto-expand	Category containing active route auto-expands on navigation
4.20.5 Mobile overlay	Fixed z-30 overlay on <768px; backdrop dismiss; auto-close on item select
4.20.6 Keyboard shortcuts	Cmd+B toggles sidebar; / opens search; Ctrl+K opens search; Escape closes
4.20.7 Active item styling	border-l-[3px] border-primary-500; bg-primary-50 (light) / bg-primary-900/20 (dark); font-medium

Performance Budgets

Endpoint	Target p95	Key Operations
survey-register	<500ms	User lookup + Tenant create + Lead FK + MagicLinkToken + 2× LeadActivity + JWT. ~40ms DB + compute total.
magic-link-verify	<200ms	Single indexed token_hash lookup + 1 update + JWT generation. No external calls.
Client-side personalization	<5ms	Synchronous localStorage read in DOMContentLoaded. No network.

Known Issues

Issue	Impact	Workaround
cloudbuild.yaml migration Job uses `DATABASE_SSLMODE=disable`	Job fails with SSL rejection	Run migrations via `kubectl exec` on serving pods
Container names differ from deployment names	`kubectl set image` targets wrong container	Use `django` (not `django-backend`), `celery` (not `celery-worker`)
Docker builds on Apple Silicon produce arm64	ImagePullBackOff on GKE amd64 nodes	Always use `docker buildx --platform linux/amd64`
PascalCase imports vs kebab-case filenames	Vite build fails on Linux (case-sensitive fs)	Fixed 63 source files + Dockerfile symlink script
Stripe checkout → LeadProject activation	Not yet E2E tested with real Stripe	Pending C.18.4.2

Session Log 2026-03-14 Complete

Session Log — 2026-03-14

Machine: d3d3a316-09c6-8f41-4a3f-d93e422d199c — 11 entries across concurrent sessions ec231c2b, a774f233, and e3b63d81 covering the full ADR-261 deployment pipeline, CLI skill creation, and WPP-standard layout implementation.

00:37 UTC

ADR-261 TRACK Subtask Completeness Audit + Gap Closure

Audited all TRACK files for ADR-261 subtask completeness. Found 15 missing subtasks covering backend deployment to GKE, E2E verification, and architecture documentation. Created C.18 (8 subtasks), F.14 (3 subtasks — all complete), and B.19.2 (1 subtask). All implementation code complete; C.18 deployment tasks are the remaining work.

ec231c2bC.18F.14B.19.2
02:30 UTC

/coditect-register Skill Created, Live-Tested, Path Bug Fixed + 6 Architecture Docs Updated

Created /coditect-register skill (v2.0) with 8-step interactive flow — name/email collection, consent summary, API registration, and Playwright --dashboard browser automation. Created /license-activate skill (v1.0). Updated install mechanism analysis to v2.0. Six architecture documents updated. Live-tested and found Path("") truthy bug in cloud_registration.py — fixed. Registration API call reaches api.coditect.ai but returns 404 (endpoint not yet deployed).

a774f233C.19N.12
03:28 UTC

C.18 Deployment Pipeline Complete: Backend v1.43.1 + Frontend v1.29.0 Live on GKE

Deployed ADR-261 integration to GKE production. Applied 4 Django migrations via kubectl exec. Fixed TenantMembership ImportError CrashLoopBackOff (wrong module) → rebuilt as v1.43.1. Fixed 63 PascalCase import mismatches. First Docker image was arm64 → rebuilt with --platform linux/amd64. E2E verification passed: survey-register creates user + JWT + magic link, idempotency confirmed. Both frontend pods 1/1 Ready.

ec231c2bC.18.1–4B.19.2
03:45 UTC

ADR/SDD/TDD-261 Updated with Deployment Record + TRACK Tasks Completed

Updated all three architecture documents to reflect actual deployment state: corrected topology from Cloud Run to GKE, added deployment record with 4 operational issues and workarounds. Marked 7/8 TRACK-C C.18 tasks complete.

ec231c2bC.18F.14
03:51 UTC

Session Overlap Analysis: Two Active 2026-03-14 Sessions

Analyzed overlap between concurrent sessions. a774f233 focused on CLI skills and architecture docs. e3b63d81 focused on UI/frontend unification. Low overlap — complementary scopes across different layers (CLI vs frontend). No file lock conflicts.

a774f233C.19
04:01 UTC

Registration Endpoint Live but Returns 500

Backend v1.43.1 unblocked the /coditect-register endpoint (was 404, now 500). Three likely causes: Tenant.slug uniqueness conflict, missing Installation model migration columns, or send_mail config. Plan: kubectl exec into backend pod to step through registration logic in Django shell.

a774f233C.19
04:34 UTC

Registration E2E Complete: 201 + Email via MCP + Auto-Login Skill

Full /coditect-register flow working end-to-end. Registration returns 201, installation ID 68c07b5a, user created. Django email silently failed — sent welcome email via Google Workspace MCP instead. Login token saved to registration.json. Auto-fills email + login_token in Playwright for seamless dashboard access. Each user gets unique URL at auth.coditect.ai/installations/{uuid}. Cross-session coordination pattern proven.

a774f233C.19
04:41 UTC

Multi-Account Design Gap + ADR/SDD/TDD Email+AutoLogin Updates

Identified multi-account design gap — registration.json is single-account (last-write-wins). Proposed per-email files at licensing/registrations/{email}.json with active-account.json pointer. Updated ADR-261 (Django SMTP + MCP workaround), SDD-261 Section 7 (registration.json schema, --dashboard auto-login flow), TDD-261 (revised 4.10, new 4.10a, 4.10b).

a774f233C.19
05:08 UTC

Token Management + Multi-Account + Secret Manager Design

Updated /coditect-register to v3.0 with token lifecycle management. 5 new flags: --refresh-token, --accounts, --account, --sync-tokens, --pull-tokens. Multi-account storage at licensing/registrations/{email}.json. Secret Manager path: coditect-auth-{email-slug} with IAM-scoped access.

a774f233C.19
06:13 UTC

ADR-262 Implemented + Commerce Gap Analysis + ADR-014/015 Updated

ADR-262 Phase 1+2: backend v1.44.0 adds InstallationProject + InstallationActivity models, new GET endpoints. Frontend v1.32.0 adds unified tabbed dashboard (7 views), sectioned sidebar, masked UUIDs with copy buttons, JWT expiry check. Fixed ~110 case-sensitivity import mismatches. Stripe checkout found non-functional (mock URLs). Backend deployed v1.43.0→v1.44.0, frontend v1.29.0→v1.32.0.

ec231c2bB.20C.20C.18.4.2
07:01 UTC

WPP-Standard Layout: Header Panel Toggle + Collapsible Category Sidebar

Replaced the auth portal's non-standard flat nav sidebar with the WPP-standard layout pattern. PanelLeftClose/PanelLeft toggle in header. Folder/ChevronsUpDown expand/collapse all. Collapsible category tree with ChevronRight/ChevronDown headers. Mobile overlay with backdrop dismiss. Keyboard shortcuts: Cmd+B, /, Ctrl+K. Frontend v1.34.0-wpp-header deployed (commit 3dbf0cd). ADR/SDD/TDD-261 updated with D-8, component spec, and test plan section 4.20.

e3b63d81B.20v1.34.0-wpp-header

Session ec231c2b 2026-03-12 – 2026-03-14 Active

Working Session — ec231c2b-b0d0-4f26-bad5-99f212d66294

Primary deployment session for ADR-261. Started 2026-03-12T14:41Z. Covered TRACK audit, full GKE deployment pipeline, architecture doc updates, ADR-262 implementation, and WPP layout migration.

Completed Tasks

Fix /installations* route guard redirect bug — deployed in v1.34.0
Fix header/sidebar regression — v1.34.0-wpp-header (commit 3dbf0cd). Replaced flat nav with WPP-standard layout: PanelLeftClose/PanelLeft toggle, Folder/ChevronsUpDown expand/collapse, collapsible category tree with ChevronRight/ChevronDown, mobile overlay, Cmd+B / Ctrl+K shortcuts. ADR/SDD/TDD-261 updated with D-8.
C.18 deployment pipeline complete: backend v1.43.1, 4 migrations applied, frontend v1.29.0→v1.34.0, E2E verified
ADR-262 Phase 1+2: installations dashboard (list + detail views), 7-tab unified dashboard, sectioned sidebar, masked UUIDs, JWT expiry fix
Fixed ~113 PascalCase import mismatches (63 initial + 50 subsequent) across coditect-cloud-frontend

Remaining Items

Implement real Stripe checkout (C.18.4.2) — stripe.checkout.Session.create(), seed products with stripe_price_id, configure keys in GKE
Fix shopping cart dark mode — shopping-cart.tsx hardcoded bg-white, needs dark:bg-gray-800
Seed product data — verify 4 products in production DB with valid stripe_price_id

Session a774f233 2026-03-13 – 2026-03-14 Active

Working Session — a774f233-fa52-4123-b6a1-252c73d3ae0b

Marathon session (~7 hours, 00:39–07:27 UTC). CLI skills and cloud registration pipeline. First successful end-to-end /coditect-register registration (installation 68c07b5a). Cross-session coordination with ec231c2b across 12+ round-trips.

Key Accomplishments

Deliverable	Result
`/coditect-register` v3.0	8-step interactive flow, token management, multi-account design, 5 new flags
`/license-activate` v1.0	Cloud KMS license binding CLI skill
`/coditect-dashboard` v3.0	Account selection, 4-step token cascade, Playwright auto-login, persistent session
Browser workspace launcher	`browser_workspace.py` + `browser-workspaces.json`, 3 workspaces, credential-blind architecture
Install mechanism analysis v2.0	17 distribution channels, Section 10 Cloud Integration Architecture
First cloud registration	201 Created, installation `68c07b5a-5968-4906-86a3-bb2c0395d5a4`, user confirmed
6 architecture docs updated	ADR-067, ADR-261 v1.2–v1.3, SDD-261 v1.1–v1.4, TDD-261 v1.1–v1.4, ADR-262
Path bug fixed	`Path("")` truthy bypassed `get_user_data_dir()` fallback — fixed in `cloud_registration.py`
Synced to protected install	coditect-core `6a326023`, rollout-master `26e33c5e`

Cross-session coordination pattern: Sessions ec231c2b and a774f233 coordinated across working-session.md notes. a774f233 identified blockers (404→500), wrote to ec231c2b's working session file, ec231c2b fixed and wrote back, a774f233 verified and completed the flow. 12+ round-trips proved the pattern production-grade.

Remaining Items

Verify browser-screenshot-on-error.py PostToolUse hook no longer errors
Consider adding session-start hook that validates ~/.coditect symlink integrity

About CODITECT

AI Infrastructure Platform — building the connective tissue for AI-assisted software development.

What Is CODITECT?

CODITECT is an AI infrastructure platform built by AZ1.AI INC. It provides a structured environment for AI-assisted software development through a framework of agents, commands, skills, scripts, and hooks — installed locally and connected to a cloud control plane.

The platform is distributed as a CLI tool installable on macOS, Linux, and Docker/Linux environments. After installation, users register at auth.coditect.ai to access their project dashboard, manage installations, and track development progress.

Platform Components

URL	Purpose	Technology
`coditect.ai`	Marketing landing page with 8-step qualification survey	Static HTML + Vanilla JS on Cloudflare Pages
`auth.coditect.ai`	Auth portal — dashboard, installations, projects, profile	React + TypeScript (Vite) on GKE
`api.coditect.ai`	Backend API — auth, leads, commerce, licenses	Django 4.2 + DRF on GKE

This Demo Site

This site is a standalone WPP-style documentation and gallery site built to showcase the auth.coditect.ai portal as deployed on March 14, 2026. It uses the same WPP-standard layout pattern (D-8 from ADR-261) applied in the auth portal itself — collapsible category sidebar, PanelLeft toggle, dark/light mode, keyboard navigation.

Detail	Value
Build date	2026-03-14
Portal version captured	v1.34.0-wpp-header (commit `3dbf0cd`)
Screenshots	15 × PNG, auth.coditect.ai, 2026-03-14 01:54–02:26 UTC
Architecture docs	ADR-261 v1.4.0, SDD-261 v1.5.0, TDD-261 v1.5.0
Deployment	Cloudflare Pages via `npx wrangler pages deploy`

CODITECT Auth PortalDashboard Walkthrough

Dashboard Gallery

Landing Page to Auth Portal Full Integration

Decision Summary

Design Decision D-8: WPP-Standard Layout

Deployment Record — 2026-03-14

Changelog

Software Design Document — Landing Page to Auth Portal Integration

Deployment Topology (Actual Production)

Component Architecture

Security Model

Section 10: WPP-Standard Layout Component

Technical Design Document — Landing Page to Auth Portal Integration

Test Plan Overview

Section 4.20: WPP Layout Component Tests

Performance Budgets

Known Issues

Session Log — 2026-03-14

Working Session — ec231c2b-b0d0-4f26-bad5-99f212d66294

Completed Tasks

Remaining Items

Working Session — a774f233-fa52-4123-b6a1-252c73d3ae0b

Key Accomplishments

Remaining Items

About CODITECT

What Is CODITECT?

Platform Components

This Demo Site

CODITECT Auth Portal
Dashboard Walkthrough