@schandlergarcia/sf-web-components 1.9.84 → 1.9.86

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 (6) hide show
  1. package/.a4drules/skills/command-center-builder/getting-started.md +165 -135
  2. package/.a4drules/skills/command-center-builder/improved-build-process.md +38 -26
  3. package/CHANGELOG.md +22 -0
  4. package/data/engine-command-center-prd.md +62 -42
  5. package/package.json +1 -1
  6. package/scripts/reset-command-center.sh +51 -4
package/.a4drules/skills/command-center-builder/getting-started.md CHANGED
@@ -2,184 +2,212 @@
2
2
 
3
3
  The dashboard is built in **3 phases**, one per user prompt. Each phase adds a layer. Do NOT build ahead — only build what the current phase asks for.
4
4
 
5
- ## General Rules for All Phases
5
+ ---
6
+
7
+ ## RULES THAT APPLY TO EVERY PHASE
8
+
9
+ > **Read these first. Violations of these rules are the #1 cause of failed demos.**
10
+
11
+ 1. **Phase 1 writes new files. Phases 2 and 3 make surgical edits.** Never rewrite `EngineDashboard.tsx` from scratch in Phase 2 or 3. Rewriting a 400+ line file takes 60s, risks losing prior work, and introduces regressions. Surgical edits take seconds.
12
+
13
+ 2. **Do NOT read library component source files.** This means: do NOT read `GeoMap.jsx`, `BaseCard.jsx`, `Avatar.jsx`, `ChatBar.jsx`, `ChartCard.jsx`, `D3Chart.jsx`, `useDataSource.jsx`, `DataModeProvider.jsx`, `DataModeToggle.jsx`, or any file inside `src/components/library/`. All props and patterns are documented in this build guide and the PRD. Reading source files wastes time and produces no new information.
6
14
 
7
- 1. **Phase 1 writes new files. Phases 2 and 3 make surgical edits.** Phase 2 and 3 should NEVER rewrite `EngineDashboard.tsx` from scratch — use targeted edits (add imports, update specific lines, insert JSX blocks). Rewriting the entire file risks losing Phase 1 work and takes 60+ seconds vs seconds per edit.
15
+ 3. **Do NOT load unnecessary skills.** Phase 1 needs only `command-center-builder`. Do NOT load `outer-app`, `component-library`, `command-center-project`, `agentforce-test`, or `agentforce-observability` — they add latency and aren't needed.
8
16
 
