codeapp-js 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/codeApp/dist/codeapp.js +326 -72
  2. package/codeApp/dist/icon-512.png +0 -0
  3. package/codeApp/dist/index.html +1 -0
  4. package/codeApp/dist/index.js +1 -1
  5. package/codeApp/dist/power-apps-data.js +2952 -2531
  6. package/codeApp/power.config.json +1 -1
  7. package/dev files/customConnector.js +98 -0
  8. package/dev files/dataverse.js +33 -7
  9. package/dev files/environmentVar.js +1 -1
  10. package/dev files/office365groups.js +1 -1
  11. package/dev files/office365users.js +1 -1
  12. package/dev files/outlook.js +1 -1
  13. package/dev files/power-apps-data.js +2952 -0
  14. package/dev files/sharepoint.js +1 -1
  15. package/examples/combined demo/dist/codeapp.js +1098 -0
  16. package/examples/combined demo/dist/index.js +470 -515
  17. package/examples/combined demo/dist/power-apps-data.js +3007 -2531
  18. package/examples/dataverse Demo/dist/codeapp.js +1085 -0
  19. package/examples/dataverse Demo/dist/index.js +38 -26
  20. package/examples/dataverse Demo/dist/power-apps-data.js +2912 -2531
  21. package/examples/groups Demo/dist/codeapp.js +1085 -0
  22. package/examples/groups Demo/dist/index.js +113 -113
  23. package/examples/groups Demo/dist/power-apps-data.js +2912 -2531
  24. package/examples/groups Demo/power.config.json +3 -2
  25. package/examples/kanban/dist/power-apps-data.js +2953 -2531
  26. package/examples/myProfile/dist/power-apps-data.js +2953 -2531
  27. package/examples/outlook Demo/dist/codeapp.js +1085 -0
  28. package/examples/outlook Demo/dist/index.js +39 -35
  29. package/examples/outlook Demo/dist/power-apps-data.js +2912 -2531
  30. package/examples/planning Poker/dist/power-apps-data.js +2953 -2531
  31. package/examples/sharePoint Demo/dist/codeapp.js +1085 -0
  32. package/examples/sharePoint Demo/dist/index.js +262 -269
  33. package/examples/sharePoint Demo/dist/power-apps-data.js +2912 -2531
  34. package/examples/solution explorer/agent/decision-log.md +27 -0
  35. package/examples/solution explorer/agent/mockup-01-swiss-grid.html +452 -0
  36. package/examples/solution explorer/agent/mockup-02-dark-glass.html +496 -0
  37. package/examples/solution explorer/agent/mockup-03-paper-console.html +510 -0
  38. package/examples/solution explorer/agent/mockup-04-neon-noir.html +546 -0
  39. package/examples/solution explorer/agent/mockup-05-zen-garden.html +534 -0
  40. package/examples/solution explorer/dist/codeapp.js +1098 -0
  41. package/examples/solution explorer/dist/icon-512.png +0 -0
  42. package/examples/solution explorer/dist/index.html +80 -0
  43. package/examples/solution explorer/dist/index.js +735 -0
  44. package/examples/solution explorer/dist/power-apps-data.js +3007 -0
  45. package/examples/solution explorer/dist/styles.css +571 -0
  46. package/examples/solution explorer/power.config.json +151 -0
  47. package/examples/todo/dist/power-apps-data.js +2953 -2531
  48. package/package.json +1 -8
  49. package/.github/instructions/wyattdave.instructions.md +0 -39
  50. package/examples/combined demo/dist/dataverse.js +0 -86
  51. package/examples/combined demo/dist/environmentVar.js +0 -55
  52. package/examples/combined demo/dist/office365groups.js +0 -97
  53. package/examples/combined demo/dist/office365users.js +0 -169
  54. package/examples/combined demo/dist/outlook.js +0 -162
  55. package/examples/combined demo/dist/sharepoint.js +0 -339
  56. package/examples/dataverse Demo/dist/dataverse.js +0 -86
  57. package/examples/groups Demo/dist/dataverse.js +0 -86
  58. package/examples/groups Demo/dist/environmentVar.js +0 -55
  59. package/examples/groups Demo/dist/office365groups.js +0 -97
  60. package/examples/groups Demo/dist/office365users.js +0 -169
  61. package/examples/groups Demo/dist/outlook.js +0 -162
  62. package/examples/groups Demo/dist/sharepoint.js +0 -339
  63. package/examples/sharePoint Demo/dist/dataverse.js +0 -94
  64. package/examples/sharePoint Demo/dist/environmentVar.js +0 -55
  65. package/examples/sharePoint Demo/dist/office365groups.js +0 -97
  66. package/examples/sharePoint Demo/dist/office365users.js +0 -169
  67. package/examples/sharePoint Demo/dist/outlook.js +0 -162
  68. package/examples/sharePoint Demo/dist/sharepoint.js +0 -339
  69. package/scripts/build-power-sdk.mjs +0 -69
