@ryanfw/prompt-orchestration-pipeline 0.0.1 → 0.3.0

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.
Files changed (76) hide show
  1. package/README.md +415 -24
  2. package/package.json +45 -8
  3. package/src/api/files.js +48 -0
  4. package/src/api/index.js +149 -53
  5. package/src/api/validators/seed.js +141 -0
  6. package/src/cli/index.js +456 -29
  7. package/src/cli/run-orchestrator.js +39 -0
  8. package/src/cli/update-pipeline-json.js +47 -0
  9. package/src/components/DAGGrid.jsx +649 -0
  10. package/src/components/JobCard.jsx +96 -0
  11. package/src/components/JobDetail.jsx +159 -0
  12. package/src/components/JobTable.jsx +202 -0
  13. package/src/components/Layout.jsx +134 -0
  14. package/src/components/TaskFilePane.jsx +570 -0
  15. package/src/components/UploadSeed.jsx +239 -0
  16. package/src/components/ui/badge.jsx +20 -0
  17. package/src/components/ui/button.jsx +43 -0
  18. package/src/components/ui/card.jsx +20 -0
  19. package/src/components/ui/focus-styles.css +60 -0
  20. package/src/components/ui/progress.jsx +26 -0
  21. package/src/components/ui/select.jsx +27 -0
  22. package/src/components/ui/separator.jsx +6 -0
  23. package/src/config/paths.js +99 -0
  24. package/src/core/config.js +270 -9
  25. package/src/core/file-io.js +202 -0
  26. package/src/core/module-loader.js +157 -0
  27. package/src/core/orchestrator.js +275 -294
  28. package/src/core/pipeline-runner.js +95 -41
  29. package/src/core/progress.js +66 -0
  30. package/src/core/status-writer.js +331 -0
  31. package/src/core/task-runner.js +719 -73
  32. package/src/core/validation.js +120 -1
  33. package/src/lib/utils.js +6 -0
  34. package/src/llm/README.md +139 -30
  35. package/src/llm/index.js +222 -72
  36. package/src/pages/PipelineDetail.jsx +111 -0
  37. package/src/pages/PromptPipelineDashboard.jsx +223 -0
  38. package/src/providers/deepseek.js +3 -15
  39. package/src/ui/client/adapters/job-adapter.js +258 -0
  40. package/src/ui/client/bootstrap.js +120 -0
  41. package/src/ui/client/hooks/useJobDetailWithUpdates.js +619 -0
  42. package/src/ui/client/hooks/useJobList.js +50 -0
  43. package/src/ui/client/hooks/useJobListWithUpdates.js +335 -0
  44. package/src/ui/client/hooks/useTicker.js +26 -0
  45. package/src/ui/client/index.css +31 -0
  46. package/src/ui/client/index.html +18 -0
  47. package/src/ui/client/main.jsx +38 -0
  48. package/src/ui/config-bridge.browser.js +149 -0
  49. package/src/ui/config-bridge.js +149 -0
  50. package/src/ui/config-bridge.node.js +310 -0
  51. package/src/ui/dist/assets/index-BDABnI-4.js +33399 -0
  52. package/src/ui/dist/assets/style-Ks8LY8gB.css +28496 -0
  53. package/src/ui/dist/index.html +19 -0
  54. package/src/ui/endpoints/job-endpoints.js +300 -0
  55. package/src/ui/file-reader.js +216 -0
  56. package/src/ui/job-change-detector.js +83 -0
  57. package/src/ui/job-index.js +231 -0
  58. package/src/ui/job-reader.js +274 -0
  59. package/src/ui/job-scanner.js +188 -0
  60. package/src/ui/public/app.js +3 -1
  61. package/src/ui/server.js +1636 -59
  62. package/src/ui/sse-enhancer.js +149 -0
  63. package/src/ui/sse.js +204 -0
  64. package/src/ui/state-snapshot.js +252 -0
  65. package/src/ui/transformers/list-transformer.js +347 -0
  66. package/src/ui/transformers/status-transformer.js +307 -0
  67. package/src/ui/watcher.js +61 -7
  68. package/src/utils/dag.js +101 -0
  69. package/src/utils/duration.js +126 -0
  70. package/src/utils/id-generator.js +30 -0
  71. package/src/utils/jobs.js +7 -0
  72. package/src/utils/pipelines.js +44 -0
  73. package/src/utils/task-files.js +271 -0
  74. package/src/utils/ui.jsx +76 -0
  75. package/src/ui/public/index.html +0 -53
  76. package/src/ui/public/style.css +0 -341
