@programinglive/dev-workflow-mcp-server 1.4.6 → 1.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +114 -0
- package/docs/NETLIFY_DEPLOYMENT.md +125 -0
- package/docs/product/PRD.md +4 -2
- package/docs/release-notes/RELEASE_NOTES.md +32 -0
- package/docs/web-dashboard.md +12 -0
- package/package.json +1 -1
- package/server.json +13 -3
- package/tests/build.test.js +30 -0
- package/tests/mcpRegistry.test.js +13 -3
- package/web/app/api/history/route.ts +10 -17
- package/web/app/api/summary/route.ts +11 -13
- package/web/app/api/version/route.ts +4 -11
- package/web/netlify.toml +6 -0
- package/web/next.config.ts +1 -2
- package/web/package-lock.json +17 -428
- package/web/package.json +0 -1
- package/web-legacy/public/assets/android-chrome-192x192.png +0 -0
- package/web-legacy/public/assets/android-chrome-512x512.png +0 -0
- package/web-legacy/public/assets/apple-touch-icon.png +0 -0
- package/web-legacy/public/assets/favicon-16x16.png +0 -0
- package/web-legacy/public/assets/favicon-32x32.png +0 -0
- package/web-legacy/public/assets/favicon.ico +0 -0
- package/web-legacy/public/assets/favicon.png +0 -0
- package/web-legacy/public/assets/logo.png +0 -0
- package/web-legacy/public/assets/og-preview.png +0 -0
- package/web-legacy/public/assets/site.webmanifest +0 -1
- package/web-legacy/public/docs/EXAMPLES.html +0 -496
- package/web-legacy/public/docs/GETTING-STARTED.html +0 -318
- package/web-legacy/public/docs/README.html +0 -620
- package/web-legacy/public/docs/RELEASE_NOTES.html +0 -275
- package/web-legacy/public/docs/TROUBLESHOOTING.html +0 -627
- package/web-legacy/public/docs/WORKFLOW-TEMPLATES.html +0 -676
- package/web-legacy/public/docs/web-dashboard.html +0 -243
- package/web-legacy/public/index.html +0 -223
- package/web-legacy/public/input.css +0 -80
- package/web-legacy/public/main.js +0 -167
- package/web-legacy/public/output.css +0 -1559
- package/web-legacy/server.js +0 -207
|
@@ -1,243 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>Dev Workflow Web Dashboard - Dev Workflow</title>
|
|
7
|
-
<link rel="icon" type="image/png" href="/assets/favicon.png">
|
|
8
|
-
<meta property="og:type" content="website">
|
|
9
|
-
<meta property="og:url" content="https://commiter.programinglive.com/docs/web-dashboard.md">
|
|
10
|
-
<meta property="og:title" content="Dev Workflow Web Dashboard - Dev Workflow">
|
|
11
|
-
<meta property="og:description" content="Detailed documentation for Dev Workflow MCP Server commands and usage.">
|
|
12
|
-
<meta property="og:image" content="/assets/og-preview.png">
|
|
13
|
-
<meta property="twitter:card" content="summary_large_image">
|
|
14
|
-
<meta property="twitter:url" content="https://commiter.programinglive.com/docs/web-dashboard.md">
|
|
15
|
-
<meta property="twitter:title" content="Dev Workflow Web Dashboard - Dev Workflow">
|
|
16
|
-
<meta property="twitter:description" content="Detailed documentation for Dev Workflow MCP Server commands and usage.">
|
|
17
|
-
<meta property="twitter:image" content="/assets/og-preview.png">
|
|
18
|
-
<link rel="stylesheet" href="/output.css">
|
|
19
|
-
<script src="https://unpkg.com/lucide@latest"></script>
|
|
20
|
-
</head>
|
|
21
|
-
<body class="bg-[#0a0a0f] text-white font-sans antialiased selection:bg-primary/30 selection:text-white min-h-screen flex flex-col">
|
|
22
|
-
<header class="fixed top-0 left-0 right-0 z-50 border-b border-white/10 bg-[#0a0a0f]/80 backdrop-blur-md">
|
|
23
|
-
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 flex items-center justify-between">
|
|
24
|
-
<div class="flex items-center gap-3">
|
|
25
|
-
<a href="/" class="flex items-center gap-3 hover:opacity-80 transition-opacity">
|
|
26
|
-
<div class="w-10 h-10 rounded-lg overflow-hidden border border-white/10 shadow-lg shadow-primary/20">
|
|
27
|
-
<img src="/assets/logo.png" alt="Dev Workflow Logo" class="w-full h-full object-cover">
|
|
28
|
-
</div>
|
|
29
|
-
<div>
|
|
30
|
-
<h1 class="font-bold text-lg tracking-tight text-white">Dev Workflow</h1>
|
|
31
|
-
<div class="flex items-center gap-2 text-xs text-gray-400">
|
|
32
|
-
<span class="w-2 h-2 rounded-full bg-emerald-500 shadow-[0_0_8px_rgba(16,185,129,0.5)]"></span>
|
|
33
|
-
<span>Documentation</span>
|
|
34
|
-
</div>
|
|
35
|
-
</div>
|
|
36
|
-
</a>
|
|
37
|
-
</div>
|
|
38
|
-
<div class="flex items-center gap-4">
|
|
39
|
-
<a href="/" class="flex items-center gap-2 px-4 py-2 bg-white/5 hover:bg-white/10 border border-white/10 rounded-full text-sm font-medium transition-all group">
|
|
40
|
-
<i data-lucide="layout-dashboard" class="w-4 h-4 text-gray-400 group-hover:text-white transition-colors"></i>
|
|
41
|
-
<span>Dashboard</span>
|
|
42
|
-
</a>
|
|
43
|
-
</div>
|
|
44
|
-
</div>
|
|
45
|
-
</header>
|
|
46
|
-
|
|
47
|
-
<div class="flex-1 max-w-7xl mx-auto w-full px-4 sm:px-6 lg:px-8 pt-24 pb-12 flex gap-8">
|
|
48
|
-
<aside class="hidden lg:block w-64 flex-shrink-0 fixed h-[calc(100vh-6rem)] overflow-y-auto pr-4 custom-scrollbar">
|
|
49
|
-
<nav class="space-y-1">
|
|
50
|
-
<a href="/" class="flex items-center gap-3 px-4 py-3 text-sm font-medium rounded-lg text-gray-400 hover:text-white hover:bg-white/5 transition-colors">
|
|
51
|
-
<i data-lucide="arrow-left" class="w-4 h-4"></i>
|
|
52
|
-
Back to Dashboard
|
|
53
|
-
</a>
|
|
54
|
-
</nav>
|
|
55
|
-
<div class="mt-8 pt-8 border-t border-white/10">
|
|
56
|
-
<h3 class="px-4 text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">Documentation</h3>
|
|
57
|
-
<div class="space-y-1">
|
|
58
|
-
<a href="/docs/README.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">README</a>
|
|
59
|
-
<a href="/docs/web-dashboard.html" class="doc-link block px-4 py-2 text-sm font-medium hover:text-white hover:bg-white/5 rounded-lg transition-colors bg-white/5 text-white ring-1 ring-white/5">web dashboard</a>
|
|
60
|
-
<a href="/docs/GETTING-STARTED.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">GETTING STARTED</a>
|
|
61
|
-
<a href="/docs/EXAMPLES.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">EXAMPLES</a>
|
|
62
|
-
<a href="/docs/WORKFLOW-TEMPLATES.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">WORKFLOW TEMPLATES</a>
|
|
63
|
-
<a href="/docs/TROUBLESHOOTING.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">TROUBLESHOOTING</a>
|
|
64
|
-
<a href="/docs/RELEASE_NOTES.html" class="doc-link block px-4 py-2 text-sm font-medium text-gray-400 hover:text-white hover:bg-white/5 rounded-lg transition-colors ">RELEASE_NOTES</a>
|
|
65
|
-
</div>
|
|
66
|
-
</div>
|
|
67
|
-
</aside>
|
|
68
|
-
|
|
69
|
-
<main class="flex-1 lg:pl-72 min-w-0">
|
|
70
|
-
<div class="bg-surface border border-white/10 rounded-xl p-8 backdrop-blur-sm">
|
|
71
|
-
<header class="mb-8 border-b border-white/10 pb-6">
|
|
72
|
-
<h1 class="text-3xl font-bold text-white mb-2">Dev Workflow Web Dashboard</h1>
|
|
73
|
-
<p class="text-gray-400 font-mono text-sm">web-dashboard.md</p>
|
|
74
|
-
</header>
|
|
75
|
-
<article class="prose prose-invert prose-lg max-w-none">
|
|
76
|
-
<p>Learn how to start and use the Dev Workflow dashboard included with the MCP server. The dashboard exposes project history, summaries, and aggregates through a small Node.js service.</p>
|
|
77
|
-
<h2>Prerequisites</h2>
|
|
78
|
-
<p>Before launching the dashboard, confirm the following:</p>
|
|
79
|
-
<ul>
|
|
80
|
-
<li>Node.js 18+ installed (same requirement as the MCP server)</li>
|
|
81
|
-
<li>Project dependencies installed with <code>npm install</code></li>
|
|
82
|
-
<li>Workflow history stored under <code>.state/</code> (created automatically when using the MCP server)</li>
|
|
83
|
-
</ul>
|
|
84
|
-
<blockquote>
|
|
85
|
-
<p><strong>Plesk users:</strong> follow the <a href="../README.md#option-3-install-on-plesk-hosting">Plesk installation guide</a> first and ensure SSH access is enabled.</p>
|
|
86
|
-
</blockquote>
|
|
87
|
-
<h2>Features</h2>
|
|
88
|
-
<ul>
|
|
89
|
-
<li><strong>Task history browser</strong> – Paginated list of completed workflow entries.</li>
|
|
90
|
-
<li><strong>Summary stats</strong> – Counts of tasks by type and recent activity timeline.</li>
|
|
91
|
-
<li><strong>Aggregated trends</strong> – Daily, monthly, or yearly breakdowns of workflow activity.</li>
|
|
92
|
-
<li><strong>Multi-user support</strong> – Switch between user identifiers recorded in the <code>.state</code> directory.</li>
|
|
93
|
-
</ul>
|
|
94
|
-
<h2>Getting Started</h2>
|
|
95
|
-
<p>Launch the dashboard from your project directory:</p>
|
|
96
|
-
<pre><code class="language-bash">npm run web
|
|
97
|
-
</code></pre>
|
|
98
|
-
<p>When the server is ready you will see:</p>
|
|
99
|
-
<pre><code>🌐 Dev Workflow Dashboard running at http://localhost:3111
|
|
100
|
-
</code></pre>
|
|
101
|
-
<p>Open the URL in your browser. If port 3111 is in use, the script automatically selects a nearby free port.</p>
|
|
102
|
-
<h3>Choosing a Port</h3>
|
|
103
|
-
<p>Set <code>DEV_WORKFLOW_WEB_PORT</code> to force a specific port:</p>
|
|
104
|
-
<pre><code class="language-bash">DEV_WORKFLOW_WEB_PORT=5000 npm run web
|
|
105
|
-
</code></pre>
|
|
106
|
-
<h3>Selecting a User</h3>
|
|
107
|
-
<p>The dashboard defaults to the <code>default</code> user. Append <code>?user=<USER_ID></code> to view another user’s data. User IDs map to the subdirectories under <code>.state/users/</code>.</p>
|
|
108
|
-
<pre><code>http://localhost:3111/?user=my-teammate
|
|
109
|
-
</code></pre>
|
|
110
|
-
<h2>Navigation</h2>
|
|
111
|
-
<p>The HTML frontend lives in <code>web/index.html</code>. The default UI includes:</p>
|
|
112
|
-
<ul>
|
|
113
|
-
<li><strong>Summary cards</strong> – Total tasks completed and last active date.</li>
|
|
114
|
-
<li><strong>Recent tasks table</strong> – Paginated entries with task descriptions and timestamps.</li>
|
|
115
|
-
<li><strong>Charts</strong> (if script extensions are enabled) – Visual trends per frequency selection.</li>
|
|
116
|
-
</ul>
|
|
117
|
-
<h2>API Reference</h2>
|
|
118
|
-
<p>Interact with the dashboard programmatically using the JSON endpoints served by <code>web/server.js</code>.</p>
|
|
119
|
-
<h3><code>GET /api/summary</code></h3>
|
|
120
|
-
<p>Returns aggregate statistics for a user.</p>
|
|
121
|
-
<p><strong>Query parameters</strong></p>
|
|
122
|
-
<ul>
|
|
123
|
-
<li><code>user</code> <em>(optional, string)</em> – User identifier (default <code>default</code>).</li>
|
|
124
|
-
</ul>
|
|
125
|
-
<p><strong>Response</strong></p>
|
|
126
|
-
<pre><code class="language-json">{
|
|
127
|
-
"summary": {
|
|
128
|
-
"totalTasks": 12,
|
|
129
|
-
"taskTypes": { "feature": 8, "bugfix": 3, "refactor": 1 },
|
|
130
|
-
"lastActive": "2025-10-01T09:25:41.123Z",
|
|
131
|
-
"recentTasks": [
|
|
132
|
-
{ "description": "feat: add billing webhooks", "type": "feature", "timestamp": "2025-10-01T09:25:41.123Z" }
|
|
133
|
-
],
|
|
134
|
-
"updatedAt": "2025-10-01T09:30:00.000Z"
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
|
-
</code></pre>
|
|
138
|
-
<h3><code>GET /api/history</code></h3>
|
|
139
|
-
<p>Returns paginated task history.</p>
|
|
140
|
-
<p><strong>Query parameters</strong></p>
|
|
141
|
-
<ul>
|
|
142
|
-
<li><code>user</code> <em>(optional, string)</em> – User identifier (default <code>default</code>).</li>
|
|
143
|
-
<li><code>page</code> <em>(optional, number)</em> – Page number (default <code>1</code>).</li>
|
|
144
|
-
<li><code>pageSize</code> <em>(optional, number)</em> – Items per page (default <code>20</code>, max <code>100</code>).</li>
|
|
145
|
-
<li><code>startDate</code> <em>(optional, string)</em> – Filter by ISO date (inclusive).</li>
|
|
146
|
-
<li><code>endDate</code> <em>(optional, string)</em> – Filter by ISO date (inclusive).</li>
|
|
147
|
-
</ul>
|
|
148
|
-
<p><strong>Response</strong></p>
|
|
149
|
-
<pre><code class="language-json">{
|
|
150
|
-
"entries": [
|
|
151
|
-
{
|
|
152
|
-
"id": 42,
|
|
153
|
-
"user_id": "default",
|
|
154
|
-
"task_description": "feat: add reporting endpoint",
|
|
155
|
-
"task_type": "feature",
|
|
156
|
-
"commit_message": "feat: add reporting endpoint",
|
|
157
|
-
"timestamp": "2025-09-30T09:18:00.000Z"
|
|
158
|
-
}
|
|
159
|
-
],
|
|
160
|
-
"total": 42,
|
|
161
|
-
"page": 1,
|
|
162
|
-
"pageSize": 20
|
|
163
|
-
}
|
|
164
|
-
</code></pre>
|
|
165
|
-
<h3><code>GET /api/history-summary</code></h3>
|
|
166
|
-
<p>Returns an array of task counts grouped by period.</p>
|
|
167
|
-
<p><strong>Query parameters</strong></p>
|
|
168
|
-
<ul>
|
|
169
|
-
<li><code>user</code> <em>(optional, string)</em> – User identifier (default <code>default</code>).</li>
|
|
170
|
-
<li><code>frequency</code> <em>(optional, string)</em> – <code>daily</code>, <code>monthly</code>, or <code>yearly</code> (default <code>daily</code>).</li>
|
|
171
|
-
<li><code>startDate</code>, <code>endDate</code> <em>(optional, string)</em> – Limit range by ISO dates.</li>
|
|
172
|
-
</ul>
|
|
173
|
-
<p><strong>Response</strong></p>
|
|
174
|
-
<pre><code class="language-json">{
|
|
175
|
-
"summary": [
|
|
176
|
-
{ "period": "2025-09-30", "count": 3 },
|
|
177
|
-
{ "period": "2025-09-29", "count": 1 }
|
|
178
|
-
]
|
|
179
|
-
}
|
|
180
|
-
</code></pre>
|
|
181
|
-
<h2>Configuration</h2>
|
|
182
|
-
<table>
|
|
183
|
-
<thead>
|
|
184
|
-
<tr>
|
|
185
|
-
<th>Variable</th>
|
|
186
|
-
<th>Description</th>
|
|
187
|
-
<th>Default</th>
|
|
188
|
-
</tr>
|
|
189
|
-
</thead>
|
|
190
|
-
<tbody><tr>
|
|
191
|
-
<td><code>DEV_WORKFLOW_WEB_PORT</code></td>
|
|
192
|
-
<td>Port for the dashboard</td>
|
|
193
|
-
<td><code>3111</code> or next available</td>
|
|
194
|
-
</tr>
|
|
195
|
-
<tr>
|
|
196
|
-
<td><code>DEV_WORKFLOW_USER_ID</code></td>
|
|
197
|
-
<td>User identifier when launching via MCP</td>
|
|
198
|
-
<td>auto-generated</td>
|
|
199
|
-
</tr>
|
|
200
|
-
<tr>
|
|
201
|
-
<td><code>DEV_WORKFLOW_STATE_FILE</code></td>
|
|
202
|
-
<td>Overrides path to workflow state JSON</td>
|
|
203
|
-
<td>auto-detected</td>
|
|
204
|
-
</tr>
|
|
205
|
-
</tbody></table>
|
|
206
|
-
<h2>Troubleshooting</h2>
|
|
207
|
-
<table>
|
|
208
|
-
<thead>
|
|
209
|
-
<tr>
|
|
210
|
-
<th>Symptom</th>
|
|
211
|
-
<th>Fix</th>
|
|
212
|
-
</tr>
|
|
213
|
-
</thead>
|
|
214
|
-
<tbody><tr>
|
|
215
|
-
<td>Server fails with <code>better-sqlite3</code> build error</td>
|
|
216
|
-
<td>Install Python 3 and build tools (Windows) or ensure SQLite build dependencies exist (Linux/macOS).</td>
|
|
217
|
-
</tr>
|
|
218
|
-
<tr>
|
|
219
|
-
<td>Dashboard shows empty data</td>
|
|
220
|
-
<td>Confirm the MCP server has generated <code>.state/users/<user>/workflow-state.json</code> and that the chosen <code>user</code> matches.</td>
|
|
221
|
-
</tr>
|
|
222
|
-
<tr>
|
|
223
|
-
<td>Port already in use</td>
|
|
224
|
-
<td>Set <code>DEV_WORKFLOW_WEB_PORT</code> to a free port before running <code>npm run web</code>.</td>
|
|
225
|
-
</tr>
|
|
226
|
-
</tbody></table>
|
|
227
|
-
<h2>Related Topics</h2>
|
|
228
|
-
<ul>
|
|
229
|
-
<li><a href="../README.md">Main README</a></li>
|
|
230
|
-
<li><a href="./state.md">Workflow State Internals</a> <em>(coming soon)</em></li>
|
|
231
|
-
<li><a href="../README.md#%F0%9F%9B%A0%EF%B8%8F-available-tools">CLI Tools</a></li>
|
|
232
|
-
</ul>
|
|
233
|
-
|
|
234
|
-
</article>
|
|
235
|
-
</div>
|
|
236
|
-
</main>
|
|
237
|
-
</div>
|
|
238
|
-
|
|
239
|
-
<script>
|
|
240
|
-
lucide.createIcons();
|
|
241
|
-
</script>
|
|
242
|
-
</body>
|
|
243
|
-
</html>
|
|
@@ -1,223 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<div class="flex items-center gap-2">
|
|
4
|
-
<img src="/assets/logo.png" alt="Dev Workflow" class="w-8 h-8 rounded-lg">
|
|
5
|
-
<span class="text-lg font-bold">Dev Workflow</span>
|
|
6
|
-
</div>
|
|
7
|
-
<div class="hidden md:flex items-center gap-6">
|
|
8
|
-
<a href="#features" class="text-gray-300 hover:text-white transition">Features</a>
|
|
9
|
-
<a href="#history" class="text-gray-300 hover:text-white transition">History</a>
|
|
10
|
-
<a href="#api" class="text-gray-300 hover:text-white transition">API</a>
|
|
11
|
-
<a href="docs.html?doc=README.md" class="text-gray-300 hover:text-white transition">Docs</a>
|
|
12
|
-
<a href="https://github.com/programinglive/dev-workflow-mcp-server" target="_blank"
|
|
13
|
-
class="flex items-center gap-2 px-4 py-2 bg-white/5 hover:bg-white/10 rounded-lg transition">
|
|
14
|
-
<i data-lucide="github" class="w-4 h-4"></i>
|
|
15
|
-
GitHub
|
|
16
|
-
</a>
|
|
17
|
-
</div>
|
|
18
|
-
<button id="mobileMenuBtn" class="md:hidden p-2 rounded-lg hover:bg-white/5">
|
|
19
|
-
<i data-lucide="menu" class="w-6 h-6"></i>
|
|
20
|
-
</button>
|
|
21
|
-
</div>
|
|
22
|
-
</div>
|
|
23
|
-
<!-- Mobile Menu -->
|
|
24
|
-
<div id="mobileMenu" class="hidden border-t border-white/10 bg-[#0a0a0f]">
|
|
25
|
-
<div class="px-4 py-4 space-y-3">
|
|
26
|
-
<a href="#features" class="block text-gray-300 hover:text-white transition">Features</a>
|
|
27
|
-
<a href="#history" class="block text-gray-300 hover:text-white transition">History</a>
|
|
28
|
-
<a href="#api" class="block text-gray-300 hover:text-white transition">API</a>
|
|
29
|
-
<a href="docs.html?doc=README.md" class="block text-gray-300 hover:text-white transition">Docs</a>
|
|
30
|
-
<a href="https://github.com/programinglive/dev-workflow-mcp-server" target="_blank"
|
|
31
|
-
class="flex items-center gap-2 text-gray-300 hover:text-white transition">
|
|
32
|
-
<i data-lucide="github" class="w-4 h-4"></i>
|
|
33
|
-
GitHub
|
|
34
|
-
</a>
|
|
35
|
-
</div>
|
|
36
|
-
</div>
|
|
37
|
-
</nav>
|
|
38
|
-
|
|
39
|
-
<!-- Hero Section -->
|
|
40
|
-
<section class="min-h-screen flex items-center justify-center px-4 pt-16 relative overflow-hidden">
|
|
41
|
-
<div class="absolute inset-0 bg-gradient-to-br from-indigo-500/10 via-purple-500/10 to-pink-500/10"></div>
|
|
42
|
-
<div class="max-w-7xl mx-auto grid lg:grid-cols-2 gap-12 items-center relative z-10">
|
|
43
|
-
<!-- Left Column - Content -->
|
|
44
|
-
<div>
|
|
45
|
-
<div class="animate-fade-in-up" style="animation-delay: 0.1s;">
|
|
46
|
-
<div
|
|
47
|
-
class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-emerald-500/10 border border-emerald-500/20 text-emerald-400 text-sm mb-8">
|
|
48
|
-
<span class="w-1.5 h-1.5 rounded-full bg-emerald-500 animate-pulse"></span>
|
|
49
|
-
<span id="versionBadge">v1.3.12 - Active</span>
|
|
50
|
-
</div>
|
|
51
|
-
</div>
|
|
52
|
-
|
|
53
|
-
<h1 class="text-5xl md:text-6xl lg:text-7xl font-bold mb-6 leading-tight animate-fade-in-up"
|
|
54
|
-
style="animation-delay: 0.2s;">
|
|
55
|
-
Master Your<br><span
|
|
56
|
-
class="bg-gradient-to-r from-indigo-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">Workflow</span>
|
|
57
|
-
</h1>
|
|
58
|
-
<p class="text-lg md:text-xl text-gray-400 mb-8 max-w-xl animate-fade-in-up" style="animation-delay: 0.3s;">
|
|
59
|
-
An MCP server that acts as your coding conscience. Enforce test-driven development, ensure documentation, and
|
|
60
|
-
never skip a step in your release process.
|
|
61
|
-
</p>
|
|
62
|
-
<div class="flex flex-col sm:flex-row gap-4 mb-8 animate-fade-in-up" style="animation-delay: 0.4s;">
|
|
63
|
-
<a href="#history"
|
|
64
|
-
class="px-6 py-3 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition inline-flex items-center justify-center gap-2">
|
|
65
|
-
View History <i data-lucide="arrow-right" class="w-4 h-4"></i>
|
|
66
|
-
</a>
|
|
67
|
-
<a href="docs.html?doc=README.md"
|
|
68
|
-
class="px-6 py-3 bg-white/5 border border-white/10 rounded-lg font-semibold hover:bg-white/10 transition text-center">
|
|
69
|
-
Documentation
|
|
70
|
-
</a>
|
|
71
|
-
</div>
|
|
72
|
-
<div class="flex items-center gap-8 text-sm animate-fade-in-up" style="animation-delay: 0.5s;">
|
|
73
|
-
<div>
|
|
74
|
-
<div class="text-2xl font-bold" id="versionNum">1.3.12</div>
|
|
75
|
-
<div class="text-gray-500">Latest Version</div>
|
|
76
|
-
</div>
|
|
77
|
-
<div>
|
|
78
|
-
<div class="text-2xl font-bold">MIT</div>
|
|
79
|
-
<div class="text-gray-500">License</div>
|
|
80
|
-
</div>
|
|
81
|
-
<div>
|
|
82
|
-
<div class="text-2xl font-bold">Node 18+</div>
|
|
83
|
-
<div class="text-gray-500">Compatibility</div>
|
|
84
|
-
</div>
|
|
85
|
-
</div>
|
|
86
|
-
</div>
|
|
87
|
-
<!-- Right Column - Terminal -->
|
|
88
|
-
<div class="hidden lg:block">
|
|
89
|
-
<div class="relative">
|
|
90
|
-
<div class="absolute inset-0 bg-gradient-to-r from-indigo-500/20 to-purple-500/20 blur-3xl"></div>
|
|
91
|
-
<div class="relative bg-[#1a1a24] rounded-xl border border-white/10 p-6 shadow-2xl">
|
|
92
|
-
<div class="flex items-center gap-2 mb-4">
|
|
93
|
-
<div class="w-3 h-3 rounded-full bg-red-500"></div>
|
|
94
|
-
<div class="w-3 h-3 rounded-full bg-yellow-500"></div>
|
|
95
|
-
<div class="w-3 h-3 rounded-full bg-green-500"></div>
|
|
96
|
-
<span class="ml-auto text-xs text-gray-500">terminal</span>
|
|
97
|
-
</div>
|
|
98
|
-
<div class="font-mono text-sm space-y-2" id="terminalContent">
|
|
99
|
-
<!-- Content will be generated by JS -->
|
|
100
|
-
</div>
|
|
101
|
-
</div>
|
|
102
|
-
</div>
|
|
103
|
-
</div>
|
|
104
|
-
</div>
|
|
105
|
-
</section>
|
|
106
|
-
|
|
107
|
-
<!-- Features Section -->
|
|
108
|
-
<section id="features" class="py-20 px-4">
|
|
109
|
-
<div class="max-w-7xl mx-auto">
|
|
110
|
-
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Your Coding Conscience</h2>
|
|
111
|
-
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
112
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
113
|
-
<div class="w-12 h-12 rounded-lg bg-indigo-500/20 flex items-center justify-center mb-4">
|
|
114
|
-
<i data-lucide="shield-check" class="w-6 h-6 text-indigo-400"></i>
|
|
115
|
-
</div>
|
|
116
|
-
<h3 class="text-xl font-semibold mb-2">Enforced Discipline</h3>
|
|
117
|
-
<p class="text-gray-400">Won't let you skip important steps. Follows a strict, proven development workflow.
|
|
118
|
-
</p>
|
|
119
|
-
</div>
|
|
120
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
121
|
-
<div class="w-12 h-12 rounded-lg bg-purple-500/20 flex items-center justify-center mb-4">
|
|
122
|
-
<i data-lucide="test-tube" class="w-6 h-6 text-purple-400"></i>
|
|
123
|
-
</div>
|
|
124
|
-
<h3 class="text-xl font-semibold mb-2">Test-Driven</h3>
|
|
125
|
-
<p class="text-gray-400">Blocks commits if tests fail. Encourages writing tests before marking tasks complete.
|
|
126
|
-
</p>
|
|
127
|
-
</div>
|
|
128
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
129
|
-
<div class="w-12 h-12 rounded-lg bg-emerald-500/20 flex items-center justify-center mb-4">
|
|
130
|
-
<i data-lucide="file-text" class="w-6 h-6 text-emerald-400"></i>
|
|
131
|
-
</div>
|
|
132
|
-
<h3 class="text-xl font-semibold mb-2">Documentation</h3>
|
|
133
|
-
<p class="text-gray-400">Reminds you to update documentation (README, docs, changelog) for every change.</p>
|
|
134
|
-
</div>
|
|
135
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
136
|
-
<div class="w-12 h-12 rounded-lg bg-orange-500/20 flex items-center justify-center mb-4">
|
|
137
|
-
<i data-lucide="git-branch" class="w-6 h-6 text-orange-400"></i>
|
|
138
|
-
</div>
|
|
139
|
-
<h3 class="text-xl font-semibold mb-2">State Tracking</h3>
|
|
140
|
-
<p class="text-gray-400">Remembers exactly where you are in the workflow, even across sessions.</p>
|
|
141
|
-
</div>
|
|
142
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
143
|
-
<div class="w-12 h-12 rounded-lg bg-blue-500/20 flex items-center justify-center mb-4">
|
|
144
|
-
<i data-lucide="history" class="w-6 h-6 text-blue-400"></i>
|
|
145
|
-
</div>
|
|
146
|
-
<h3 class="text-xl font-semibold mb-2">Task History</h3>
|
|
147
|
-
<p class="text-gray-400">Keeps a detailed log of all completed tasks, commits, and releases.</p>
|
|
148
|
-
</div>
|
|
149
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10 hover:bg-white/10 transition">
|
|
150
|
-
<div class="w-12 h-12 rounded-lg bg-pink-500/20 flex items-center justify-center mb-4">
|
|
151
|
-
<i data-lucide="zap" class="w-6 h-6 text-pink-400"></i>
|
|
152
|
-
</div>
|
|
153
|
-
<h3 class="text-xl font-semibold mb-2">Smart Prompts</h3>
|
|
154
|
-
<p class="text-gray-400">Provides quick reminders and guidance on best practices as you work.</p>
|
|
155
|
-
</div>
|
|
156
|
-
</div>
|
|
157
|
-
</div>
|
|
158
|
-
</section>
|
|
159
|
-
|
|
160
|
-
<!-- History Section -->
|
|
161
|
-
<section id="history" class="py-20 px-4 bg-white/5">
|
|
162
|
-
<div class="max-w-7xl mx-auto">
|
|
163
|
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">Workflow History</h2>
|
|
164
|
-
<p class="text-gray-400 mb-12">Track your development progress and analyze your workflow patterns.</p>
|
|
165
|
-
<div class="bg-[#0a0a0f] rounded-xl border border-white/10 p-6">
|
|
166
|
-
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6">
|
|
167
|
-
<input type="text" id="userId" placeholder="User ID"
|
|
168
|
-
class="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 text-white">
|
|
169
|
-
<input type="date" id="startDate"
|
|
170
|
-
class="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 [color-scheme:dark]">
|
|
171
|
-
<input type="date" id="endDate"
|
|
172
|
-
class="px-4 py-2 bg-white/5 border border-white/10 rounded-lg focus:outline-none focus:ring-2 focus:ring-indigo-500 [color-scheme:dark]">
|
|
173
|
-
<button id="applyFiltersBtn"
|
|
174
|
-
class="px-4 py-2 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg font-semibold hover:shadow-lg hover:shadow-indigo-500/50 transition">Apply
|
|
175
|
-
Filters</button>
|
|
176
|
-
</div>
|
|
177
|
-
<div id="summarySection" class="hidden mb-6">
|
|
178
|
-
<h3 class="text-lg font-semibold mb-4">Project Summary</h3>
|
|
179
|
-
<div id="summaryContent" class="text-gray-400"></div>
|
|
180
|
-
</div>
|
|
181
|
-
<div id="historySection" class="hidden">
|
|
182
|
-
<h3 class="text-lg font-semibold mb-4">Recent History</h3>
|
|
183
|
-
<div id="historyContent" class="space-y-3"></div>
|
|
184
|
-
<div id="paginationControls" class="flex items-center justify-between mt-6 hidden">
|
|
185
|
-
<button id="prevPageBtn"
|
|
186
|
-
class="px-4 py-2 bg-white/5 border border-white/10 rounded-lg hover:bg-white/10 disabled:opacity-50">Previous</button>
|
|
187
|
-
<span id="pageInfo" class="text-sm text-gray-400"></span>
|
|
188
|
-
<button id="nextPageBtn"
|
|
189
|
-
class="px-4 py-2 bg-white/5 border border-white/10 rounded-lg hover:bg-white/10 disabled:opacity-50">Next</button>
|
|
190
|
-
</div>
|
|
191
|
-
</div>
|
|
192
|
-
</div>
|
|
193
|
-
</div>
|
|
194
|
-
</section>
|
|
195
|
-
|
|
196
|
-
<!-- API Section -->
|
|
197
|
-
<section id="api" class="py-20 px-4">
|
|
198
|
-
<div class="max-w-7xl mx-auto">
|
|
199
|
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">API Reference</h2>
|
|
200
|
-
<p class="text-gray-400 mb-12">Query workflow data programmatically with our JSON API.</p>
|
|
201
|
-
<div class="grid md:grid-cols-2 gap-6">
|
|
202
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10">
|
|
203
|
-
<code class="text-indigo-400 font-mono text-sm">GET /api/history</code>
|
|
204
|
-
<p class="text-gray-400 mt-2">Retrieve paginated task history entries.</p>
|
|
205
|
-
</div>
|
|
206
|
-
<div class="p-6 rounded-xl bg-white/5 border border-white/10">
|
|
207
|
-
<code class="text-indigo-400 font-mono text-sm">GET /api/summary</code>
|
|
208
|
-
<p class="text-gray-400 mt-2">Get project health stats and recent tasks.</p>
|
|
209
|
-
</div>
|
|
210
|
-
</div>
|
|
211
|
-
</div>
|
|
212
|
-
</section>
|
|
213
|
-
|
|
214
|
-
<!-- Footer -->
|
|
215
|
-
<footer class="py-12 px-4 border-t border-white/10">
|
|
216
|
-
<div class="max-w-7xl mx-auto text-center text-gray-400">
|
|
217
|
-
<p>Built with ❤️ for developers who care about quality</p>
|
|
218
|
-
</div>
|
|
219
|
-
</footer>
|
|
220
|
-
<script src="/main.js"></script>
|
|
221
|
-
</body>
|
|
222
|
-
|
|
223
|
-
</html>
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
@tailwind base;
|
|
2
|
-
@tailwind components;
|
|
3
|
-
@tailwind utilities;
|
|
4
|
-
|
|
5
|
-
@layer utilities {
|
|
6
|
-
@keyframes fadeInUp {
|
|
7
|
-
0% {
|
|
8
|
-
opacity: 0;
|
|
9
|
-
transform: translateY(20px);
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
100% {
|
|
13
|
-
opacity: 1;
|
|
14
|
-
transform: translateY(0px);
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
@keyframes fadeInRight {
|
|
19
|
-
0% {
|
|
20
|
-
opacity: 0;
|
|
21
|
-
transform: translateY(-50%) translateX(40px);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
100% {
|
|
25
|
-
opacity: 1;
|
|
26
|
-
transform: translateY(-50%) translateX(0px);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
@keyframes fadeIn {
|
|
31
|
-
0% {
|
|
32
|
-
opacity: 0;
|
|
33
|
-
transform: translateX(-10px);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
100% {
|
|
37
|
-
opacity: 1;
|
|
38
|
-
transform: translateX(0px);
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
.animate-fade-in-up {
|
|
43
|
-
animation: fadeInUp 0.8s ease-out forwards;
|
|
44
|
-
opacity: 0;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.animate-fade-in-right {
|
|
48
|
-
animation: fadeInRight 0.8s ease-out forwards;
|
|
49
|
-
opacity: 0;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.terminal-line {
|
|
53
|
-
opacity: 0;
|
|
54
|
-
display: flex;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
.terminal-line.visible {
|
|
58
|
-
opacity: 1;
|
|
59
|
-
transition: opacity 0.1s;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.typing-cursor::after {
|
|
63
|
-
content: '▋';
|
|
64
|
-
animation: blink 1s step-end infinite;
|
|
65
|
-
margin-left: 4px;
|
|
66
|
-
color: #a855f7;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
@keyframes blink {
|
|
70
|
-
|
|
71
|
-
0%,
|
|
72
|
-
100% {
|
|
73
|
-
opacity: 1;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
50% {
|
|
77
|
-
opacity: 0;
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
}
|