@@ -0,0 +1,27 @@
1
+
2
+ # Solution Explorer — Design Decision Log
3
+
4
+ ## App Purpose
5
+ Browse all Dataverse solutions in a Power Apps environment and drill into their components. Uses `codeapp.js` for all Dataverse connections via `registerTable` / `listItems`.
6
+
7
+ ## Dataverse Tables
8
+ - **solutions** (PK: `solutionid`) — fields: `friendlyname`, `uniquename`, `version`, `ismanaged`, `modifiedon`, `description`
9
+ - **solutioncomponents** (PK: `solutioncomponentid`) — filter by `_solutionid_value`, read `componenttype`, `objectid`
10
+
11
+ ## Mockup Summary
12
+
13
+ | # | File | Aesthetic | Theme | Layout | Typography |
14
+ |---|------|-----------|-------|--------|------------|
15
+ | 1 | mockup-01-swiss-grid.html | Swiss/International Typographic | Light cream | Side-panel list + detail pane | DM Mono + Instrument Serif |
16
+ | 2 | mockup-02-dark-glass.html | Glassmorphism dark | Deep black + purple/cyan glows | Stats row + card list + glass detail | Outfit + Cormorant Garamond |
17
+ | 3 | mockup-03-paper-console.html | Developer paper/console | Warm paper + lined bg | Table rows + collapsible tree | IBM Plex Mono + Playfair Display |
18
+ | 4 | mockup-04-neon-noir.html | Cyberpunk/terminal | Pure black + cyan/magenta neon | Terminal search + list + accordion detail | JetBrains Mono + Syne |
19
+ | 5 | mockup-05-zen-garden.html | Organic/natural zen | Warm whites + sage/terracotta | Card tile grid + slide-out drawer | Karla + Crimson Pro |
20
+
21
+ ## Share Feature
22
+ - Share modal: click any component row to share with User (systemusers) or Team (teams) via Dataverse search
23
+ - Share uses `callUnboundAction` from `codeapp.js` with `GrantAccess` registered in power.config.json
24
+ - `GrantAccess` declared in `databaseReferences.default.cds.dataSources`, `initDataSources`, and `registerCoreTables`
25
+ - Access mask grants Read, Write, Append, AppendTo, Share, Assign rights
26
+ - Component type → entity logical name mapping used for Target entity reference
27
+ - Previous raw `getRawClient` workaround replaced with proper `callUnboundAction('', '', 'GrantAccess', params)` pattern per updated skill
@@ -0,0 +1,452 @@
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>Mockup 01 — Swiss Grid</title>
7
+ <style>
8
+ :root {
9
+ --bg: #fafaf8;
10
+ --ink: #0d0d0d;
11
+ --muted: #7a7a72;
12
+ --red: #e03c31;
13
+ --red-soft: rgba(224,60,49,0.08);
14
+ --line: #d4d4cc;
15
+ --card: #ffffff;
16
+ --shadow: 0 1px 3px rgba(0,0,0,0.06);
17
+ --radius: 2px;
18
+ }
19
+ * { box-sizing: border-box; margin: 0; padding: 0; }
20
+ body {
21
+ min-height: 100vh;
22
+ font-family: 'DM Mono', monospace;
23
+ color: var(--ink);
24
+ background: var(--bg);
25
+ line-height: 1.5;
26
+ }
27
+
28
+ /* ── Top Bar ─────────────────────────────── */
29
+ .topbar {
30
+ display: flex;
31
+ align-items: center;
32
+ justify-content: space-between;
33
+ padding: 16px 40px;
34
+ border-bottom: 3px solid var(--ink);
35
+ }
36
+ .topbar h1 {
37
+ font-family: 'Instrument Serif', serif;
38
+ font-size: 1.4rem;
39
+ font-weight: 400;
40
+ letter-spacing: 0.02em;
41
+ }
42
+ .topbar .env-badge {
43
+ font-size: 0.7rem;
44
+ text-transform: uppercase;
45
+ letter-spacing: 0.2em;
46
+ color: var(--muted);
47
+ border: 1px solid var(--line);
48
+ padding: 4px 12px;
49
+ }
50
+
51
+ /* ── Layout ──────────────────────────────── */
52
+ .shell {
53
+ display: grid;
54
+ grid-template-columns: 380px 1fr;
55
+ min-height: calc(100vh - 56px);
56
+ }
57
+
58
+ /* ── Solutions Panel ─────────────────────── */
59
+ .sol-panel {
60
+ border-right: 3px solid var(--ink);
61
+ overflow-y: auto;
62
+ }
63
+ .sol-header {
64
+ padding: 24px 28px 12px;
65
+ font-size: 0.65rem;
66
+ text-transform: uppercase;
67
+ letter-spacing: 0.3em;
68
+ color: var(--muted);
69
+ border-bottom: 1px solid var(--line);
70
+ }
71
+ .sol-count {
72
+ float: right;
73
+ color: var(--red);
74
+ font-weight: 500;
75
+ }
76
+ .sol-search {
77
+ padding: 12px 28px;
78
+ border-bottom: 1px solid var(--line);
79
+ }
80
+ .sol-search input {
81
+ width: 100%;
82
+ font-family: 'DM Mono', monospace;
83
+ font-size: 0.8rem;
84
+ border: 1px solid var(--line);
85
+ padding: 8px 12px;
86
+ background: var(--bg);
87
+ outline: none;
88
+ transition: border 0.2s;
89
+ }
90
+ .sol-search input:focus { border-color: var(--red); }
91
+
92
+ .sol-item {
93
+ display: grid;
94
+ grid-template-columns: 6px 1fr auto;
95
+ align-items: start;
96
+ padding: 16px 28px;
97
+ border-bottom: 1px solid var(--line);
98
+ cursor: pointer;
99
+ transition: background 0.15s;
100
+ gap: 14px;
101
+ }
102
+ .sol-item:hover { background: var(--red-soft); }
103
+ .sol-item.active {
104
+ background: var(--ink);
105
+ color: #fff;
106
+ }
107
+ .sol-item.active .sol-version,
108
+ .sol-item.active .sol-managed,
109
+ .sol-item.active .sol-modified { color: rgba(255,255,255,0.55); }
110
+ .sol-indicator {
111
+ width: 6px;
112
+ height: 6px;
113
+ margin-top: 6px;
114
+ border-radius: 50%;
115
+ background: var(--red);
116
+ }
117
+ .sol-item.managed .sol-indicator { background: var(--muted); }
118
+ .sol-name {
119
+ font-size: 0.82rem;
120
+ font-weight: 500;
121
+ line-height: 1.3;
122
+ }
123
+ .sol-version {
124
+ font-size: 0.65rem;
125
+ color: var(--muted);
126
+ margin-top: 2px;
127
+ }
128
+ .sol-managed {
129
+ font-size: 0.6rem;
130
+ text-transform: uppercase;
131
+ letter-spacing: 0.15em;
132
+ color: var(--muted);
133
+ text-align: right;
134
+ }
135
+ .sol-modified {
136
+ font-size: 0.6rem;
137
+ color: var(--muted);
138
+ text-align: right;
139
+ margin-top: 2px;
140
+ }
141
+
142
+ /* ── Detail Panel ────────────────────────── */
143
+ .detail-panel {
144
+ overflow-y: auto;
145
+ }
146
+ .detail-empty {
147
+ display: flex;
148
+ align-items: center;
149
+ justify-content: center;
150
+ height: 100%;
151
+ font-family: 'Instrument Serif', serif;
152
+ font-size: 1.6rem;
153
+ color: var(--line);
154
+ }
155
+ .detail-header {
156
+ padding: 32px 40px 24px;
157
+ border-bottom: 1px solid var(--line);
158
+ }
159
+ .detail-header h2 {
160
+ font-family: 'Instrument Serif', serif;
161
+ font-size: 2.2rem;
162
+ font-weight: 400;
163
+ line-height: 1.1;
164
+ }
165
+ .detail-meta {
166
+ display: flex;
167
+ gap: 28px;
168
+ margin-top: 12px;
169
+ font-size: 0.7rem;
170
+ color: var(--muted);
171
+ }
172
+ .detail-meta span { letter-spacing: 0.04em; }
173
+ .detail-meta b {
174
+ color: var(--ink);
175
+ font-weight: 500;
176
+ }
177
+ .detail-desc {
178
+ padding: 20px 40px;
179
+ font-size: 0.78rem;
180
+ color: var(--muted);
181
+ border-bottom: 1px solid var(--line);
182
+ line-height: 1.7;
183
+ }
184
+
185
+ /* ── Component Grid ──────────────────────── */
186
+ .comp-bar {
187
+ display: flex;
188
+ align-items: center;
189
+ justify-content: space-between;
190
+ padding: 16px 40px;
191
+ border-bottom: 1px solid var(--line);
192
+ font-size: 0.65rem;
193
+ text-transform: uppercase;
194
+ letter-spacing: 0.25em;
195
+ color: var(--muted);
196
+ }
197
+ .comp-bar .comp-total { color: var(--red); font-weight: 500; }
198
+
199
+ .comp-groups {
200
+ padding: 0 40px 40px;
201
+ }
202
+ .comp-group {
203
+ margin-top: 28px;
204
+ }
205
+ .comp-group-title {
206
+ font-size: 0.65rem;
207
+ text-transform: uppercase;
208
+ letter-spacing: 0.25em;
209
+ color: var(--red);
210
+ padding-bottom: 8px;
211
+ border-bottom: 2px solid var(--ink);
212
+ margin-bottom: 10px;
213
+ }
214
+ .comp-row {
215
+ display: grid;
216
+ grid-template-columns: 1fr auto;
217
+ padding: 8px 0;
218
+ border-bottom: 1px solid var(--line);
219
+ font-size: 0.78rem;
220
+ align-items: center;
221
+ }
222
+ .comp-row:last-child { border-bottom: none; }
223
+ .comp-row-name { font-weight: 400; }
224
+ .comp-row-id {
225
+ font-size: 0.62rem;
226
+ color: var(--muted);
227
+ font-family: 'DM Mono', monospace;
228
+ }
229
+
230
+ /* ── Animations ──────────────────────────── */
231
+ .sol-item { animation: slideIn 0.25s ease both; }
232
+ .comp-group { animation: fadeUp 0.3s ease both; }
233
+ @keyframes slideIn {
234
+ from { opacity: 0; transform: translateX(-12px); }
235
+ to { opacity: 1; transform: translateX(0); }
236
+ }
237
+ @keyframes fadeUp {
238
+ from { opacity: 0; transform: translateY(8px); }
239
+ to { opacity: 1; transform: translateY(0); }
240
+ }
241
+ </style>
242
+ </head>
243
+ <body>
244
+
245
+ <div class="topbar">
246
+ <h1>Solution Explorer</h1>
247
+ <span class="env-badge">org-4f8c2a · Production</span>
248
+ </div>
249
+
250
+ <div class="shell">
251
+ <!-- Solutions List -->
252
+ <div class="sol-panel">
253
+ <div class="sol-header">
254
+ Solutions <span class="sol-count">12</span>
255
+ </div>
256
+ <div class="sol-search">
257
+ <input type="text" placeholder="Filter solutions…" id="searchInput">
258
+ </div>
259
+ <div id="solList"></div>
260
+ </div>
261
+
262
+ <!-- Detail Pane -->
263
+ <div class="detail-panel" id="detailPanel">
264
+ <div class="detail-empty">← Select a solution</div>
265
+ </div>
266
+ </div>
267
+
268
+ <script>
269
+ /* ── Mock Data ────────────────────────────── */
270
+ var aSolutions = [
271
+ { solutionid: 'a1b2c3d4-0001', friendlyname: 'Core Data Model', uniquename: 'CoreDataModel', version: '3.2.0.1', ismanaged: false, modifiedon: '2026-03-18T14:22:00Z', description: 'Foundation entities, relationships, and business rules for the organisation data model.' },
272
+ { solutionid: 'a1b2c3d4-0002', friendlyname: 'Customer Portal', uniquename: 'CustomerPortal', version: '1.8.4.0', ismanaged: false, modifiedon: '2026-03-20T09:45:00Z', description: 'Portal components including web resources, forms, and site maps for the customer-facing application.' },
273
+ { solutionid: 'a1b2c3d4-0003', friendlyname: 'Dynamics 365 Sales', uniquename: 'msdyn_Sales', version: '9.0.24031.1002', ismanaged: true, modifiedon: '2026-01-15T00:00:00Z', description: 'Microsoft Dynamics 365 Sales managed solution.' },
274
+ { solutionid: 'a1b2c3d4-0004', friendlyname: 'Approval Workflows', uniquename: 'ApprovalWorkflows', version: '2.1.0.0', ismanaged: false, modifiedon: '2026-03-12T11:30:00Z', description: 'Cloud flows and business process flows for multi-stage approval routing.' },
275
+ { solutionid: 'a1b2c3d4-0005', friendlyname: 'Power BI Dashboards', uniquename: 'PowerBIDashboards', version: '1.0.3.0', ismanaged: true, modifiedon: '2026-02-28T16:00:00Z', description: 'Embedded Power BI dashboards and charts for executive reporting.' },
276
+ { solutionid: 'a1b2c3d4-0006', friendlyname: 'Security Configuration', uniquename: 'SecurityConfig', version: '4.0.0.2', ismanaged: false, modifiedon: '2026-03-21T08:15:00Z', description: 'Security roles, field-level security profiles, and team templates.' },
277
+ { solutionid: 'a1b2c3d4-0007', friendlyname: 'Email Templates Pack', uniquename: 'EmailTemplates', version: '1.3.1.0', ismanaged: true, modifiedon: '2025-12-10T10:00:00Z', description: 'Standardised email templates for customer communications.' },
278
+ { solutionid: 'a1b2c3d4-0008', friendlyname: 'Integration Hub', uniquename: 'IntegrationHub', version: '2.5.0.0', ismanaged: false, modifiedon: '2026-03-19T15:42:00Z', description: 'Custom connectors, plugins, and webhook configurations for third-party integrations.' },
279
+ { solutionid: 'a1b2c3d4-0009', friendlyname: 'Canvas Apps Collection', uniquename: 'CanvasApps', version: '1.1.0.0', ismanaged: false, modifiedon: '2026-03-17T13:20:00Z', description: 'Suite of canvas apps for field workers and mobile scenarios.' },
280
+ { solutionid: 'a1b2c3d4-0010', friendlyname: 'Dataverse Accelerator', uniquename: 'DataverseAccelerator', version: '1.0.0.1', ismanaged: true, modifiedon: '2026-01-05T00:00:00Z', description: 'Microsoft accelerator components for rapid Dataverse development.' },
281
+ { solutionid: 'a1b2c3d4-0011', friendlyname: 'Field Service Extensions', uniquename: 'FSExtensions', version: '2.0.1.0', ismanaged: false, modifiedon: '2026-03-15T10:30:00Z', description: 'Custom entities, forms, and business rules extending Dynamics 365 Field Service.' },
282
+ { solutionid: 'a1b2c3d4-0012', friendlyname: 'AI Builder Models', uniquename: 'AIBuilderModels', version: '1.2.0.0', ismanaged: true, modifiedon: '2026-02-20T09:00:00Z', description: 'Pre-trained and custom AI Builder models for document processing and prediction.' },
283
+ ];
284
+
285
+ var oComponentMap = {
286
+ 1: 'Entity', 2: 'Attribute', 9: 'Option Set', 10: 'Entity Relationship',
287
+ 20: 'Security Role', 24: 'Workflow', 25: 'Report', 26: 'Connection Role',
288
+ 29: 'Site Map', 31: 'System Form', 36: 'Dashboard', 59: 'Chart',
289
+ 61: 'Web Resource', 62: 'Plugin Type', 63: 'Plugin Assembly',
290
+ 65: 'SDK Message Step', 70: 'Model-driven App', 80: 'Canvas App', 300: 'Cloud Flow'
291
+ };
292
+
293
+ var oSolutionComponents = {
294
+ 'a1b2c3d4-0001': [
295
+ { componenttype: 1, objectid: 'e001', name: 'account' }, { componenttype: 1, objectid: 'e002', name: 'contact' },
296
+ { componenttype: 1, objectid: 'e003', name: 'cr8b2_project' }, { componenttype: 1, objectid: 'e004', name: 'cr8b2_milestone' },
297
+ { componenttype: 2, objectid: 'a001', name: 'cr8b2_project.cr8b2_status' }, { componenttype: 2, objectid: 'a002', name: 'cr8b2_project.cr8b2_startdate' },
298
+ { componenttype: 10, objectid: 'r001', name: 'cr8b2_project_account' }, { componenttype: 9, objectid: 'o001', name: 'cr8b2_projectstatus' },
299
+ ],
300
+ 'a1b2c3d4-0002': [
301
+ { componenttype: 61, objectid: 'w001', name: 'portal_main.js' }, { componenttype: 61, objectid: 'w002', name: 'portal_styles.css' },
302
+ { componenttype: 61, objectid: 'w003', name: 'portal_home.html' }, { componenttype: 31, objectid: 'f001', name: 'Contact - Portal Main Form' },
303
+ { componenttype: 31, objectid: 'f002', name: 'Case - Portal Quick Create' }, { componenttype: 29, objectid: 's001', name: 'Portal Site Map' },
304
+ { componenttype: 70, objectid: 'ap01', name: 'Customer Self-Service' },
305
+ ],
306
+ 'a1b2c3d4-0003': [
307
+ { componenttype: 1, objectid: 'e010', name: 'opportunity' }, { componenttype: 1, objectid: 'e011', name: 'quote' },
308
+ { componenttype: 1, objectid: 'e012', name: 'salesorder' }, { componenttype: 1, objectid: 'e013', name: 'invoice' },
309
+ { componenttype: 24, objectid: 'wf01', name: 'Opportunity Close Process' }, { componenttype: 36, objectid: 'd001', name: 'Sales Dashboard' },
310
+ { componenttype: 59, objectid: 'ch01', name: 'Revenue by Quarter' }, { componenttype: 70, objectid: 'ap02', name: 'Sales Hub' },
311
+ ],
312
+ 'a1b2c3d4-0004': [
313
+ { componenttype: 300, objectid: 'cf01', name: 'Approval - Manager Sign-off' }, { componenttype: 300, objectid: 'cf02', name: 'Approval - Finance Review' },
314
+ { componenttype: 300, objectid: 'cf03', name: 'Approval - VP Escalation' }, { componenttype: 24, objectid: 'wf02', name: 'Invoice Approval BPF' },
315
+ { componenttype: 1, objectid: 'e020', name: 'cr8b2_approvalrequest' },
316
+ ],
317
+ 'a1b2c3d4-0005': [
318
+ { componenttype: 36, objectid: 'd010', name: 'Executive Overview' }, { componenttype: 36, objectid: 'd011', name: 'Sales Performance' },
319
+ { componenttype: 36, objectid: 'd012', name: 'Service Metrics' }, { componenttype: 59, objectid: 'ch10', name: 'Pipeline Funnel' },
320
+ ],
321
+ 'a1b2c3d4-0006': [
322
+ { componenttype: 20, objectid: 'sr01', name: 'Sales Manager' }, { componenttype: 20, objectid: 'sr02', name: 'Service Agent' },
323
+ { componenttype: 20, objectid: 'sr03', name: 'System Administrator' }, { componenttype: 20, objectid: 'sr04', name: 'Read-Only User' },
324
+ { componenttype: 20, objectid: 'sr05', name: 'Finance Approver' },
325
+ ],
326
+ 'a1b2c3d4-0007': [
327
+ { componenttype: 61, objectid: 'w010', name: 'template_welcome.html' }, { componenttype: 61, objectid: 'w011', name: 'template_invoice.html' },
328
+ { componenttype: 61, objectid: 'w012', name: 'template_reminder.html' },
329
+ ],
330
+ 'a1b2c3d4-0008': [
331
+ { componenttype: 63, objectid: 'pa01', name: 'IntegrationHub.Plugins' }, { componenttype: 62, objectid: 'pt01', name: 'SyncContactPlugin' },
332
+ { componenttype: 62, objectid: 'pt02', name: 'WebhookDispatcher' }, { componenttype: 65, objectid: 'sm01', name: 'PostCreate - SyncContact' },
333
+ { componenttype: 65, objectid: 'sm02', name: 'PostUpdate - DispatchWebhook' }, { componenttype: 300, objectid: 'cf10', name: 'Sync to ERP Nightly' },
334
+ ],
335
+ 'a1b2c3d4-0009': [
336
+ { componenttype: 80, objectid: 'ca01', name: 'Field Inspection App' }, { componenttype: 80, objectid: 'ca02', name: 'Expense Report App' },
337
+ { componenttype: 80, objectid: 'ca03', name: 'Time Tracker App' },
338
+ ],
339
+ 'a1b2c3d4-0010': [
340
+ { componenttype: 1, objectid: 'e030', name: 'cr8b2_acceleratorconfig' }, { componenttype: 61, objectid: 'w020', name: 'accelerator_bundle.js' },
341
+ { componenttype: 70, objectid: 'ap10', name: 'Accelerator Studio' },
342
+ ],
343
+ 'a1b2c3d4-0011': [
344
+ { componenttype: 1, objectid: 'e040', name: 'cr8b2_workorder_ext' }, { componenttype: 2, objectid: 'a010', name: 'cr8b2_workorder_ext.cr8b2_priority' },
345
+ { componenttype: 31, objectid: 'f010', name: 'Work Order - Extended Form' }, { componenttype: 24, objectid: 'wf10', name: 'Auto-assign Work Order' },
346
+ { componenttype: 300, objectid: 'cf20', name: 'Notify Technician' },
347
+ ],
348
+ 'a1b2c3d4-0012': [
349
+ { componenttype: 61, objectid: 'w030', name: 'ai_invoice_processor' }, { componenttype: 61, objectid: 'w031', name: 'ai_prediction_model' },
350
+ { componenttype: 300, objectid: 'cf30', name: 'Process Incoming Documents' },
351
+ ],
352
+ };
353
+
354
+ /* ── Renderers ────────────────────────────── */
355
+ function formatDate(sISO) {
356
+ var d = new Date(sISO);
357
+ return d.toLocaleDateString('en-GB', { day: '2-digit', month: 'short', year: 'numeric' });
358
+ }
359
+
360
+ function renderSolutions(aFiltered) {
361
+ var eList = document.getElementById('solList');
362
+ eList.innerHTML = '';
363
+ aFiltered.forEach(function(sol, i) {
364
+ var div = document.createElement('div');
365
+ div.className = 'sol-item' + (sol.ismanaged ? ' managed' : '');
366
+ div.style.animationDelay = (i * 0.04) + 's';
367
+ div.innerHTML =
368
+ '<div class="sol-indicator"></div>' +
369
+ '<div>' +
370
+ '<div class="sol-name">' + sol.friendlyname + '</div>' +
371
+ '<div class="sol-version">' + sol.uniquename + ' · v' + sol.version + '</div>' +
372
+ '</div>' +
373
+ '<div>' +
374
+ '<div class="sol-managed">' + (sol.ismanaged ? 'Managed' : 'Unmanaged') + '</div>' +
375
+ '<div class="sol-modified">' + formatDate(sol.modifiedon) + '</div>' +
376
+ '</div>';
377
+ div.addEventListener('click', function() {
378
+ document.querySelectorAll('.sol-item').forEach(function(el) { el.classList.remove('active'); });
379
+ div.classList.add('active');
380
+ renderDetail(sol);
381
+ });
382
+ eList.appendChild(div);
383
+ });
384
+ }
385
+
386
+ function renderDetail(sol) {
387
+ var ePanel = document.getElementById('detailPanel');
388
+ var aComps = oSolutionComponents[sol.solutionid] || [];
389
+
390
+ /* Group components by type */
391
+ var oGroups = {};
392
+ aComps.forEach(function(c) {
393
+ var sType = oComponentMap[c.componenttype] || ('Type ' + c.componenttype);
394
+ if (!oGroups[sType]) oGroups[sType] = [];
395
+ oGroups[sType].push(c);
396
+ });
397
+
398
+ var sHTML =
399
+ '<div class="detail-header">' +
400
+ '<h2>' + sol.friendlyname + '</h2>' +
401
+ '<div class="detail-meta">' +
402
+ '<span>Unique Name: <b>' + sol.uniquename + '</b></span>' +
403
+ '<span>Version: <b>' + sol.version + '</b></span>' +
404
+ '<span>' + (sol.ismanaged ? 'Managed' : 'Unmanaged') + '</span>' +
405
+ '</div>' +
406
+ '</div>';
407
+
408
+ if (sol.description) {
409
+ sHTML += '<div class="detail-desc">' + sol.description + '</div>';
410
+ }
411
+
412
+ sHTML +=
413
+ '<div class="comp-bar">' +
414
+ '<span>Components</span>' +
415
+ '<span class="comp-total">' + aComps.length + ' items</span>' +
416
+ '</div>';
417
+
418
+ sHTML += '<div class="comp-groups">';
419
+ var iGroupIdx = 0;
420
+ Object.keys(oGroups).sort().forEach(function(sType) {
421
+ sHTML += '<div class="comp-group" style="animation-delay:' + (iGroupIdx * 0.08) + 's">';
422
+ sHTML += '<div class="comp-group-title">' + sType + ' (' + oGroups[sType].length + ')</div>';
423
+ oGroups[sType].forEach(function(c) {
424
+ sHTML +=
425
+ '<div class="comp-row">' +
426
+ '<span class="comp-row-name">' + c.name + '</span>' +
427
+ '<span class="comp-row-id">' + c.objectid + '</span>' +
428
+ '</div>';
429
+ });
430
+ sHTML += '</div>';
431
+ iGroupIdx++;
432
+ });
433
+ sHTML += '</div>';
434
+
435
+ ePanel.innerHTML = sHTML;
436
+ }
437
+
438
+ /* ── Search ───────────────────────────────── */
439
+ document.getElementById('searchInput').addEventListener('input', function(evt) {
440
+ var sQuery = evt.target.value.toLowerCase();
441
+ var aFiltered = aSolutions.filter(function(s) {
442
+ return s.friendlyname.toLowerCase().indexOf(sQuery) !== -1 ||
443
+ s.uniquename.toLowerCase().indexOf(sQuery) !== -1;
444
+ });
445
+ renderSolutions(aFiltered);
446
+ });
447
+
448
+ /* ── Init ─────────────────────────────────── */
449
+ renderSolutions(aSolutions);
450
+ </script>
451
+ </body>
452
+ </html>