Skip to content

Commit bd56e54

Browse files
abrichrclaude
abrichr
and
claude
authored
feat: add productization plan and web UI scaffold (#23)
* feat: add productization plan and web UI scaffold Add comprehensive productization document covering market analysis, pricing model (Free/Pro/Team tiers), MVP roadmap (6 weeks), technical architecture evolution, go-to-market strategy, and unit economics. Create Next.js web app scaffold at apps/web/ with: - Landing page with features, pricing, and language support sections - Task submission form connected to Supabase via server actions - Job detail page scaffold for real-time status tracking - Supabase client helpers (server + browser) - Tailwind CSS styling with custom Wright color palette Also update turbo.json for .next/ build outputs and .gitignore for Next.js artifacts. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: regenerate pnpm-lock.yaml for apps/web Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: add ESLint config for web app Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: add eslint deps to web app Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: pin eslint to v8 for Next.js compatibility Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent c6b2e65 commit bd56e54

File tree

18 files changed

+5006
-59
lines changed

18 files changed

+5006
-59
lines changed

‎.gitignore‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,3 +30,8 @@ pnpm-debug.log*
3030

3131
# Supabase
3232
supabase/.temp/
33+
34+
# Next.js
35+
.next/
36+
out/
37+
next-env.d.ts

‎apps/web/.env.example‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# Supabase
2+
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
3+
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
4+
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
5+
6+
# GitHub (temporary -- will be replaced by GitHub App)
7+
GITHUB_TOKEN=ghp_your-token

‎apps/web/.eslintrc.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎apps/web/next.config.mjs‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
transpilePackages: ['@wright/shared'],
4+
}
5+
6+
export default nextConfig

‎apps/web/package.json‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"name": "@wright/web",
3+
"version": "0.1.0",
4+
"private": true,
5+
"type": "module",
6+
"scripts": {
7+
"dev": "next dev --port 3000",
8+
"build": "next build",
9+
"start": "next start",
10+
"lint": "next lint",
11+
"clean": "rm -rf .next .turbo"
12+
},
13+
"dependencies": {
14+
"@supabase/ssr": "^0.6.0",
15+
"@supabase/supabase-js": "^2.49.0",
16+
"@wright/shared": "workspace:*",
17+
"next": "^14.2.0",
18+
"react": "^18.3.0",
19+
"react-dom": "^18.3.0"
20+
},
21+
"devDependencies": {
22+
"@types/node": "^22.0.0",
23+
"@types/react": "^18.3.0",
24+
"@types/react-dom": "^18.3.0",
25+
"autoprefixer": "^10.4.0",
26+
"eslint": "^8.57.0",
27+
"eslint-config-next": "^14.2.0",
28+
"postcss": "^8.4.0",
29+
"tailwindcss": "^3.4.0",
30+
"typescript": "^5.7.0"
31+
}
32+
}

‎apps/web/postcss.config.mjs‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
/** @type {import('postcss-load-config').Config} */
2+
const config = {
3+
plugins: {
4+
tailwindcss: {},
5+
autoprefixer: {},
6+
},
7+
}
8+
9+
export default config

‎apps/web/src/app/globals.css‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
:root {
6+
--foreground-rgb: 15, 23, 42;
7+
--background-start-rgb: 248, 250, 252;
8+
--background-end-rgb: 241, 245, 249;
9+
}
10+
11+
body {
12+
color: rgb(var(--foreground-rgb));
13+
background: linear-gradient(
14+
to bottom,
15+
transparent,
16+
rgb(var(--background-end-rgb))
17+
)
18+
rgb(var(--background-start-rgb));
19+
}
20+
21+
@layer utilities {
22+
.text-balance {
23+
text-wrap: balance;
24+
}
25+
}

‎apps/web/src/app/jobs/[id]/page.tsx‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
import Link from 'next/link'
2+
3+
/**
4+
* Job detail page -- shows status, events timeline, and test results.
5+
*
6+
* This is a scaffold. The full implementation will:
7+
* - Fetch job details from Supabase
8+
* - Subscribe to real-time job_events updates
9+
* - Show test result diffs between loops
10+
* - Link to the created PR
11+
*/
12+
export default function JobDetailPage({
13+
params,
14+
}: {
15+
params: { id: string }
16+
}) {
17+
return (
18+
<main className="min-h-screen">
19+
{/* Navigation */}
20+
<nav className="w-full border-b border-slate-200 bg-white/80 backdrop-blur-sm">
21+
<div className="mx-auto flex max-w-6xl items-center justify-between px-6 py-4">
22+
<Link href="/" className="flex items-center gap-2">
23+
<span className="text-xl font-bold text-wright-700">Wright</span>
24+
<span className="rounded-full bg-wright-100 px-2 py-0.5 text-xs font-medium text-wright-700">
25+
beta
26+
</span>
27+
</Link>
28+
<Link
29+
href="/new"
30+
className="rounded-lg bg-wright-600 px-4 py-2 text-sm font-medium text-white hover:bg-wright-700"
31+
>
32+
New Task
33+
</Link>
34+
</div>
35+
</nav>
36+
37+
<div className="mx-auto max-w-4xl px-6 py-16">
38+
<div className="flex items-center gap-3">
39+
<h1 className="text-2xl font-bold text-slate-900">Job Details</h1>
40+
<code className="rounded bg-slate-100 px-2 py-1 font-mono text-sm text-slate-600">
41+
{params.id}
42+
</code>
43+
</div>
44+
45+
{/* Placeholder for job details */}
46+
<div className="mt-8 rounded-xl border border-slate-200 bg-white p-8">
47+
<div className="space-y-4 text-slate-600">
48+
<p>
49+
This page will show real-time job status, event timeline, and test
50+
results once connected to Supabase.
51+
</p>
52+
<div className="rounded-lg bg-slate-50 p-4">
53+
<h3 className="text-sm font-semibold text-slate-700">
54+
Coming Soon
55+
</h3>
56+
<ul className="mt-2 list-inside list-disc space-y-1 text-sm">
57+
<li>Real-time status updates via Supabase Realtime</li>
58+
<li>Event timeline (claimed, cloning, editing, testing...)</li>
59+
<li>Test results per loop iteration</li>
60+
<li>Cost tracking (API spend per loop)</li>
61+
<li>Link to created PR</li>
62+
<li>Cancel / retry controls</li>
63+
</ul>
64+
</div>
65+
</div>
66+
</div>
67+
</div>
68+
</main>
69+
)
70+
}

‎apps/web/src/app/layout.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import type { Metadata } from 'next'
2+
import './globals.css'
3+
4+
export const metadata: Metadata = {
5+
title: 'Wright — AI Dev Automation',
6+
description:
7+
'Submit a task, get a pull request. Wright uses Claude to edit code, run tests, and create PRs automatically.',
8+
}
9+
10+
export default function RootLayout({
11+
children,
12+
}: {
13+
children: React.ReactNode
14+
}) {
15+
return (
16+
<html lang="en">
17+
<body className="min-h-screen antialiased">{children}</body>
18+
</html>
19+
)
20+
}

0 commit comments

Comments
 (0)