9
- 2. **Don't read files you don't need.** The patterns for `useDataSource`, `DataModeProvider`, `DataModeToggle`, and library components are documented in this skill. Only read files that contain project-specific code you need to understand (e.g., the dashboard you're editing, the live data file for its shape).
17
+ 4. **Do NOT run `npm run build` or `npm run dev` during the build.** Vite handles JSX/TSX regardless of TypeScript errors. Pre-existing TS7016 errors (from untyped .jsx library files) are normal and expected.
10
18
 
11
- 3. **Don't run `npm run build` during the build.** Vite handles JSX/TSX regardless of TypeScript errors. Pre-existing TS7016 errors are normal.
19
+ 5. **STOP and ASK before creating Salesforce metadata.** Custom fields, platform events, and Apex classes are scripted demo moments. Suggest them, wait for "yes," then create. Never create them proactively.
12
20
 
13
- 4. **STOP and ASK before creating Salesforce metadata.** When the build guide says "suggest" a custom field, platform event, or Apex class — you must present the suggestion to the user and WAIT for confirmation. Do NOT create the file until the user says yes. This is a scripted demo moment.
21
+ 6. **Do NOT create extra files not listed in the build guide.** Each phase lists exactly which files to create or edit. Do NOT create wrapper hooks, adapter files, .env files, or any file not explicitly listed.
14
22
 
15
23
  ---
16
24
 
17
25
  ## Phase 1 — Build the Dashboard (sample data only)
18
26
 
19
- **What to build:**
20
- - `src/pages/EngineDashboard.tsx` with:
21
- - Sticky header (h-12, Engine logo, "Travel Command Center", "Powered by Agentforce" badge, bell icon, theme toggle)
22
- - Hero GeoMap (h-[520px]) with markers, arcs, overlays from sample data
23
- - Glass KPI overlays on the map (Active Travelers, Spend MTD, Compliance %, Eva Resolved)
24
- - Flight status strip (horizontal scroll, glass pills)
25
- - Escalations panel (BaseCard with "Assign to Agent" buttons, toast on click)
26
- - Disruptions panel (severity dots, flight info, Eva action lines)
27
- - Active Travelers panel (expandable cards with Avatar, details grid, "View in Salesforce" links)
28
- - Monthly Spend chart (ChartCard + D3Chart groupedBarChart)
29
- - All data from `src/data/engine-sample-data.js` via `useDataSource({ sample: SAMPLE_DATA, live: [] })`
30
- - Brand tokens in `global.css`
31
-
32
- **What to wire:**
33
- - `CommandCenter.tsx` → import EngineDashboard
34
- - `Home.tsx` → REPLACE with CommandCenter wrapper
35
- - `routes.tsx` → Home as index route with label "Dashboard"
36
-
37
- **What NOT to build (saved for later phases):**
38
- - No ChatBar or Eva AI chat — that's Phase 3
39
- - No AgentforceConversationClient — that's Phase 3
40
- - No `useEngineLiveData` or live data wiring — that's Phase 2
41
- - No Salesforce metadata (custom fields, platform events, Apex) — that's Phases 2-3
42
- - Leave `live:` props empty (`live: []` or `live: undefined`) — Phase 2 fills them in
27
+ ### FORBIDDEN in Phase 1
28
+ - ❌ ChatBar, Eva, or any Agentforce integration (that's Phase 3)
29
+ - ❌ `useEngineLiveData` or live data wiring (that's Phase 2)
30
+ - ❌ Salesforce metadata — custom fields, platform events, Apex (that's Phases 2-3)
31
+ - ❌ Reading library component source files (GeoMap.jsx, BaseCard.jsx, etc.)
32
+ - ❌ Loading skills other than `command-center-builder`
33
+
34
+ ### Files to read (only these)
35
+ 1. `engine-command-center-prd.md` — the full spec
36
+ 2. `src/data/engine-sample-data.js` — sample data shape
37
+
38
+ ### Files to create/edit (in order)
39
+ ```
40
+ 1. WRITE src/pages/EngineDashboard.tsx ← full dashboard, one pass
41
+ 2. EDIT src/components/workspace/CommandCenter.tsx ← import EngineDashboard
42
+ 3. WRITE src/pages/Home.tsx ← REPLACE with CommandCenter wrapper (3 lines)
43
+ 4. EDIT src/routes.tsx ← change index route label to "Dashboard"
44
+ ```
45
+
46
+ ### What to build in EngineDashboard.tsx
47
+ - Sticky header (h-12, Engine logo, "Travel Command Center", "Powered by Agentforce" badge, bell icon, theme toggle)
48
+ - Hero GeoMap (h-[520px]) with markers, arcs, overlays from sample data
49
+ - Glass KPI overlays on the map (Active Travelers, Spend MTD, Compliance %, Eva Resolved)
50
+ - Flight status strip (horizontal scroll, glass pills)
51
+ - Escalations panel (BaseCard with "Assign to Agent" buttons, toast on click)
52
+ - Disruptions panel (severity dots, flight info, Eva action lines)
53
+ - Active Travelers panel (expandable cards with Avatar, details grid, "View in Salesforce" links)
54
+ - Monthly Spend chart (ChartCard + D3Chart groupedBarChart)
55
+ - All data via `useDataSource({ sample: SAMPLE_DATA, live: [] })` — leave `live:` empty
56
+
57
+ ### Wiring
58
+ - `CommandCenter.tsx` → import EngineDashboard instead of BlankDashboard
59
+ - `Home.tsx` → **REPLACE** the Account Search page with a 3-line wrapper that renders `<CommandCenter />`
60
+ - `routes.tsx` → change the index route handle to `{ showInNavigation: false, showNavBar: false, label: "Dashboard" }`
61
+
62
+ ### Write the dashboard in one pass
63
+ Plan the entire file before writing. Do NOT write a partial dashboard and iterate — write the complete component with all imports, data, and JSX in a single Write call.
43
64
 
44
65
  ---
45
66
 
46
67
  ## Phase 2 — Connect to Live Data
47
68
 
48
- **The point of Phase 2:** The dashboard switches from sample data (8 US travelers: Sarah Chen, Marcus Johnson…) to a completely different live dataset (12 global travelers: Raj Kapoor, Sofia Reyes… with a Midwest storm scenario). The user should see different names, different cities, different metrics, and different disruptions.
69
+ ### FORBIDDEN in Phase 2
70
+ - ❌ `DataModeToggle` — do NOT add it to the UI. There is NO UI toggle. The switch is `dataStrategy.ts` on the backend.
71
+ - ❌ Rewriting `EngineDashboard.tsx` from scratch — make 5 targeted edits only
72
+ - ❌ Reading library source files (`useDataSource.jsx`, `DataModeProvider.jsx`, `DataModeToggle.jsx`, `dataStrategy.ts`)
73
+ - ❌ ChatBar, Eva, or Agentforce integration (that's Phase 3)
74
+ - ❌ Platform events or Apex classes (that's Phase 3)
75
+ - ❌ Renaming existing imports (don't add SAMPLE_ prefix — leave existing variable names alone, just fill in the `live:` props)
76
+ - ❌ Creating extra files not listed below
77
+ - ❌ Running `npm run build` between edits
49
78
 
50
- **How the switch works:** `ENABLE_SAMPLE_DATA_CACHE` in `src/lib/dataStrategy.ts` controls which data `useDataSource` returns. `CommandCenter.tsx` reads this flag and passes it to `DataModeProvider`. When the flag is `true` (default), mode is "sample." When `false`, mode is "live" and every `useDataSource` call returns its `live` prop instead.
79
+ ### The point of Phase 2
80
+ The dashboard switches from sample data (8 US travelers: Sarah Chen, Marcus Johnson…) to a completely different live dataset (12 global travelers: Raj Kapoor, Sofia Reyes… with a Midwest storm scenario). The user sees different names, different cities, different metrics, and different disruptions.
51
81
 
52
- **How to work:** Make surgical edits to the existing `EngineDashboard.tsx`. Do NOT rewrite the file.
82
+ ### How the switch works
83
+ `ENABLE_SAMPLE_DATA_CACHE` in `src/lib/dataStrategy.ts` controls the mode. `CommandCenter.tsx` reads this flag and passes `initialMode` to `DataModeProvider`. When `true` (default) → sample mode. When `false` → live mode, every `useDataSource` returns its `live` prop.
53
84
 
54
- **Files to read first (only these):**
85
+ ### Files to read (only these — no others)
55
86
  1. `src/pages/EngineDashboard.tsx` — the Phase 1 dashboard you're editing
56
87
  2. `src/hooks/useEngineLiveData.ts` — to see the live data shape
57
88
 
58
- **Do NOT read:** `useDataSource.jsx`, `DataModeProvider.jsx`, `dataStrategy.ts`, or any library component source. The patterns are right here.
89
+ ### Edits to make (exactly 5, in order)
59
90
 
60
- **Edits to make (in order):**
91
+ **Edit 1 — Add import** at the top of EngineDashboard.tsx:
92
+ ```tsx
93
+ import { useEngineLiveData } from "@/hooks/useEngineLiveData";
94
+ ```
61
95
 
62
- 1. **Add import** at the top of EngineDashboard.tsx:
63
- ```tsx
64
- import { useEngineLiveData } from "@/hooks/useEngineLiveData";
65
- ```
96
+ **Edit 2 — Add hook call** inside the component, near the top:
97
+ ```tsx
98
+ const live = useEngineLiveData();
99
+ ```
66
100
 
67
- 2. **Add hook call** inside the component, near the top:
68
- ```tsx
69
- const live = useEngineLiveData();
70
- ```
101
+ **Edit 3 — Update every `useDataSource` call** to pass live data:
102
+ ```tsx
103
+ // Before (Phase 1):
104
+ const markers = useDataSource({ sample: MAP_MARKERS, live: [] });
105
+ // After (Phase 2 — just fill in the live: prop):
106
+ const markers = useDataSource({ sample: MAP_MARKERS, live: live.mapMarkers });
107
+ ```
108
+ Do this for ALL useDataSource calls: markers, arcs, travelers, flights, escalations, disruptions, spendData.
71
109
 
72
- 3. **Update every `useDataSource` call** to pass live data:
73
- ```tsx
74
- // Before (Phase 1):
75
- const markers = useDataSource({ sample: MAP_MARKERS, live: [] });
76
- // After (Phase 2):
77
- const markers = useDataSource({ sample: MAP_MARKERS, live: live.mapMarkers });
78
- ```
79
- Do this for markers, arcs, travelers, flights, escalations, disruptions, spendData — whatever the dashboard uses.
110
+ **Edit 4 — Update KPI derivations** to react to active data:
111
+ ```tsx
112
+ const activeMetrics = live.loading ? null : live.metrics;
113
+ // Then use activeMetrics in KPI overlays when available, fall back to sample constants
114
+ ```
80
115
 
81
- 4. **Update KPI derivations** to react to active data:
82
- ```tsx
83
- const activeMetrics = live.loading ? SAMPLE_METRICS : live.metrics;
84
- ```
85
- Then use `activeMetrics` in KPI overlays instead of hardcoded sample constants.
116
+ **Edit 5 — Flip the backend switch** — edit `src/lib/dataStrategy.ts`:
117
+ ```tsx
118
+ export const ENABLE_SAMPLE_DATA_CACHE = false;
119
+ ```
86
120
 
87
- 5. **Flip the backend switch** — change `src/lib/dataStrategy.ts`:
88
- ```tsx
89
- export const ENABLE_SAMPLE_DATA_CACHE = false;
90
- ```
91
- This causes `CommandCenter.tsx` to pass `initialMode="live"` to `DataModeProvider`, and every `useDataSource` call now returns the live prop. The dashboard instantly shows the live dataset on next load.
121
+ > ⚠️ **Do NOT skip Edit 5.** This is the most critical step. Without it, the data never switches and the demo fails. The dashboard will still show sample data no matter what you wired in Edits 1-4.
92
122
 
93
- That's 5 targeted edits. Not a full rewrite.
123
+ That's 5 targeted edits, not a full rewrite.
94
124
 
95
- **No UI toggle.** There is no `DataModeToggle` in the dashboard. The switch is `ENABLE_SAMPLE_DATA_CACHE` in `dataStrategy.ts`.
125
+ ### After wiring — STOP and suggest (do not create yet)
96
126
 
97
- **After wiring — STOP and suggest (do not create yet):**
127
+ Say: *"I notice Flight__c doesn't have a field to track weather impact on individual flights. A Weather_Impact__c picklist would help the dashboard filter storm-affected flights. Want me to create it?"*
98
128
 
99
- Say something like: *"I notice Flight__c doesn't have a field to track weather impact on individual flights. A Weather_Impact__c picklist would help the dashboard filter storm-affected flights. Want me to create it?"*
100
-
101
- Only create `Flight__c.Weather_Impact__c` (PRD section 14a) AFTER the user confirms.
102
-
103
- **What NOT to build:**
104
- - No ChatBar or Eva — that's Phase 3
105
- - No platform events or Apex — that's Phase 3
106
- - Do NOT rewrite EngineDashboard.tsx from scratch
107
- - Do NOT add `DataModeToggle` to the UI
108
- - Do NOT read library component source files
109
- - Do NOT run `npm run build` between edits
129
+ Only create `Flight__c.Weather_Impact__c` (PRD section 14a) AFTER the user says yes. Suggest ONLY this one field — do not suggest additional fields.
110
130
 
111
131
  ---
112
132
 
113
133
  ## Phase 3 — Add Agentforce
114
134
 
115
- **How to work:** Make surgical edits to the existing `EngineDashboard.tsx`. Do NOT rewrite the file.
135
+ ### FORBIDDEN in Phase 3
136
+ - ❌ `AgentforceConversationClient` — do NOT use the iframe widget. We use the Agent REST API via `useEvaAgent`.
137
+ - ❌ Wrapper hooks or adapter files — do NOT create `useEvaChatAdapter.ts`, `useDisruptionAlerts.ts`, or any extra hook. Use `useEvaAgent` directly.
138
+ - ❌ `.env` or `.env.local` files — the config is hardcoded in `src/config/agentApi.ts` (pre-installed by the package)
139
+ - ❌ Rewriting `EngineDashboard.tsx` from scratch
140
+ - ❌ Reading library component source files (including `ChatBar.jsx`)
141
+ - ❌ Creating platform events or Apex classes without user confirmation
142
+ - ❌ Loading `agentforce-test`, `agentforce-observability`, or `outer-app` skills
116
143
 
117
- > **Important:** We do NOT use `AgentforceConversationClient` (the iframe widget). All agent communication goes through the REST-based Agent API via the `useEvaAgent` hook. The Vite dev server proxies the requests (`/sf-oauth` and `/sf-agent`) to avoid CORS issues.
144
+ ### Pre-installed files (already in the project — do NOT recreate)
145
+ These files are installed by the package and restored by the reset script. They already exist:
146
+ - `src/hooks/useEvaAgent.ts` — the Agent API hook (OAuth → session → messages → cleanup)
147
+ - `src/config/agentApi.ts` — hardcoded credentials and endpoint config
148
+ - `vite.config.ts` — already has `/sf-oauth` and `/sf-agent` proxy rules
118
149
 
119
- **Files to read first (only these):**
150
+ **Do NOT create, rewrite, or modify these files.** Just import and use them.
151
+
152
+ ### Files to read (only these)
120
153
  1. `src/pages/EngineDashboard.tsx` — the current dashboard
121
154
 
122
- **Edits to make (in order):**
123
-
124
- 1. **Add imports:**
125
- ```tsx
126
- import { ChatBar } from "@/components/library";
127
- import useEvaAgent from "@/hooks/useEvaAgent";
128
- ```
129
-
130
- 2. **Add chat suggestions constant** at module scope:
131
- ```tsx
132
- const CHAT_SUGGESTIONS = [
133
- "Are any travelers affected by the Denver weather?",
134
- "What's our rebooking policy for weather delays?",
135
- "Notify all travelers on disrupted flights",
136
- "Create a support case for the SFO→JFK cancellation",
137
- ];
138
- ```
139
-
140
- 3. **Add agent hook + handler** inside the component:
141
- ```tsx
142
- const { messages: evaMessages, isReady, isSending, connect, sendMessage } = useEvaAgent();
143
- useEffect(() => { connect(); }, [connect]);
144
-
145
- const handleChat = (text: string) => {
146
- sendMessage(text);
147
- return { text: `Looking into: "${text}"…` };
148
- };
149
- ```
150
-
151
- 4. **Insert ChatBar JSX** between the map section and the data panels:
152
- ```tsx
153
- <div className="px-4 pt-4">
154
- <ChatBar
155
- title="Eva"
156
- placeholder="Ask Eva anything about travelers, bookings, policy, or spend…"
157
- suggestions={CHAT_SUGGESTIONS}
158
- onSend={handleChat}
159
- />
160
- </div>
161
- ```
162
-
163
- 5. Do **NOT** add `AgentforceConversationClient` — the `useEvaAgent` hook replaces it entirely.
164
-
165
- **After adding Eva — STOP and suggest (do not create yet):**
155
+ ### Edits to make (exactly 4, in order)
156
+
157
+ **Edit 1 — Add imports** at the top of EngineDashboard.tsx:
158
+ ```tsx
159
+ import { ChatBar } from "@/components/library";
160
+ import useEvaAgent from "@/hooks/useEvaAgent";
161
+ ```
162
+
163
+ **Edit 2 — Add chat suggestions constant** at module scope (outside the component):
164
+ ```tsx
165
+ const CHAT_SUGGESTIONS = [
166
+ "Are any travelers affected by the Denver weather?",
167
+ "What's our rebooking policy for weather delays?",
168
+ "Notify all travelers on disrupted flights",
169
+ "Create a support case for the SFO→JFK cancellation",
170
+ ];
171
+ ```
172
+
173
+ **Edit 3 — Add agent hook + handler** inside the component:
174
+ ```tsx
175
+ const { messages: evaMessages, isReady, isSending, connect, sendMessage } = useEvaAgent();
176
+ useEffect(() => { connect(); }, [connect]);
177
+
178
+ const handleChat = (text: string) => {
179
+ sendMessage(text);
180
+ return { text: `Looking into: "${text}"…` };
181
+ };
182
+ ```
183
+
184
+ **Edit 4 — Insert ChatBar JSX** between the map section closing `</div>` and the data panels `<div>`:
185
+ ```tsx
186
+ {/* ── EVA CHATBAR ──────────────────────────────────────────────── */}
187
+ <div className="px-4 pt-4">
188
+ <ChatBar
189
+ title="Eva"
190
+ placeholder="Ask Eva anything about travelers, bookings, policy, or spend…"
191
+ suggestions={CHAT_SUGGESTIONS}
192
+ onSend={handleChat}
193
+ />
194
+ </div>
195
+ ```
196
+
197
+ That's 4 targeted edits. Nothing else.
198
+
199
+ ### After adding Eva — STOP and suggest (do not create yet)
166
200
 
167
201
  Say: *"The dashboard tracks disruptions in real time. I can create a Travel_Disruption_Alert__e platform event so disruption data can be published to the Salesforce event bus. Want me to set it up?"*
168
202
 
169
203
  Only create the platform event (PRD section 14b) AFTER the user confirms.
170
204
 
171
- **After the platform event — STOP and suggest again:**
205
+ ### After the platform event — STOP and suggest again
172
206
 
173
207
  Say: *"Now I'll write an Apex service class to publish disruption records to that event bus. Want me to create it?"*
174
208
 
175
209
  Only create `TravelDisruptionEventService` (PRD section 14c) AFTER the user confirms.
176
210
 
177
- **What NOT to build without asking:**
178
- - Do NOT use `AgentforceConversationClient` — use `useEvaAgent` hook instead
179
- - Do NOT create platform events or Apex classes without user confirmation
180
- - Do NOT rewrite EngineDashboard.tsx from scratch
181
- - Do NOT read library component source files
182
-
183
211
  ---
184
212
 
185
213
  ## Phase Summary
@@ -188,14 +216,16 @@ Only create `TravelDisruptionEventService` (PRD section 14c) AFTER the user conf
188
216
  |---|---------|---------|---------|
189
217
  | Dashboard layout & panels | Write new file | — | — |
190
218
  | Sample data | Wire (`live: []`) | — | — |
191
- | Live data wiring | Skip | Surgical edits | — |
192
- | Flip `dataStrategy.ts` to `false` | Skip | Edit | — |
219
+ | Live data wiring | Skip | 5 surgical edits | — |
220
+ | Flip `dataStrategy.ts` to `false` | Skip | **Edit 5 — don't skip** | — |
221
+ | DataModeToggle in UI | **NO — never** | **NO — never** | **NO — never** |
193
222
  | Custom field metadata | Skip | Suggest → wait | — |
194
- | ChatBar (Eva) | Skip | Skip | Surgical edit |
195
- | `useEvaAgent` hook (Agent API) | Skip | Skip | Surgical edit |
223
+ | ChatBar (Eva) | Skip | Skip | 4 surgical edits |
224
+ | `useEvaAgent` hook | Skip | Skip | Import (pre-installed) |
225
+ | Wrapper hooks / adapters | **NO — never** | **NO — never** | **NO — never** |
196
226
  | Platform event | Skip | Skip | Suggest → wait |
197
227
  | Apex service | Skip | Skip | Suggest → wait |
198
228
 
199
- **Data mode control:** `ENABLE_SAMPLE_DATA_CACHE` in `src/lib/dataStrategy.ts` is the backend switch. `CommandCenter.tsx` reads this flag and passes `initialMode` to `DataModeProvider`. Phase 1 leaves it `true` (sample data). Phase 2 flips it to `false` (live data — different travelers, cities, and metrics). There is no UI toggle.
229
+ **Data mode control:** `ENABLE_SAMPLE_DATA_CACHE` in `src/lib/dataStrategy.ts` is the backend switch. Phase 1 leaves it `true`. Phase 2 flips it to `false`. There is NO UI toggle — never add `DataModeToggle`.
200
230
 
201
- **Agent communication:** `useEvaAgent` hook in `src/hooks/useEvaAgent.ts` handles OAuth → session → messages → cleanup via the Agent REST API. Config is in `src/config/agentApi.ts`. Vite proxy rules (`/sf-oauth`, `/sf-agent`) in `vite.config.ts` forward requests to the Salesforce org and Agent API host.
231
+ **Agent communication:** `useEvaAgent` hook in `src/hooks/useEvaAgent.ts` handles OAuth → session → messages → cleanup via the Agent REST API. Config is in `src/config/agentApi.ts`. Vite proxy rules (`/sf-oauth`, `/sf-agent`) in `vite.config.ts` forward requests. All three files are pre-installed — do NOT recreate them.
package/.a4drules/skills/command-center-builder/improved-build-process.md CHANGED
@@ -3,35 +3,37 @@
3
3
  ## The #1 Rule: Phase 1 Writes, Phases 2-3 Edit
4
4
 
5
5
  - **Phase 1** creates `EngineDashboard.tsx` from scratch (Write). Also writes CommandCenter.tsx, Home.tsx, edits routes.tsx.
6
- - **Phase 2** makes ~5 surgical edits to the existing dashboard (StrReplace / targeted edits). Never rewrites the file.
7
- - **Phase 3** makes ~4 surgical edits to the existing dashboard (StrReplace / targeted edits). Never rewrites the file.
6
+ - **Phase 2** makes exactly 5 surgical edits. Never rewrites the file.
7
+ - **Phase 3** makes exactly 4 surgical edits. Never rewrites the file.
8
8
 
9
9
  Rewriting a 400+ line file from scratch takes 60 seconds, risks losing prior work, and can introduce regressions. Surgical edits take seconds each and preserve everything.
10
10
 
11
11
  ## Speed Rules
12
12
 
13
- 1. **Load only 2 files before building:** the PRD and this skill (command-center-builder). Do NOT load component-library, command-center-project, or outer-app skills — they add latency and aren't needed for the initial build.
13
+ 1. **Load only `command-center-builder` skill before building.** Do NOT load component-library, command-center-project, outer-app, agentforce-test, or agentforce-observability — they add latency and aren't needed.
14
14
 
15
- 2. **Do NOT read component source files.** The props for every component (GeoMap, BaseCard, Avatar, ChartCard, D3Chart, etc.) are documented in this skill and the PRD. Reading `GeoMap.jsx`, `BaseCard.jsx`, `useDataSource.js`, `DataModeProvider.jsx`, etc. wastes time and produces no new information.
15
+ 2. **Do NOT read component source files.** This means ALL files inside `src/components/library/` are off-limits: GeoMap.jsx, BaseCard.jsx, Avatar.jsx, ChatBar.jsx, D3Chart.jsx, useDataSource.jsx, DataModeProvider.jsx, DataModeToggle.jsx, etc. Props/patterns are documented in the build guide and PRD.
16
16
 
17
- 3. **Phase 1: Write the dashboard in one pass.** Plan the full file before writing. Do not write a partial dashboard and iterate — write the complete component with all imports, data, and JSX in a single Write call. Then write all 4 files without stopping.
17
+ 3. **Phase 1: Write the dashboard in one pass.** Plan the full file before writing. Write the complete component with all imports, data, and JSX in a single Write call.
18
18
 
19
- 4. **Phases 2-3: Make targeted edits only.** Read the existing dashboard, then make specific edits (add imports, update lines, insert JSX blocks). Do NOT use Write to replace the entire file.
19
+ 4. **Phases 2-3: Make the exact edits listed in the build guide.** Phase 2 = 5 edits. Phase 3 = 4 edits. No more, no less.
20
20
 
21
- 5. **Do NOT run `npm run build`, `npm run dev`, `tsc`, or `npm run validate:dashboard` during the build.** These waste time. The Vite build handles JSX/TSX regardless of TypeScript errors, and pre-existing TS7016 errors (from untyped .jsx library files) are normal.
21
+ 5. **Do NOT run `npm run build`, `npm run dev`, `tsc`, or `npm run validate:dashboard` during the build.** Vite handles it. TS7016 errors are pre-existing and expected.
22
22
 
23
- 6. **STOP and ASK before creating metadata.** Custom fields, platform events, and Apex classes are scripted demo moments. Suggest them, wait for "yes," then create. Never just create them.
23
+ 6. **STOP and ASK before creating metadata.** Custom fields, platform events, and Apex classes are scripted demo moments. Suggest, wait, create.
24
+
25
+ 7. **Do NOT create extra files.** No wrapper hooks (useEvaChatAdapter, useDisruptionAlerts), no .env files, no adapter files. The build guide lists every file to create or edit.
24
26
 
25
27
  ## Phase 1 File Write Order
26
28
 
27
29
  ```
28
- 1. src/pages/EngineDashboard.tsx ← full dashboard, one pass
29
- 2. src/components/workspace/CommandCenter.tsx ← import dashboard
30
- 3. src/pages/Home.tsx ← REPLACE with CommandCenter wrapper
31
- 4. src/routes.tsx ← edit index route label to "Dashboard"
30
+ 1. WRITE src/pages/EngineDashboard.tsx ← full dashboard, one pass
31
+ 2. EDIT src/components/workspace/CommandCenter.tsx ← swap BlankDashboard → EngineDashboard
32
+ 3. WRITE src/pages/Home.tsx ← 3-line CommandCenter wrapper
33
+ 4. EDIT src/routes.tsx ← change index route label to "Dashboard"
32
34
  ```
33
35
 
34
- ## Phase 2 Edit Order
36
+ ## Phase 2 Edit Order (5 edits)
35
37
 
36
38
  ```
37
39
  1. Add useEngineLiveData import to EngineDashboard.tsx
@@ -42,27 +44,37 @@ Rewriting a 400+ line file from scratch takes 60 seconds, risks losing prior wor
42
44
  → STOP — suggest Weather_Impact__c, wait for confirmation
43
45
  ```
44
46
 
45
- No UI toggle. The switch is `ENABLE_SAMPLE_DATA_CACHE` in `dataStrategy.ts`. When `false`, `CommandCenter.tsx` passes `initialMode="live"` and every `useDataSource` returns its live prop.
47
+ ⚠️ **Edit 5 is the most critical.** Without it, the data never switches and the demo fails.
48
+
49
+ **NEVER add DataModeToggle to the UI.** The switch is `ENABLE_SAMPLE_DATA_CACHE` in `dataStrategy.ts`.
46
50
 
47
- ## Phase 3 Edit Order
51
+ ## Phase 3 Edit Order (4 edits)
48
52
 
49
53
  ```
50
- 1. Add ChatBar import (if not in barrel import)
51
- 2. Add CHAT_SUGGESTIONS constant + handleChat function
52
- 3. Insert <ChatBar /> JSX between map and data panels
53
- 4. Add AgentforceConversationClient
54
+ 1. Add ChatBar + useEvaAgent imports to EngineDashboard.tsx
55
+ 2. Add CHAT_SUGGESTIONS constant at module scope
56
+ 3. Add useEvaAgent hook call + handleChat inside component
57
+ 4. Insert <ChatBar /> JSX between map and data panels
54
58
  → STOP — suggest platform event, wait for confirmation
55
59
  → STOP — suggest Apex class, wait for confirmation
56
60
  ```
57
61
 
62
+ **useEvaAgent, agentApi.ts, and vite.config.ts proxy rules are pre-installed.** Do NOT recreate them. Just import `useEvaAgent` from `@/hooks/useEvaAgent`.
63
+
64
+ **NEVER use AgentforceConversationClient.** We use the Agent REST API via `useEvaAgent`.
65
+
66
+ **NEVER create wrapper hooks** (useEvaChatAdapter, useDisruptionAlerts, etc.). Use `useEvaAgent` directly.
67
+
58
68
  ## Common Time Wasters
59
69
 
60
70
  | Waste | Fix |
61
71
  |-------|-----|
62
- | Loading 4-5 skills before starting | Load only command-center-builder + PRD |
63
- | Reading GeoMap.jsx, Avatar.jsx, useDataSource.js source | Props/patterns are in this skill — trust the docs |
64
- | Rewriting EngineDashboard.tsx from scratch in Phase 2/3 | Make 5 surgical edits, not a 454-line rewrite |
65
- | Running `npm run build` between edits | Don't — Vite handles it, TS errors are pre-existing |
66
- | Fixing imports iteratively (wrong icon names, wrong exports) | Check the PRD and this skill for exact import names before writing |
67
- | Writing Home.tsx with Account Search content | REPLACE it with the 3-line CommandCenter wrapper (see WIRING section) |
68
- | Creating metadata without asking | STOP, suggest, wait for "yes" — it's a scripted demo moment |
72
+ | Loading 4-5 skills before starting | Load only command-center-builder |
73
+ | Reading GeoMap.jsx, ChatBar.jsx, useDataSource.js source | Props are in the build guide — trust the docs |
74
+ | Rewriting EngineDashboard.tsx in Phase 2/3 | Make 5 or 4 targeted edits |
75
+ | Running `npm run build` between edits | Don't — Vite handles it |
76
+ | Adding DataModeToggle to the UI | **NEVER** — the switch is dataStrategy.ts |
77
+ | Creating useEvaChatAdapter or useDisruptionAlerts | **NEVER** — use useEvaAgent directly, no wrappers |
78
+ | Creating .env or .env.local files | **NEVER** — config is hardcoded in src/config/agentApi.ts |
79
+ | Renaming imports with SAMPLE_ prefix | Don't rename — just fill in the `live:` props |
80
+ | Suggesting 3+ custom fields | Suggest only Weather_Impact__c |
package/CHANGELOG.md CHANGED
@@ -5,6 +5,28 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
+ ## [1.9.86] - 2026-04-07
9
+
10
+ ### Changed
11
+ - **Strengthened build guide and PRD guardrails** — Based on observed agent failures across 3 demo runs:
12
+ - Every phase now has a prominent **FORBIDDEN** section with ❌ markers listing exact violations
13
+ - Phase 2: `DataModeToggle` prohibition is now the first forbidden item (agents kept adding it despite the rule existing)
14
+ - Phase 2: `dataStrategy.ts` flip is marked with ⚠️ CRITICAL and a warning that the demo fails without it
15
+ - Phase 3: Explicit prohibition of wrapper hooks (`useEvaChatAdapter`, `useDisruptionAlerts`), `.env` files, and recreating pre-installed files
16
+ - Phase 3: Lists pre-installed files (`useEvaAgent.ts`, `agentApi.ts`, proxy config) with "do NOT recreate" instruction
17
+ - All phases: Explicit prohibition of reading library source files with full file list
18
+ - All phases: Explicit prohibition of loading unnecessary skills (only `command-center-builder` needed)
19
+ - All phases: Edit counts are now exact ("exactly 5 edits", "exactly 4 edits") to prevent scope creep
20
+ - Phase 2: Explicit prohibition of renaming imports with SAMPLE_ prefix
21
+ - Phase 2: Limit suggestion to only Weather_Impact__c (agents were suggesting 3+ fields)
22
+
23
+ ## [1.9.85] - 2026-04-07
24
+
25
+ ### Fixed
26
+ - **Reset script now restores Agent API files** — `src/hooks/useEvaAgent.ts` and `src/config/agentApi.ts` are now restored from the package during reset, so Phase 3 finds them instead of the agent writing them from scratch with a different pattern.
27
+ - **Reset script now restores `dataStrategy.ts`** — `ENABLE_SAMPLE_DATA_CACHE` is reset back to `true` so the next demo run starts in sample mode (Phase 1) instead of live mode left over from Phase 2.
28
+ - **Reset complete banner** updated to list all restored files.
29
+
8
30
  ## [1.9.84] - 2026-04-07
9
31
 
10
32
  ### Fixed
package/data/engine-command-center-prd.md CHANGED
@@ -341,6 +341,12 @@ Every element supports light and dark. GeoMap: `theme={mode === "dark" ? "dark"
341
341
 
342
342
  Build incrementally in 3 prompts. Each prompt builds on the previous result. The user prompt (blockquote) is what you copy-paste. The agent instructions below each prompt are guidance for the AI — not shown to the user.
343
343
 
344
+ > **CRITICAL — Rules for ALL prompts:**
345
+ > - Do NOT read any file inside `src/components/library/` (GeoMap.jsx, ChatBar.jsx, BaseCard.jsx, useDataSource.jsx, DataModeProvider.jsx, etc.) — all props/patterns are documented here and in the build guide.
346
+ > - Do NOT load unnecessary skills — only `command-center-builder` is needed.
347
+ > - Do NOT run `npm run build` during the build — Vite handles it.
348
+ > - Do NOT create files not listed in the instructions below.
349
+
344
350
  ---
345
351
 
346
352
  ### Prompt 1 — Build the Dashboard
@@ -349,19 +355,21 @@ Build incrementally in 3 prompts. Each prompt builds on the previous result. The
349
355
 
350
356
  **What the agent must do:**
351
357
 
352
- 1. Read the PRD and the `command-center-builder` skill for conventions
353
- 2. Create `src/pages/EngineDashboard.tsx` with the full dashboard
354
- 3. Update `src/components/workspace/CommandCenter.tsx` to import EngineDashboard
355
- 4. **Rewrite `src/pages/Home.tsx`** to render CommandCenter (it ships as Account Search — must be replaced)
356
- 5. **Update `src/routes.tsx`** to set Home as the index route with label "Dashboard"
357
- 6. Add Engine brand tokens to `global.css` if not already present
358
+ 1. Load ONLY the `command-center-builder` skill (no other skills)
359
+ 2. Read ONLY the PRD and `src/data/engine-sample-data.js` — no other files before writing
360
+ 3. Create `src/pages/EngineDashboard.tsx` with the full dashboard in ONE write
361
+ 4. Update `src/components/workspace/CommandCenter.tsx` to import EngineDashboard
362
+ 5. **Rewrite `src/pages/Home.tsx`** to render CommandCenter (it ships as Account Search — must be replaced with a 3-line wrapper)
363
+ 6. **Update `src/routes.tsx`** to set Home as the index route with label "Dashboard"
358
364
 
359
- **What the agent must NOT do in this prompt:**
360
- - Do NOT add the ChatBar or any Eva/Agentforce integration — that's Prompt 3
361
- - Do NOT wire up live data or `useEngineLiveData` — that's Prompt 2
362
- - Do NOT create Salesforce metadata (custom fields, platform events, Apex) — that's Prompts 2 and 3
365
+ **FORBIDDEN in Prompt 1:**
366
+ - ❌ ChatBar, Eva, or any Agentforce integration (Prompt 3)
367
+ - ❌ `useEngineLiveData` or live data wiring (Prompt 2)
368
+ - ❌ Salesforce metadata — custom fields, platform events, Apex (Prompts 2-3)
369
+ - ❌ Reading library component source files (GeoMap.jsx, BaseCard.jsx, etc.)
370
+ - ❌ Loading `outer-app`, `component-library`, `command-center-project`, or other skills
363
371
 
364
- **Common failure:** The agent creates the dashboard file but forgets to update `Home.tsx` and `routes.tsx`, so the user still sees the Account Search page. The wiring section at the top of `.a4drules/skills/command-center-builder/SKILL.md` explains all required file changes.
372
+ **Common failure:** The agent creates the dashboard file but forgets to update `Home.tsx` and `routes.tsx`, so the user still sees the Account Search page.
365
373
 
366
374
  ---
367
375
 
@@ -369,23 +377,25 @@ Build incrementally in 3 prompts. Each prompt builds on the previous result. The
369
377
 
370
378
  > Now let's connect this to real data. There's a second dataset with different travelers and metrics — hook that up as the "live" data source so the dashboard can pull from either dataset depending on the backend config. After that, see if there are any data model improvements we should make for tracking weather disruptions.
371
379
 
372
- **What the agent must do:**
373
-
374
- 1. Read only `EngineDashboard.tsx` and `src/hooks/useEngineLiveData.ts` — don't read `useDataSource.jsx`, `DataModeProvider.jsx`, or other library source files (the patterns are in the build guide)
375
- 2. Make **surgical edits** to the existing `EngineDashboard.tsx` — do NOT rewrite the entire file
376
- 3. Add `useEngineLiveData` import and hook call
377
- 4. Update every `useDataSource({ sample, live })` call to pass live data
378
- 5. Update KPI overlays to derive from whichever metrics are active
379
- 6. **Flip the backend switch:** change `ENABLE_SAMPLE_DATA_CACHE` from `true` to `false` in `src/lib/dataStrategy.ts` — this makes `CommandCenter.tsx` pass `initialMode="live"` to `DataModeProvider`, so every `useDataSource` call now returns the live prop. The dashboard will show completely different data: 12 global travelers (Raj Kapoor, Sofia Reyes…) instead of 8 US travelers, a Midwest storm scenario, and different metrics.
380
- 7. After wiring is complete, **STOP and suggest** the `Weather_Impact__c` custom field — do NOT create it until the user confirms
381
-
382
- **What the agent must NOT do in this prompt:**
383
- - Do NOT rewrite `EngineDashboard.tsx` from scratch — make targeted edits to the existing Phase 1 file
384
- - Do NOT read library component source files (`useDataSource.jsx`, `DataModeProvider.jsx`, `dataStrategy.ts`) — the wiring patterns are in the build guide
385
- - Do NOT add `DataModeToggle` to the UI — there is no UI toggle, the switch is `dataStrategy.ts`
386
- - Do NOT create the custom field without asking first — suggest it, then wait for "yes"
387
- - Do NOT add ChatBar, Eva, or any Agentforce integration — that's Prompt 3
388
- - Do NOT run `npm run build` between edits
380
+ **What the agent must do (exactly 5 edits + 1 suggestion):**
381
+
382
+ 1. Read ONLY `EngineDashboard.tsx` and `src/hooks/useEngineLiveData.ts` — no other files
383
+ 2. **Edit 1:** Add `useEngineLiveData` import to EngineDashboard.tsx
384
+ 3. **Edit 2:** Add `const live = useEngineLiveData()` hook call
385
+ 4. **Edit 3:** Update every `useDataSource({ sample, live: [] })` to pass `live: live.xxx`
386
+ 5. **Edit 4:** Update KPI derivations to use reactive metrics
387
+ 6. **Edit 5:** ⚠️ **CRITICAL — Flip `ENABLE_SAMPLE_DATA_CACHE` from `true` to `false` in `src/lib/dataStrategy.ts`** — without this, the data never switches and the demo fails
388
+ 7. After all edits, **STOP and suggest** ONLY `Weather_Impact__c` — do NOT create it until the user says yes
389
+
390
+ **FORBIDDEN in Prompt 2:**
391
+ - ❌ **`DataModeToggle`** — do NOT add it to the UI. There is NO UI toggle. The switch is `dataStrategy.ts`. This is the most common agent mistake.
392
+ - ❌ Rewriting `EngineDashboard.tsx` from scratch (make 5 targeted edits)
393
+ - ❌ Renaming existing imports with `SAMPLE_` prefix (leave variable names alone, just fill in `live:` props)
394
+ - ❌ Reading library source files (`useDataSource.jsx`, `DataModeProvider.jsx`, `DataModeToggle.jsx`)
395
+ - ❌ ChatBar, Eva, or Agentforce (Prompt 3)
396
+ - ❌ Running `npm run build` between edits
397
+ - ❌ Suggesting more than one custom field (only `Weather_Impact__c`)
398
+ - ❌ Creating extra files not listed above
389
399
 
390
400
  **Reference — what the agent should say after wiring:**
391
401
 
@@ -397,20 +407,30 @@ Build incrementally in 3 prompts. Each prompt builds on the previous result. The
397
407
 
398
408
  > Last piece — let's add Eva, the AI travel assistant. I want a chat bar right below the map where people can ask her questions about travelers and disruptions. Also hook up the real Agentforce agent so she can actually do things. Then let's set up the backend so disruption alerts can flow through the platform in real time.
399
409
 
400
- **What the agent must do:**
401
-
402
- 1. Make **surgical edits** to the existing `EngineDashboard.tsx` — do NOT rewrite the entire file
403
- 2. Add `ChatBar` with suggestions from section 9, placed between map and data panels
404
- 3. Add `useEvaAgent` hook — import from `@/hooks/useEvaAgent`, call `connect()` on mount, wire `sendMessage` to `handleChat`
405
- 4. Do NOT use `AgentforceConversationClient` (the iframe widget) — we use the Agent REST API via the `useEvaAgent` hook
406
- 5. After adding Eva, **STOP and suggest** the platform event — do NOT create it until the user confirms
407
- 6. After user confirms and platform event is created, **STOP and suggest** the Apex class — do NOT create it until the user confirms
408
-
409
- **What the agent must NOT do in this prompt:**
410
- - Do NOT use `AgentforceConversationClient` — use `useEvaAgent` hook instead (Agent REST API)
411
- - Do NOT rewrite `EngineDashboard.tsx` from scratch — make targeted edits to the existing Phase 2 file
412
- - Do NOT create platform events or Apex classes without user confirmation — each is a scripted demo moment where you suggest, wait, then create
413
- - Do NOT read library component source files
410
+ **Pre-installed files (already in the project — do NOT recreate):**
411
+ - `src/hooks/useEvaAgent.ts` — Agent API hook (OAuth → session → messages → cleanup)
412
+ - `src/config/agentApi.ts` — hardcoded credentials and endpoints
413
+ - `vite.config.ts` — already has `/sf-oauth` and `/sf-agent` proxy rules
414
+
415
+ **What the agent must do (exactly 4 edits + 2 suggestions):**
416
+
417
+ 1. Read ONLY `src/pages/EngineDashboard.tsx` — no other files
418
+ 2. **Edit 1:** Add `ChatBar` and `useEvaAgent` imports
419
+ 3. **Edit 2:** Add `CHAT_SUGGESTIONS` constant at module scope
420
+ 4. **Edit 3:** Add `useEvaAgent` hook call + `handleChat` handler inside component
421
+ 5. **Edit 4:** Insert `<ChatBar />` JSX between map and data panels
422
+ 6. After adding Eva, **STOP and suggest** the platform event — wait for user confirmation
423
+ 7. After platform event, **STOP and suggest** the Apex class — wait for user confirmation
424
+
425
+ **FORBIDDEN in Prompt 3:**
426
+ - ❌ **`AgentforceConversationClient`** — do NOT use the iframe widget. We use the Agent REST API via `useEvaAgent`.
427
+ - ❌ **Wrapper hooks** — do NOT create `useEvaChatAdapter.ts`, `useDisruptionAlerts.ts`, or any extra hook file. Use `useEvaAgent` directly.
428
+ - ❌ **`.env` or `.env.local` files** — config is hardcoded in `src/config/agentApi.ts`
429
+ - ❌ **Recreating `useEvaAgent.ts`, `agentApi.ts`, or proxy config** — these are pre-installed
430
+ - ❌ Rewriting `EngineDashboard.tsx` from scratch
431
+ - ❌ Reading library source files (including `ChatBar.jsx`)
432
+ - ❌ Creating platform events or Apex without user confirmation
433
+ - ❌ Loading `agentforce-test`, `agentforce-observability`, or `outer-app` skills
414
434
 
415
435
  **Reference — what the agent should say (in sequence, stopping after each):**
416
436
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@schandlergarcia/sf-web-components",
3
- "version": "1.9.84",
3
+ "version": "1.9.86",
4
4
  "description": "Reusable Salesforce web components library with Tailwind CSS v4 and shadcn/ui",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
package/scripts/reset-command-center.sh CHANGED
@@ -653,22 +653,32 @@ echo "→ Restoring ${ENGINE_DATA}..."
653
653
 
654
654
  # Detect package location
655
655
  if [ -d "node_modules/@schandlergarcia/sf-web-components/data" ]; then
656
- PACKAGE_DATA="node_modules/@schandlergarcia/sf-web-components/data/engine-sample-data.js"
657
- PACKAGE_LIVE_DATA="node_modules/@schandlergarcia/sf-web-components/data/engine-live-data.js"
658
- PACKAGE_LIVE_HOOK="node_modules/@schandlergarcia/sf-web-components/data/useEngineLiveData.ts"
659
- PACKAGE_SCHEMA="node_modules/@schandlergarcia/sf-web-components/data/schema.graphql"
656
+ PKG="node_modules/@schandlergarcia/sf-web-components"
657
+ PACKAGE_DATA="$PKG/data/engine-sample-data.js"
658
+ PACKAGE_LIVE_DATA="$PKG/data/engine-live-data.js"
659
+ PACKAGE_LIVE_HOOK="$PKG/data/useEngineLiveData.ts"
660
+ PACKAGE_SCHEMA="$PKG/data/schema.graphql"
661
+ PACKAGE_EVA_HOOK="$PKG/data/useEvaAgent.ts"
662
+ PACKAGE_AGENT_CONFIG="$PKG/data/agentApiConfig.ts"
663
+ PACKAGE_DATA_STRATEGY="$PKG/src/templates/lib/dataStrategy.ts.template"
660
664
  elif [ -f "$SCRIPT_DIR/../data/engine-sample-data.js" ]; then
661
665
  # Running from package source
662
666
  PACKAGE_DATA="$SCRIPT_DIR/../data/engine-sample-data.js"
663
667
  PACKAGE_LIVE_DATA="$SCRIPT_DIR/../data/engine-live-data.js"
664
668
  PACKAGE_LIVE_HOOK="$SCRIPT_DIR/../data/useEngineLiveData.ts"
665
669
  PACKAGE_SCHEMA="$SCRIPT_DIR/../data/schema.graphql"
670
+ PACKAGE_EVA_HOOK="$SCRIPT_DIR/../data/useEvaAgent.ts"
671
+ PACKAGE_AGENT_CONFIG="$SCRIPT_DIR/../data/agentApiConfig.ts"
672
+ PACKAGE_DATA_STRATEGY="$SCRIPT_DIR/../src/templates/lib/dataStrategy.ts.template"
666
673
  else
667
674
  echo " ⚠ Could not find engine-sample-data.js in package"
668
675
  PACKAGE_DATA=""
669
676
  PACKAGE_LIVE_DATA=""
670
677
  PACKAGE_LIVE_HOOK=""
671
678
  PACKAGE_SCHEMA=""
679
+ PACKAGE_EVA_HOOK=""
680
+ PACKAGE_AGENT_CONFIG=""
681
+ PACKAGE_DATA_STRATEGY=""
672
682
  fi
673
683
 
674
684
  if [ -n "$PACKAGE_DATA" ] && [ -f "$PACKAGE_DATA" ]; then
@@ -712,6 +722,40 @@ else
712
722
  echo " ⚠ Skipped live data hook (package hook not found)"
713
723
  fi
714
724
 
725
+ # Restore useEvaAgent.ts (Agentforce Agent API hook)
726
+ EVA_HOOK="src/hooks/useEvaAgent.ts"
727
+ echo "→ Restoring ${EVA_HOOK}..."
728
+
729
+ if [ -n "$PACKAGE_EVA_HOOK" ] && [ -f "$PACKAGE_EVA_HOOK" ]; then
730
+ cp "$PACKAGE_EVA_HOOK" "$EVA_HOOK"
731
+ echo " ✓ Eva agent hook restored"
732
+ else
733
+ echo " ⚠ Skipped Eva agent hook (package hook not found)"
734
+ fi
735
+
736
+ # Restore agentApiConfig.ts → src/config/agentApi.ts
737
+ mkdir -p src/config
738
+ AGENT_CONFIG="src/config/agentApi.ts"
739
+ echo "→ Restoring ${AGENT_CONFIG}..."
740
+
741
+ if [ -n "$PACKAGE_AGENT_CONFIG" ] && [ -f "$PACKAGE_AGENT_CONFIG" ]; then
742
+ cp "$PACKAGE_AGENT_CONFIG" "$AGENT_CONFIG"
743
+ echo " ✓ Agent API config restored"
744
+ else
745
+ echo " ⚠ Skipped Agent API config (package config not found)"
746
+ fi
747
+
748
+ # Restore dataStrategy.ts (reset ENABLE_SAMPLE_DATA_CACHE back to true)
749
+ DATA_STRATEGY="src/lib/dataStrategy.ts"
750
+ echo "→ Restoring ${DATA_STRATEGY}..."
751
+
752
+ if [ -n "$PACKAGE_DATA_STRATEGY" ] && [ -f "$PACKAGE_DATA_STRATEGY" ]; then
753
+ cp "$PACKAGE_DATA_STRATEGY" "$DATA_STRATEGY"
754
+ echo " ✓ Data strategy restored (ENABLE_SAMPLE_DATA_CACHE = true)"
755
+ else
756
+ echo " ⚠ Skipped data strategy (package template not found)"
757
+ fi
758
+
715
759
  # Restore engine-command-center-prd.md
716
760
  PRD_FILE="engine-command-center-prd.md"
717
761
  echo "→ Restoring ${PRD_FILE}..."
@@ -823,6 +867,9 @@ echo "║ Restored: ║"
823
867
  echo "║ • Engine brand theme (global.css) ║"
824
868
  echo "║ • Engine sample data + live data ║"
825
869
  echo "║ • Live data hook (useEngineLiveData.ts) ║"
870
+ echo "║ • Eva agent hook (useEvaAgent.ts) ║"
871
+ echo "║ • Agent API config (src/config/agentApi.ts)║"
872
+ echo "║ • Data strategy (ENABLE_SAMPLE_DATA_CACHE) ║"
826
873
  echo "║ • GraphQL schema + PRD + logo ║"
827
874
  echo "║ • Component library + theme providers ║"
828
875
  echo "║ ║"