fraim 2.0.161 β 2.0.162
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/dist/src/ai-hub/conversation-store.js +164 -0
- package/dist/src/ai-hub/desktop-main.js +24 -1
- package/dist/src/ai-hub/hosts.js +383 -27
- package/dist/src/ai-hub/managed-browser.js +269 -0
- package/dist/src/ai-hub/manager-turns.js +13 -0
- package/dist/src/ai-hub/preferences.js +10 -1
- package/dist/src/ai-hub/server.js +1227 -65
- package/dist/src/cli/commands/init-project.js +7 -1
- package/dist/src/cli/utils/agent-adapters.js +1 -1
- package/dist/src/core/fraim-config-schema.generated.js +50 -13
- package/dist/src/local-mcp-server/agent-token-prices.js +23 -0
- package/dist/src/local-mcp-server/learning-context-builder.js +438 -2
- package/dist/src/local-mcp-server/stdio-server.js +45 -6
- package/package.json +5 -4
- package/public/ai-hub/index.html +456 -7
- package/public/ai-hub/review.css +354 -0
- package/public/ai-hub/script.js +5945 -1279
- package/public/ai-hub/styles.css +1805 -16
package/public/ai-hub/index.html
CHANGED
|
@@ -6,12 +6,197 @@
|
|
|
6
6
|
<meta name="color-scheme" content="light dark">
|
|
7
7
|
<title>FRAIM AI Hub</title>
|
|
8
8
|
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect width='48' height='48' rx='10' fill='%233d8a6e'/%3E%3Ctext x='24' y='32' text-anchor='middle' font-family='Helvetica,Arial,sans-serif' font-size='22' font-weight='700' fill='white'%3EH%3C/text%3E%3C/svg%3E">
|
|
9
|
-
<!-- Detect Electron before CSS paints so
|
|
10
|
-
|
|
9
|
+
<!-- Detect Electron + host platform before CSS paints so html.electron / html.mac /
|
|
10
|
+
html.win / html.linux rules apply on first render (no flash, correct native chrome). -->
|
|
11
|
+
<script>(function(){var h=document.documentElement,ua=navigator.userAgent;if(/Electron/.test(ua))h.classList.add('electron');var p=(navigator.userAgentData&&navigator.userAgentData.platform)||navigator.platform||'';if(/mac/i.test(p)||/Mac|iPhone|iPad|iPod/.test(ua))h.classList.add('mac');else if(/win/i.test(p)||/Windows/.test(ua))h.classList.add('win');else if(/linux/i.test(p)||/Linux|X11/.test(ua))h.classList.add('linux');})();</script>
|
|
11
12
|
<link rel="stylesheet" href="./styles.css">
|
|
13
|
+
<link rel="stylesheet" href="./review.css">
|
|
12
14
|
</head>
|
|
13
15
|
<body>
|
|
14
16
|
|
|
17
|
+
<!-- Issue #512: First-run "Get started" rail (self-dismissing). Hidden by
|
|
18
|
+
default; shown by JS when bootstrap.firstRun is incomplete and surface=hub. -->
|
|
19
|
+
<div id="gs-rail" class="gs-rail" hidden>
|
|
20
|
+
<span class="gs-rocket">π</span>
|
|
21
|
+
<div class="gs-steps" id="gs-steps"></div>
|
|
22
|
+
<button class="gs-cta" id="gs-cta" type="button">Continue setup β</button>
|
|
23
|
+
<button class="gs-hide" id="gs-hide" type="button" title="Hide β it'll wait in the corner">β</button>
|
|
24
|
+
</div>
|
|
25
|
+
<button id="gs-pill" class="gs-pill" type="button" hidden>π Finish setup</button>
|
|
26
|
+
|
|
27
|
+
<!-- Issue #512: three-area top nav + account menu (surface=hub only). -->
|
|
28
|
+
<nav class="hub-tabs" id="hub-tabs" hidden>
|
|
29
|
+
<button class="hub-tab" type="button" data-area="company">Company</button>
|
|
30
|
+
<button class="hub-tab" type="button" data-area="manager">Manager</button>
|
|
31
|
+
<button class="hub-tab on" type="button" data-area="projects">Projects</button>
|
|
32
|
+
<div class="nav-right">
|
|
33
|
+
<button class="avatar-btn" id="avatar-btn" type="button" title="Account & settings">SM</button>
|
|
34
|
+
<div id="account-menu" class="account-menu">
|
|
35
|
+
<div class="am-header">
|
|
36
|
+
<div class="am-av" id="am-av">SM</div>
|
|
37
|
+
<div>
|
|
38
|
+
<div class="am-name" id="am-name">You</div>
|
|
39
|
+
<div class="am-email" id="am-email"></div>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
<a class="am-item" id="am-account" href="/account">
|
|
43
|
+
<span class="am-ico">π€</span>
|
|
44
|
+
<div><div class="am-label">Account</div><div class="am-sub">API key, sessions, billing</div></div>
|
|
45
|
+
</a>
|
|
46
|
+
<button class="am-item" id="am-brain" type="button">
|
|
47
|
+
<span class="am-ico">π§ </span>
|
|
48
|
+
<div><div class="am-label">Brain</div><div class="am-sub">Everything your team knows</div></div>
|
|
49
|
+
</button>
|
|
50
|
+
<a class="am-item" id="am-analytics" href="/analytics">
|
|
51
|
+
<span class="am-ico">π</span>
|
|
52
|
+
<div><div class="am-label">Analytics</div><div class="am-sub">Usage, cost, and ROI</div></div>
|
|
53
|
+
</a>
|
|
54
|
+
<div class="am-div"></div>
|
|
55
|
+
<a class="am-foot" id="am-settings" href="/account">Settings</a>
|
|
56
|
+
<button class="am-foot" id="am-signout" type="button">Sign out</button>
|
|
57
|
+
</div>
|
|
58
|
+
</div>
|
|
59
|
+
</nav>
|
|
60
|
+
|
|
61
|
+
<!-- Issue #512 / #521 R6: Company area β same shell as Projects (jobs rail + collapsible context/learnings) -->
|
|
62
|
+
<section class="hub-area" id="area-company" hidden>
|
|
63
|
+
<div class="area-shell">
|
|
64
|
+
<nav class="area-rail" id="company-rail"></nav>
|
|
65
|
+
<div class="area-main">
|
|
66
|
+
<div class="hub-area-page">
|
|
67
|
+
<div class="eyebrow">FRAIM Hub</div>
|
|
68
|
+
<div class="area-h1">Company</div>
|
|
69
|
+
<p class="area-lede">Who you are as an organization. Every employee reads this before any job. It started from your onboarding and sharpens as your team learns.</p>
|
|
70
|
+
<details class="ctx-acc" id="company-ctx-acc">
|
|
71
|
+
<summary><span class="ca-chev">βΈ</span> <span>π’ Context & rules</span></summary>
|
|
72
|
+
<div class="ctx-acc-body"><div class="card area-profile" id="company-profile"></div></div>
|
|
73
|
+
</details>
|
|
74
|
+
<details class="ctx-acc" id="company-learn-acc">
|
|
75
|
+
<summary><span class="ca-chev">βΈ</span> <span>π§ Company learnings</span>
|
|
76
|
+
<span class="ca-note">β org-wide, applied on every project</span></summary>
|
|
77
|
+
<div class="ctx-acc-body"><div id="company-learnings"></div></div>
|
|
78
|
+
</details>
|
|
79
|
+
<!-- Issue #540 R1-R3: AI employee persona grid (collapsed by default) -->
|
|
80
|
+
<details class="ctx-acc" id="company-emp-acc">
|
|
81
|
+
<summary><span class="ca-chev">βΈ</span> <span>Your AI employees</span></summary>
|
|
82
|
+
<div class="ctx-acc-body"><div id="persona-grid" class="persona-grid"></div></div>
|
|
83
|
+
</details>
|
|
84
|
+
</div>
|
|
85
|
+
<div class="sec-label" style="margin-top:28px;">Your AI team β hire the specialists you need</div>
|
|
86
|
+
<div id="company-hire-count" class="company-hire-bar" hidden></div>
|
|
87
|
+
<div id="company-persona-roster" class="persona-roster-grid"></div>
|
|
88
|
+
</div>
|
|
89
|
+
</div>
|
|
90
|
+
</section>
|
|
91
|
+
|
|
92
|
+
<!-- Issue #512 / #521 R6: Manager area β same shell as Projects -->
|
|
93
|
+
<section class="hub-area" id="area-manager" hidden>
|
|
94
|
+
<div class="area-shell">
|
|
95
|
+
<nav class="area-rail" id="manager-rail"></nav>
|
|
96
|
+
<div class="area-main">
|
|
97
|
+
<div class="hub-area-page">
|
|
98
|
+
<div class="eyebrow">FRAIM Hub</div>
|
|
99
|
+
<div class="area-h1">Manager</div>
|
|
100
|
+
<p class="area-lede">How you like to work, what your team has learned about you, and the coaching that flows both ways.</p>
|
|
101
|
+
<details class="ctx-acc" id="manager-ctx-acc">
|
|
102
|
+
<summary><span class="ca-chev">βΈ</span> <span>π€ Context & rules</span></summary>
|
|
103
|
+
<div class="ctx-acc-body"><div class="card area-profile" id="manager-profile"></div></div>
|
|
104
|
+
</details>
|
|
105
|
+
<details class="ctx-acc" id="manager-learn-acc">
|
|
106
|
+
<summary><span class="ca-chev">βΈ</span> <span>π§ Manager learnings</span>
|
|
107
|
+
<span class="ca-note">β how your team adapts to you</span></summary>
|
|
108
|
+
<div class="ctx-acc-body"><div id="manager-learnings"></div></div>
|
|
109
|
+
</details>
|
|
110
|
+
<details class="ctx-acc" id="manager-reverse-acc">
|
|
111
|
+
<summary><span class="ca-chev">βΈ</span> <span>πͺ Reverse mentoring</span>
|
|
112
|
+
<span class="ca-note">β what you can improve on as a manager</span></summary>
|
|
113
|
+
<div class="ctx-acc-body"><div id="reverse-mentoring"></div></div>
|
|
114
|
+
</details>
|
|
115
|
+
<!-- Issue #538: Hire a human manager -->
|
|
116
|
+
<details class="ctx-acc" id="manager-hire-acc">
|
|
117
|
+
<summary><span class="ca-chev">βΈ</span> <span>π§βπΌ Hire a human manager</span>
|
|
118
|
+
<span class="ca-note">β find a great human to manage a role on SeekOut, LinkedIn, Indeed</span></summary>
|
|
119
|
+
<div class="ctx-acc-body">
|
|
120
|
+
<div class="hm-section-cta">
|
|
121
|
+
<span class="hm-ic">π§βπΌ</span>
|
|
122
|
+
<div class="hm-copy">
|
|
123
|
+
<strong>Your AI employees deserve a strong human manager.</strong>
|
|
124
|
+
<small>Pick a role and we'll pre-fill a candidate search and job description with the qualities of a strong AI manager.</small>
|
|
125
|
+
</div>
|
|
126
|
+
<button class="pr-cta" id="manager-hire-btn" type="button" style="width:auto;margin:0;padding:10px 16px;">Find a manager β</button>
|
|
127
|
+
</div>
|
|
128
|
+
</div>
|
|
129
|
+
</details>
|
|
130
|
+
<!-- Issue #540 R4-R7: Your team pool (collapsed by default) -->
|
|
131
|
+
<details class="ctx-acc" id="manager-team-acc">
|
|
132
|
+
<summary><span class="ca-chev">βΈ</span> <span>Your team</span></summary>
|
|
133
|
+
<div class="ctx-acc-body"><div id="manager-team-pool" class="manager-team-pool"></div></div>
|
|
134
|
+
</details>
|
|
135
|
+
</div>
|
|
136
|
+
<div class="sec-label" style="margin-top:24px;">Your hired team</div>
|
|
137
|
+
<div id="manager-team-section" class="manager-team-section"></div>
|
|
138
|
+
</div>
|
|
139
|
+
</div>
|
|
140
|
+
</section>
|
|
141
|
+
|
|
142
|
+
<!-- Issue #512: Brain area (reached from the account menu) -->
|
|
143
|
+
<section class="hub-area" id="area-brain" hidden>
|
|
144
|
+
<div class="hub-area-page">
|
|
145
|
+
<div class="eyebrow">FRAIM Β· Brain</div>
|
|
146
|
+
<div class="area-h1">Brain</div>
|
|
147
|
+
<p class="area-lede">The full picture of what your team knows β every preserved learning across scopes, plus the skills and rules they draw on.</p>
|
|
148
|
+
<div class="sec-label" style="margin-top:22px;">Preserved learnings</div>
|
|
149
|
+
<div class="stat-grid" id="brain-learnings"></div>
|
|
150
|
+
<div class="sec-label" style="margin-top:22px;">What your team draws on</div>
|
|
151
|
+
<div class="stat-grid" id="brain-catalog"></div>
|
|
152
|
+
</div>
|
|
153
|
+
</section>
|
|
154
|
+
|
|
155
|
+
<!-- Issue #512: Projects area wraps the existing single-surface Hub. -->
|
|
156
|
+
<section class="hub-area on" id="area-projects">
|
|
157
|
+
<div class="proj-tabs" id="proj-tabs">
|
|
158
|
+
<button class="ptab on" id="ptab-overview" type="button" data-view="overview">Overview</button>
|
|
159
|
+
<span id="proj-tab-list"></span>
|
|
160
|
+
<button class="ptab ptab-add" id="ptab-add" type="button">+ Project</button>
|
|
161
|
+
</div>
|
|
162
|
+
|
|
163
|
+
<!-- Overview sub-view: dashboard project cards -->
|
|
164
|
+
<div id="proj-overview">
|
|
165
|
+
<div class="hub-area-page">
|
|
166
|
+
<div class="sec-label">All projects</div>
|
|
167
|
+
<div class="proj-grid" id="proj-grid"></div>
|
|
168
|
+
</div>
|
|
169
|
+
</div>
|
|
170
|
+
|
|
171
|
+
<!-- Project workspace: employee tree + the existing conversation surface. -->
|
|
172
|
+
<div id="proj-workspace" hidden>
|
|
173
|
+
<nav class="tree-sidebar" id="tree-sidebar"></nav>
|
|
174
|
+
<button class="tree-collapse-btn" id="tree-collapse-btn" type="button" aria-label="Collapse project navigation" title="Collapse project navigation"></button>
|
|
175
|
+
<div class="tree-resizer" id="tree-resizer" role="separator" aria-orientation="vertical" aria-label="Resize project navigation"></div>
|
|
176
|
+
<div class="workspace-conv">
|
|
177
|
+
|
|
178
|
+
<!-- #521 R5/R6.4: project brief & learnings as collapsible top sections
|
|
179
|
+
(consistent with Company/Manager), replacing the over-conversation
|
|
180
|
+
panels. Each sub-area is its own <details> so the manager controls
|
|
181
|
+
how much text is shown. The editable brief rows (#proj-brief-profile)
|
|
182
|
+
and the learnings list (#project-learnings) are unchanged. -->
|
|
183
|
+
<div id="proj-context-top" class="proj-context-top">
|
|
184
|
+
<!-- Onboarding state banner lives ABOVE the accordions so it shows even
|
|
185
|
+
when the Brief is collapsed (so the conversation keeps its height). -->
|
|
186
|
+
<div id="proj-onboarding-banner"></div>
|
|
187
|
+
<details class="ctx-acc" id="proj-brief-acc">
|
|
188
|
+
<summary><span class="ca-chev">βΈ</span> <span>π Brief</span>
|
|
189
|
+
<span class="ca-note">β this project's context and rules, captured by Project Onboarding</span></summary>
|
|
190
|
+
<div class="ctx-acc-body"><div class="card area-profile" id="proj-brief-profile"></div></div>
|
|
191
|
+
</details>
|
|
192
|
+
<details class="ctx-acc" id="proj-learnings-acc">
|
|
193
|
+
<summary><span class="ca-chev">βΈ</span> <span>π§ Learnings</span>
|
|
194
|
+
<span class="ca-note">β from <strong>sleep-on-learnings</strong> Β· promote to a scope</span></summary>
|
|
195
|
+
<div class="ctx-acc-body"><div id="project-learnings"></div></div>
|
|
196
|
+
</details>
|
|
197
|
+
</div>
|
|
198
|
+
|
|
199
|
+
|
|
15
200
|
<div class="page">
|
|
16
201
|
|
|
17
202
|
<header class="header" style="-webkit-app-region: drag;">
|
|
@@ -92,10 +277,26 @@
|
|
|
92
277
|
<p>Pick an existing job from the left, or click <strong>+ New job</strong> to give your employee something to work on.</p>
|
|
93
278
|
</div>
|
|
94
279
|
|
|
280
|
+
<!-- Issue #540 R10-R14: Non-blocking hire strip. Lives outside #active-conv so it
|
|
281
|
+
is visible even when no conversation is active. -->
|
|
282
|
+
<div id="hire-strip" class="hire-strip" hidden>
|
|
283
|
+
<div class="hs-avatar" id="hs-avatar"></div>
|
|
284
|
+
<div class="hs-body">
|
|
285
|
+
<p class="hs-title" id="hs-title">Unlock this employee</p>
|
|
286
|
+
<p class="hs-sub" id="hs-sub">Add them to your team to run this job with full context and memory.</p>
|
|
287
|
+
</div>
|
|
288
|
+
<div class="hs-actions">
|
|
289
|
+
<button class="hs-btn hs-btn--primary" type="button" id="hs-add-btn">Add to my team</button>
|
|
290
|
+
<button class="hs-btn hs-btn--primary" type="button" id="hs-get-btn" hidden>Get for your company</button>
|
|
291
|
+
<button class="hs-btn hs-btn--ghost" type="button" id="hs-skip-btn">Skip β use generic agent</button>
|
|
292
|
+
</div>
|
|
293
|
+
</div>
|
|
294
|
+
|
|
95
295
|
<div id="active-conv" hidden>
|
|
96
296
|
<div class="conv-topline">
|
|
97
297
|
<div class="employee-identity" id="active-identity"></div>
|
|
98
298
|
<span id="active-title" class="conv-job-title"></span>
|
|
299
|
+
<button class="run-stop-btn" id="run-stop-btn" type="button" hidden title="Ask the employee to stop and wait for you">βΉ Stop</button>
|
|
99
300
|
<div class="run-state-pill" id="run-state-pill"></div>
|
|
100
301
|
</div>
|
|
101
302
|
|
|
@@ -113,6 +314,9 @@
|
|
|
113
314
|
<span class="panel-kicker">Manager and employee thread</span>
|
|
114
315
|
</span>
|
|
115
316
|
</summary>
|
|
317
|
+
<!-- Issue #512 R7: completion card + format-derived artifact strip
|
|
318
|
+
render INSIDE #messages (as the employee's review turn) so the
|
|
319
|
+
thread panel keeps its existing flex/scroll geometry. -->
|
|
116
320
|
<div class="messages" id="messages"></div>
|
|
117
321
|
</details>
|
|
118
322
|
|
|
@@ -130,10 +334,19 @@
|
|
|
130
334
|
</summary>
|
|
131
335
|
<div class="panel-body">
|
|
132
336
|
<div class="coach">
|
|
337
|
+
<!-- Issue #512 R7.7: review actions live in the SAME bar as the
|
|
338
|
+
coaching chips. Hidden until a deliverable is awaiting review;
|
|
339
|
+
the coaching chips below never disappear. -->
|
|
340
|
+
<div class="review-actions" id="review-actions" hidden>
|
|
341
|
+
<button class="rb-approve" type="button" id="review-approve">β Approve</button>
|
|
342
|
+
<button class="rb-secondary" type="button" id="review-request-changes">β© Request changes</button>
|
|
343
|
+
<span class="rb-handoff" id="review-handoff">Comment on the doc to leave inline notes, or type below to coach.</span>
|
|
344
|
+
</div>
|
|
133
345
|
<div class="quick-coach-row" id="quick-coach-btns" hidden>
|
|
134
|
-
<button class="ghost quick-coach-btn" type="button"
|
|
135
|
-
<button class="ghost quick-coach-btn" type="button" data-job="
|
|
136
|
-
<button class="ghost quick-coach-btn" type="button" data-job="
|
|
346
|
+
<button class="ghost quick-coach-btn mark-complete-btn" type="button" id="mark-complete-btn">β Mark complete</button>
|
|
347
|
+
<button class="ghost quick-coach-btn" type="button" data-job="recognize-good-work" data-prompt="Good job. What went well, and how can we repeat it?">π Good job</button>
|
|
348
|
+
<button class="ghost quick-coach-btn" type="button" data-job="analyze-why-you-messed-up" data-prompt="Why did you mess up? Explain the root cause, what you should have done differently, and what you will change next time.">π Why did you mess up?</button>
|
|
349
|
+
<button class="ghost quick-coach-btn" type="button" data-job="follow-your-mentor" data-prompt="Follow the process. Re-check the workflow instructions and continue from the correct next step.">π Follow the process</button>
|
|
137
350
|
<button class="ghost quick-coach-btn" type="button" id="other-manager-jobs-btn">Other manager jobs βΎ</button>
|
|
138
351
|
</div>
|
|
139
352
|
<div class="coach-input">
|
|
@@ -209,6 +422,10 @@
|
|
|
209
422
|
<p class="status-line" id="status-line" role="status" aria-live="polite"></p>
|
|
210
423
|
</div>
|
|
211
424
|
|
|
425
|
+
</div><!-- /.workspace-conv -->
|
|
426
|
+
</div><!-- /#proj-workspace -->
|
|
427
|
+
</section><!-- /#area-projects -->
|
|
428
|
+
|
|
212
429
|
<div class="modal-backdrop" id="modal" role="dialog" aria-modal="true" hidden>
|
|
213
430
|
<div class="modal">
|
|
214
431
|
|
|
@@ -218,7 +435,7 @@
|
|
|
218
435
|
<p>Pick one job. You can always start a new job for different work.</p>
|
|
219
436
|
</div>
|
|
220
437
|
<div class="modal-body">
|
|
221
|
-
<input class="search" type="text" placeholder="
|
|
438
|
+
<input class="search" type="text" placeholder="Describe the work, or search jobs⦠(⡠starts an ad-hoc job)" id="job-search">
|
|
222
439
|
<div id="job-persona-filter" hidden></div>
|
|
223
440
|
<div id="job-catalog"></div>
|
|
224
441
|
</div>
|
|
@@ -233,7 +450,6 @@
|
|
|
233
450
|
<span class="left" id="job-pick-status">Choose a job to continue</span>
|
|
234
451
|
<div class="right">
|
|
235
452
|
<button class="ghost" type="button" id="cancel1">Cancel</button>
|
|
236
|
-
<button class="ghost" type="button" id="freeform-btn">Just describe what you need</button>
|
|
237
453
|
<button class="send-button" type="button" id="next1" disabled>Next</button>
|
|
238
454
|
</div>
|
|
239
455
|
</div>
|
|
@@ -284,6 +500,239 @@
|
|
|
284
500
|
</div>
|
|
285
501
|
</div>
|
|
286
502
|
|
|
503
|
+
<!-- Issue #512: New-project flow (4-step modal) -->
|
|
504
|
+
<div id="np-modal" class="np-overlay" hidden>
|
|
505
|
+
<button class="np-close" id="np-close" type="button">Γ</button>
|
|
506
|
+
<div class="np-wrap">
|
|
507
|
+
<div class="np-step-dots" id="np-dots">
|
|
508
|
+
<div class="np-dot on"></div><div class="np-dot"></div><div class="np-dot"></div><div class="np-dot"></div>
|
|
509
|
+
</div>
|
|
510
|
+
|
|
511
|
+
<div class="np-step on" id="np1">
|
|
512
|
+
<div class="np-card">
|
|
513
|
+
<div class="np-hdr">
|
|
514
|
+
<div class="step-label">Step 1 of 4</div>
|
|
515
|
+
<h2>Choose a project folder</h2>
|
|
516
|
+
<p>Pick the folder where your team will work. They'll read context from it, write artifacts to it, and build up learnings there.</p>
|
|
517
|
+
</div>
|
|
518
|
+
<div class="np-body">
|
|
519
|
+
<div class="np-field">
|
|
520
|
+
<label>Project folder</label>
|
|
521
|
+
<div class="np-folder-row">
|
|
522
|
+
<input type="text" id="np-folder" placeholder="Choose a folderβ¦" readonly>
|
|
523
|
+
<button type="button" class="np-browse-btn" id="np-browse">Browseβ¦</button>
|
|
524
|
+
</div>
|
|
525
|
+
<div class="np-field-hint">Must be an existing folder on your machine.</div>
|
|
526
|
+
</div>
|
|
527
|
+
<div class="np-field">
|
|
528
|
+
<label>What are you trying to accomplish? <span class="np-optional">(optional β your team will ask if unclear)</span></label>
|
|
529
|
+
<textarea id="np-intent" rows="3" placeholder="e.g. Build a compliance-ready hiring module for mid-market SaaS teams."></textarea>
|
|
530
|
+
</div>
|
|
531
|
+
</div>
|
|
532
|
+
<div class="np-footer"><span></span><button class="np-next" type="button" data-np="2" id="np1-next" disabled>Next β</button></div>
|
|
533
|
+
</div>
|
|
534
|
+
</div>
|
|
535
|
+
|
|
536
|
+
<div class="np-step" id="np2">
|
|
537
|
+
<div class="np-card">
|
|
538
|
+
<div class="np-hdr"><div class="step-label">Step 2 of 4</div><h2>What does success look like?</h2><p>Your employees will use this to know when they're done and what constraints to work within.</p></div>
|
|
539
|
+
<div class="np-body">
|
|
540
|
+
<div class="np-field"><label>Outcome β how will you know this project succeeded?</label><textarea id="np-outcome" rows="3" placeholder="The end state that means done."></textarea></div>
|
|
541
|
+
<div class="np-field"><label>Rules & guardrails for this project <span class="np-optional">(optional)</span></label><textarea id="np-rules" rows="4" placeholder="Anything the team must always do, or never do?"></textarea></div>
|
|
542
|
+
<div class="np-source"><span>π</span><input type="text" id="np-source" placeholder="Or point me to a project doc, ticket, or spec to pull context fromβ¦"><button type="button" class="np-source-btn">Add source</button></div>
|
|
543
|
+
<div class="np-note">Project rules stack on top of your org guardrails β they apply only here.</div>
|
|
544
|
+
</div>
|
|
545
|
+
<div class="np-footer"><button class="np-back" type="button" data-np="1">β Back</button><button class="np-next" type="button" data-np="3">Next β</button></div>
|
|
546
|
+
</div>
|
|
547
|
+
</div>
|
|
548
|
+
|
|
549
|
+
<div class="np-step" id="np3">
|
|
550
|
+
<div class="np-card">
|
|
551
|
+
<div class="np-hdr"><div class="step-label">Step 3 of 4</div><h2>Who's working on this?</h2><p>Select from your hired employees. Each one will be briefed on the project before starting work.</p></div>
|
|
552
|
+
<div class="np-body">
|
|
553
|
+
<div class="emp-grid" id="np-emp-grid"></div>
|
|
554
|
+
<div class="np-note">Greyed-out employees aren't hired yet. <a href="/pricing" class="np-link">Go to pricing β</a></div>
|
|
555
|
+
</div>
|
|
556
|
+
<div class="np-footer"><button class="np-back" type="button" data-np="2">β Back</button><button class="np-next" type="button" data-np="4">Review β</button></div>
|
|
557
|
+
</div>
|
|
558
|
+
</div>
|
|
559
|
+
|
|
560
|
+
<div class="np-step" id="np4">
|
|
561
|
+
<div class="np-card">
|
|
562
|
+
<div class="np-hdr"><div class="step-label">Step 4 of 4</div><h2>Ready to brief the team</h2><p>FRAIM will share this context with each employee before they start any job on this project.</p></div>
|
|
563
|
+
<div class="np-body" id="np-summary"></div>
|
|
564
|
+
<div class="np-footer"><button class="np-back" type="button" data-np="3">β Back</button><button class="np-next" type="button" id="np-create-btn">Create project and brief the team β</button></div>
|
|
565
|
+
</div>
|
|
566
|
+
</div>
|
|
567
|
+
</div>
|
|
568
|
+
</div>
|
|
569
|
+
|
|
570
|
+
<!-- Issue #512: Assign-job modal (job-first, with locks + per-employee filter) -->
|
|
571
|
+
<div id="assign-job-modal" class="modal-overlay" hidden>
|
|
572
|
+
<div class="modal-card">
|
|
573
|
+
<div class="modal-hdr">
|
|
574
|
+
<div><h2 id="aj-title">Assign a job</h2><p>Pick the work β we'll route it to the right specialist. Locked jobs need a teammate you haven't hired yet.</p></div>
|
|
575
|
+
<button class="modal-close" id="aj-close" type="button">Γ</button>
|
|
576
|
+
</div>
|
|
577
|
+
<div class="modal-body" id="aj-body"></div>
|
|
578
|
+
</div>
|
|
579
|
+
</div>
|
|
580
|
+
|
|
581
|
+
<!-- #521: Project onboarding input β collect the manager's direction before the
|
|
582
|
+
(re)processing run so they can steer it (e.g. "we added a new auth service"). -->
|
|
583
|
+
<div id="onboard-input-modal" class="modal-overlay" hidden>
|
|
584
|
+
<div class="modal-card">
|
|
585
|
+
<div class="modal-hdr">
|
|
586
|
+
<div><h2 id="obi-title">Reprocess project onboarding</h2><p id="obi-sub"></p></div>
|
|
587
|
+
<button class="modal-close" id="obi-close" type="button">Γ</button>
|
|
588
|
+
</div>
|
|
589
|
+
<div class="modal-body">
|
|
590
|
+
<textarea id="obi-input" class="obi-input" rows="5" placeholder="e.g. We added a new auth service under /services/auth β please incorporate it and its README. (optional)"></textarea>
|
|
591
|
+
<div class="obi-actions">
|
|
592
|
+
<button class="obi-cancel" id="obi-cancel" type="button">Cancel</button>
|
|
593
|
+
<button class="obi-start" id="obi-start" type="button">Start</button>
|
|
594
|
+
</div>
|
|
595
|
+
</div>
|
|
596
|
+
</div>
|
|
597
|
+
</div>
|
|
598
|
+
|
|
599
|
+
<!-- Issue #512: Add-employee modal (preselect-aware) -->
|
|
600
|
+
<div id="add-emp-modal" class="modal-overlay" hidden>
|
|
601
|
+
<div class="modal-card">
|
|
602
|
+
<div class="modal-hdr">
|
|
603
|
+
<div><h2>Add an employee to this project</h2><p id="ae-sub">Add someone from your team, or hire a new specialist. New hires are onboarded with your company context automatically.</p></div>
|
|
604
|
+
<button class="modal-close" id="ae-close" type="button">Γ</button>
|
|
605
|
+
</div>
|
|
606
|
+
<div class="modal-body" id="ae-body"></div>
|
|
607
|
+
</div>
|
|
608
|
+
</div>
|
|
609
|
+
|
|
610
|
+
<!-- Issue #512: Pricing modal -->
|
|
611
|
+
<div id="pricing-modal" class="modal-overlay pricing-overlay" hidden>
|
|
612
|
+
<div class="modal-card pricing-card">
|
|
613
|
+
<div class="modal-hdr" style="border:none;justify-content:flex-end;padding-bottom:0;">
|
|
614
|
+
<button class="modal-close" id="pr-close" type="button">Γ</button>
|
|
615
|
+
</div>
|
|
616
|
+
<div class="pricing-body">
|
|
617
|
+
<div id="pr-av" class="pr-av">CE</div>
|
|
618
|
+
<h2>Hire <span id="pr-persona">this specialist</span></h2>
|
|
619
|
+
<p>Onboarded with your company context the moment you hire β and dropped straight onto this project, ready to take the job you picked.</p>
|
|
620
|
+
<div class="pr-price" id="pr-price">$299<span>/mo</span></div>
|
|
621
|
+
<a class="pr-cta" id="pr-cta" href="/pricing">Hire and add to project β</a>
|
|
622
|
+
<div class="pr-foot">Opens checkout Β· cancel anytime</div>
|
|
623
|
+
</div>
|
|
624
|
+
</div>
|
|
625
|
+
</div>
|
|
626
|
+
|
|
627
|
+
<!-- Issue #538: Hire a human manager modal -->
|
|
628
|
+
<div id="hm-modal" class="modal-overlay" hidden>
|
|
629
|
+
<div class="modal-card" style="max-width:560px;">
|
|
630
|
+
<div class="modal-hdr">
|
|
631
|
+
<button class="modal-close" id="hm-close" type="button" aria-label="Close">Γ</button>
|
|
632
|
+
<h2>Hire a human manager</h2>
|
|
633
|
+
<p id="hm-sub">Find a great human to manage your AI employee. We pre-fill the search and a job description with the qualities of a strong AI manager.</p>
|
|
634
|
+
</div>
|
|
635
|
+
<div class="modal-body">
|
|
636
|
+
<div class="hm-fieldrow">
|
|
637
|
+
<div class="hm-field" style="flex:1;">
|
|
638
|
+
<label for="hm-role">Managing which AI employee</label>
|
|
639
|
+
<select id="hm-role"></select>
|
|
640
|
+
</div>
|
|
641
|
+
<div class="hm-field" style="max-width:200px;">
|
|
642
|
+
<label for="hm-loc">Location (optional)</label>
|
|
643
|
+
<input type="text" id="hm-loc" placeholder="e.g. San Francisco, CA" />
|
|
644
|
+
</div>
|
|
645
|
+
</div>
|
|
646
|
+
<div class="hm-field">
|
|
647
|
+
<label>Search query</label>
|
|
648
|
+
<div class="hm-query"><code id="hm-query"></code><button class="hm-copy-btn" id="hm-copy-q" type="button">Copy</button></div>
|
|
649
|
+
</div>
|
|
650
|
+
<div class="hm-field">
|
|
651
|
+
<label>Qualities of a strong AI manager (built into the search & job description)</label>
|
|
652
|
+
<div class="hm-qualities" id="hm-qualities"></div>
|
|
653
|
+
</div>
|
|
654
|
+
<details class="hm-jd">
|
|
655
|
+
<summary><span class="hm-chev">βΈ</span> Job description <button class="hm-copy-btn" id="hm-copy-jd" type="button" style="margin-left:auto;">Copy JD</button></summary>
|
|
656
|
+
<div class="hm-jd-body" id="hm-jd-body"></div>
|
|
657
|
+
</details>
|
|
658
|
+
<div>
|
|
659
|
+
<div class="hm-providers-label">Open in a hiring service (search pre-filled)</div>
|
|
660
|
+
<div class="hm-providers">
|
|
661
|
+
<a class="hm-provider" id="hm-linkedin" target="_blank" rel="noopener"><span class="hm-logo linkedin">in</span><strong>LinkedIn</strong><small>Open search</small></a>
|
|
662
|
+
<a class="hm-provider" id="hm-indeed" target="_blank" rel="noopener"><span class="hm-logo indeed">id</span><strong>Indeed</strong><small>Open search</small></a>
|
|
663
|
+
<a class="hm-provider" id="hm-seekout" target="_blank" rel="noopener"><span class="hm-logo seekout">SO</span><strong>SeekOut</strong><small>Copy + open</small></a>
|
|
664
|
+
</div>
|
|
665
|
+
</div>
|
|
666
|
+
<p class="hm-foot">We don't send your data anywhere. Clicking a service opens it in a new tab with the role keywords in the URL; the job description is copied to your clipboard for you to paste.</p>
|
|
667
|
+
</div>
|
|
668
|
+
</div>
|
|
669
|
+
</div>
|
|
670
|
+
|
|
671
|
+
<!-- Issue #539: Command palette overlay β replaces 2-step modal as job-launch surface -->
|
|
672
|
+
<div id="cp-modal" class="cp-backdrop" role="dialog" aria-modal="true" aria-label="Start a job" hidden>
|
|
673
|
+
<div class="cp-palette">
|
|
674
|
+
<div class="cp-search-row">
|
|
675
|
+
<span class="cp-search-icon">β</span>
|
|
676
|
+
<input id="cp-search" type="text"
|
|
677
|
+
placeholder="Job name, /huxley, /pam, or describe your taskβ¦"
|
|
678
|
+
autocomplete="off" spellcheck="false">
|
|
679
|
+
</div>
|
|
680
|
+
<div id="cp-results" class="cp-results-scroll">
|
|
681
|
+
<div id="cp-recent-section" class="cp-section" hidden>
|
|
682
|
+
<div class="cp-section-label">RECENT</div>
|
|
683
|
+
<div id="cp-recent-list"></div>
|
|
684
|
+
</div>
|
|
685
|
+
<div id="cp-catalog-section" class="cp-section">
|
|
686
|
+
<div class="cp-section-label">CATALOG</div>
|
|
687
|
+
<div id="cp-catalog-list"></div>
|
|
688
|
+
</div>
|
|
689
|
+
</div>
|
|
690
|
+
<div id="cp-instructions-row" class="cp-instructions-row" hidden>
|
|
691
|
+
<div id="cp-selected-job-chip" class="cp-job-chip"></div>
|
|
692
|
+
<textarea id="cp-instructions"
|
|
693
|
+
placeholder="What outcome do you want? A few sentences is enough."
|
|
694
|
+
rows="3"></textarea>
|
|
695
|
+
<button type="button" id="cp-start-btn" class="send-button">Start</button>
|
|
696
|
+
</div>
|
|
697
|
+
<div class="cp-hints-bar">
|
|
698
|
+
<span class="cp-hint"><kbd>↑↓</kbd> navigate</span>
|
|
699
|
+
<span class="cp-hint"><kbd>↵</kbd> select/start</span>
|
|
700
|
+
<span class="cp-hint"><kbd>⇧↵</kbd> new line</span>
|
|
701
|
+
<span class="cp-hint"><kbd>Esc</kbd> close</span>
|
|
702
|
+
<span class="cp-hint cp-hint--right"><kbd id="cp-rerun-kbd">⌘⇧R</kbd> re-run last</span>
|
|
703
|
+
</div>
|
|
704
|
+
<div class="cp-employee-footer">
|
|
705
|
+
Running as: <span id="cp-employee-name"></span>
|
|
706
|
+
</div>
|
|
707
|
+
</div>
|
|
708
|
+
</div>
|
|
709
|
+
|
|
710
|
+
<!-- Issue #540: Hire checkout email-capture modal. Opens when "Add to Company" or
|
|
711
|
+
"Get for your company" is clicked; calls /api/payment/create-session and
|
|
712
|
+
redirects to Stripe. -->
|
|
713
|
+
<div class="modal-backdrop" id="hcm" role="dialog" aria-modal="true" aria-labelledby="hcm-title" hidden>
|
|
714
|
+
<div class="modal" style="max-width:420px">
|
|
715
|
+
<div class="modal-header">
|
|
716
|
+
<h2 id="hcm-title">Hire <span id="hcm-persona-name">this employee</span></h2>
|
|
717
|
+
<p id="hcm-persona-role" style="color:var(--text-secondary);margin-top:2px"></p>
|
|
718
|
+
</div>
|
|
719
|
+
<div class="modal-body" style="padding-top:12px">
|
|
720
|
+
<label style="display:block;font-size:13px;font-weight:500;margin-bottom:6px" for="hcm-email">Work email</label>
|
|
721
|
+
<input id="hcm-email" type="email" class="search" placeholder="you@company.com" autocomplete="email" style="margin-bottom:0">
|
|
722
|
+
<p id="hcm-error" style="color:var(--red,#e53935);font-size:12px;margin-top:6px;min-height:16px"></p>
|
|
723
|
+
<p style="font-size:12px;color:var(--text-secondary);margin-top:4px">
|
|
724
|
+
You'll be taken to Stripe to complete the purchase. Your seat is activated immediately after payment.
|
|
725
|
+
</p>
|
|
726
|
+
</div>
|
|
727
|
+
<div class="modal-footer">
|
|
728
|
+
<div class="right">
|
|
729
|
+
<button class="ghost" type="button" id="hcm-cancel">Cancel</button>
|
|
730
|
+
<button class="send-button" type="button" id="hcm-submit">Continue to payment β</button>
|
|
731
|
+
</div>
|
|
732
|
+
</div>
|
|
733
|
+
</div>
|
|
734
|
+
</div>
|
|
735
|
+
|
|
287
736
|
<script src="./script.js"></script>
|
|
288
737
|
</body>
|
|
289
738
|
</html>
|