@@ -0,0 +1,76 @@
1
+ import React from "react";
2
+ import { Badge } from "../components/ui/badge.jsx";
3
+ import { CheckCircle2, Loader2, AlertTriangle, Circle } from "lucide-react";
4
+
5
+ export const statusBadge = (status) => {
6
+ switch (status) {
7
+ case "running":
8
+ return (
9
+ <Badge variant="info" aria-label="Running">
10
+ Running
11
+ </Badge>
12
+ );
13
+ case "failed":
14
+ return (
15
+ <Badge variant="error" aria-label="Failed">
16
+ Failed
17
+ </Badge>
18
+ );
19
+ case "completed":
20
+ case "complete":
21
+ return (
22
+ <Badge variant="success" aria-label="Completed">
23
+ Completed
24
+ </Badge>
25
+ );
26
+ case "pending":
27
+ return (
28
+ <Badge variant="default" aria-label="Pending">
29
+ Pending
30
+ </Badge>
31
+ );
32
+ default:
33
+ return null;
34
+ }
35
+ };
36
+
37
+ export const taskStatusIcon = (state) => {
38
+ switch (state) {
39
+ case "completed":
40
+ case "complete":
41
+ return <CheckCircle2 className="h-4 w-4 text-success" aria-hidden />;
42
+ case "running":
43
+ return <Loader2 className="h-4 w-4 animate-spin text-info" aria-hidden />;
44
+ case "failed":
45
+ return <AlertTriangle className="h-4 w-4 text-destructive" aria-hidden />;
46
+ default:
47
+ return <Circle className="h-4 w-4 text-slate-500" aria-hidden />;
48
+ }
49
+ };
50
+
51
+ export const progressClasses = (status) => {
52
+ switch (status) {
53
+ case "running":
54
+ return "bg-info/20 [&>div]:bg-info";
55
+ case "failed":
56
+ return "bg-destructive/20 [&>div]:bg-destructive";
57
+ case "completed":
58
+ return "bg-success/20 [&>div]:bg-success";
59
+ default:
60
+ return "bg-muted [&>div]:bg-muted-foreground";
61
+ }
62
+ };
63
+
64
+ export const barColorForState = (state) => {
65
+ switch (state) {
66
+ case "running":
67
+ return "bg-info";
68
+ case "failed":
69
+ return "bg-destructive";
70
+ case "completed":
71
+ case "complete":
72
+ return "bg-success";
73
+ default:
74
+ return "bg-muted-foreground";
75
+ }
76
+ };
@@ -1,53 +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>Pipeline Orchestrator - File Watcher</title>
7
- <link rel="stylesheet" href="/style.css" />
8
- </head>
9
- <body>
10
- <div class="container">
11
- <header>
12
- <h1>Pipeline Orchestrator</h1>
13
- <div class="connection-status" id="connectionStatus">
14
- <span class="status-dot"></span>
15
- <span class="status-text">Connecting...</span>
16
- </div>
17
- </header>
18
-
19
- <main>
20
- <section class="stats-section">
21
- <div class="stat-card">
22
- <div class="stat-label">Total Changes</div>
23
- <div class="stat-value" id="changeCount">0</div>
24
- </div>
25
- <div class="stat-card">
26
- <div class="stat-label">Last Updated</div>
27
- <div class="stat-value stat-time" id="updatedAt">Never</div>
28
- </div>
29
- </section>
30
-
31
- <section class="changes-section">
32
- <h2>Recent Changes</h2>
33
- <div class="watched-paths" id="watchedPaths">
34
- <span class="label">Watching:</span>
35
- <span class="paths">Loading...</span>
36
- </div>
37
- <div class="changes-list" id="changesList">
38
- <div class="empty-state">
39
- No changes yet. Modify files in watched directories to see
40
- updates.
41
- </div>
42
- </div>
43
- </section>
44
- </main>
45
-
46
- <footer>
47
- <p>Watching for file changes in real-time via Server-Sent Events</p>
48
- </footer>
49
- </div>
50
-
51
- <script src="/app.js"></script>
52
- </body>
53
- </html>
@@ -1,341 +0,0 @@
1
- /**
2
- * Pipeline Orchestrator UI Styles
3
- * Modern, clean, dark-mode friendly design
4
- */
5
-
6
- :root {
7
- --bg-primary: #0f172a;
8
- --bg-secondary: #1e293b;
9
- --bg-tertiary: #334155;
10
- --text-primary: #f1f5f9;
11
- --text-secondary: #cbd5e1;
12
- --text-muted: #94a3b8;
13
- --border-color: #334155;
14
- --accent-blue: #3b82f6;
15
- --accent-green: #10b981;
16
- --accent-yellow: #f59e0b;
17
- --accent-red: #ef4444;
18
- --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
19
- }
20
-
21
- * {
22
- margin: 0;
23
- padding: 0;
24
- box-sizing: border-box;
25
- }
26
-
27
- body {
28
- font-family:
29
- -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
30
- Arial, sans-serif;
31
- background: var(--bg-primary);
32
- color: var(--text-primary);
33
- line-height: 1.6;
34
- min-height: 100vh;
35
- }
36
-
37
- .container {
38
- max-width: 1200px;
39
- margin: 0 auto;
40
- padding: 2rem;
41
- }
42
-
43
- /* Header */
44
- header {
45
- display: flex;
46
- justify-content: space-between;
47
- align-items: center;
48
- margin-bottom: 3rem;
49
- padding-bottom: 1.5rem;
50
- border-bottom: 2px solid var(--border-color);
51
- }
52
-
53
- h1 {
54
- font-size: 2rem;
55
- font-weight: 700;
56
- color: var(--text-primary);
57
- }
58
-
59
- h2 {
60
- font-size: 1.5rem;
61
- font-weight: 600;
62
- margin-bottom: 1rem;
63
- color: var(--text-primary);
64
- }
65
-
66
- /* Connection Status */
67
- .connection-status {
68
- display: flex;
69
- align-items: center;
70
- gap: 0.5rem;
71
- padding: 0.5rem 1rem;
72
- background: var(--bg-secondary);
73
- border-radius: 0.5rem;
74
- border: 1px solid var(--border-color);
75
- }
76
-
77
- .status-dot {
78
- width: 10px;
79
- height: 10px;
80
- border-radius: 50%;
81
- background: var(--text-muted);
82
- animation: pulse 2s ease-in-out infinite;
83
- }
84
-
85
- .status-dot.connected {
86
- background: var(--accent-green);
87
- animation: none;
88
- }
89
-
90
- .status-dot.reconnecting {
91
- background: var(--accent-yellow);
92
- }
93
-
94
- .status-dot.disconnected {
95
- background: var(--accent-red);
96
- animation: none;
97
- }
98
-
99
- .status-text {
100
- font-size: 0.875rem;
101
- font-weight: 500;
102
- color: var(--text-secondary);
103
- }
104
-
105
- @keyframes pulse {
106
- 0%,
107
- 100% {
108
- opacity: 1;
109
- }
110
- 50% {
111
- opacity: 0.5;
112
- }
113
- }
114
-
115
- /* Stats Section */
116
- .stats-section {
117
- display: grid;
118
- grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
119
- gap: 1.5rem;
120
- margin-bottom: 3rem;
121
- }
122
-
123
- .stat-card {
124
- background: var(--bg-secondary);
125
- padding: 2rem;
126
- border-radius: 0.75rem;
127
- border: 1px solid var(--border-color);
128
- box-shadow: var(--shadow);
129
- transition:
130
- transform 0.2s ease,
131
- box-shadow 0.2s ease;
132
- }
133
-
134
- .stat-card:hover {
135
- transform: translateY(-2px);
136
- box-shadow: 0 8px 12px -2px rgba(0, 0, 0, 0.4);
137
- }
138
-
139
- .stat-label {
140
- font-size: 0.875rem;
141
- font-weight: 500;
142
- color: var(--text-muted);
143
- text-transform: uppercase;
144
- letter-spacing: 0.05em;
145
- margin-bottom: 0.5rem;
146
- }
147
-
148
- .stat-value {
149
- font-size: 3rem;
150
- font-weight: 700;
151
- color: var(--accent-blue);
152
- line-height: 1;
153
- }
154
-
155
- .stat-value.stat-time {
156
- font-size: 1.5rem;
157
- color: var(--text-primary);
158
- }
159
-
160
- /* Changes Section */
161
- .changes-section {
162
- background: var(--bg-secondary);
163
- padding: 2rem;
164
- border-radius: 0.75rem;
165
- border: 1px solid var(--border-color);
166
- box-shadow: var(--shadow);
167
- }
168
-
169
- .watched-paths {
170
- display: flex;
171
- align-items: center;
172
- gap: 0.5rem;
173
- margin-bottom: 1.5rem;
174
- padding: 0.75rem 1rem;
175
- background: var(--bg-tertiary);
176
- border-radius: 0.5rem;
177
- font-size: 0.875rem;
178
- }
179
-
180
- .watched-paths .label {
181
- font-weight: 600;
182
- color: var(--text-secondary);
183
- }
184
-
185
- .watched-paths .paths {
186
- color: var(--accent-blue);
187
- font-family: "Monaco", "Courier New", monospace;
188
- }
189
-
190
- /* Changes List */
191
- .changes-list {
192
- display: flex;
193
- flex-direction: column;
194
- gap: 0.75rem;
195
- }
196
-
197
- .empty-state {
198
- padding: 3rem 2rem;
199
- text-align: center;
200
- color: var(--text-muted);
201
- font-size: 0.875rem;
202
- }
203
-
204
- .change-item {
205
- background: var(--bg-tertiary);
206
- padding: 1rem;
207
- border-radius: 0.5rem;
208
- border: 1px solid var(--border-color);
209
- transition:
210
- background 0.2s ease,
211
- transform 0.2s ease;
212
- animation: slideIn 0.3s ease;
213
- }
214
-
215
- .change-item:hover {
216
- background: #3f4b5e;
217
- transform: translateX(4px);
218
- }
219
-
220
- @keyframes slideIn {
221
- from {
222
- opacity: 0;
223
- transform: translateY(-10px);
224
- }
225
- to {
226
- opacity: 1;
227
- transform: translateY(0);
228
- }
229
- }
230
-
231
- .change-header {
232
- display: flex;
233
- justify-content: space-between;
234
- align-items: center;
235
- margin-bottom: 0.5rem;
236
- }
237
-
238
- .change-type {
239
- display: inline-block;
240
- padding: 0.25rem 0.75rem;
241
- border-radius: 0.25rem;
242
- font-size: 0.75rem;
243
- font-weight: 600;
244
- text-transform: uppercase;
245
- letter-spacing: 0.05em;
246
- }
247
-
248
- .change-type-created {
249
- background: rgba(16, 185, 129, 0.2);
250
- color: var(--accent-green);
251
- }
252
-
253
- .change-type-modified {
254
- background: rgba(59, 130, 246, 0.2);
255
- color: var(--accent-blue);
256
- }
257
-
258
- .change-type-deleted {
259
- background: rgba(239, 68, 68, 0.2);
260
- color: var(--accent-red);
261
- }
262
-
263
- .change-time {
264
- font-size: 0.75rem;
265
- color: var(--text-muted);
266
- cursor: help;
267
- }
268
-
269
- .change-path {
270
- font-family: "Monaco", "Courier New", monospace;
271
- font-size: 0.875rem;
272
- color: var(--text-secondary);
273
- word-break: break-all;
274
- }
275
-
276
- /* Footer */
277
- footer {
278
- margin-top: 3rem;
279
- padding-top: 2rem;
280
- border-top: 1px solid var(--border-color);
281
- text-align: center;
282
- color: var(--text-muted);
283
- font-size: 0.875rem;
284
- }
285
-
286
- /* Responsive Design */
287
- @media (max-width: 768px) {
288
- .container {
289
- padding: 1rem;
290
- }
291
-
292
- header {
293
- flex-direction: column;
294
- gap: 1rem;
295
- align-items: flex-start;
296
- }
297
-
298
- h1 {
299
- font-size: 1.5rem;
300
- }
301
-
302
- .stats-section {
303
- grid-template-columns: 1fr;
304
- }
305
-
306
- .stat-value {
307
- font-size: 2.5rem;
308
- }
309
-
310
- .watched-paths {
311
- flex-direction: column;
312
- align-items: flex-start;
313
- }
314
- }
315
-
316
- /* Accessibility */
317
- @media (prefers-reduced-motion: reduce) {
318
- * {
319
- animation-duration: 0.01ms !important;
320
- animation-iteration-count: 1 !important;
321
- transition-duration: 0.01ms !important;
322
- }
323
- }
324
-
325
- /* Light mode support (optional) */
326
- @media (prefers-color-scheme: light) {
327
- :root {
328
- --bg-primary: #f8fafc;
329
- --bg-secondary: #ffffff;
330
- --bg-tertiary: #f1f5f9;
331
- --text-primary: #0f172a;
332
- --text-secondary: #475569;
333
- --text-muted: #64748b;
334
- --border-color: #e2e8f0;
335
- --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
336
- }
337
-
338
- .change-item:hover {
339
- background: #e2e8f0;
340
- }
341
- }