Skip to content

Commit e187922

Browse files
committed
Restore Toolbox group assignments and colors - PR_26160_062-toolbox-group-color-restore
1 parent 80a2bb4 commit e187922

7 files changed

Lines changed: 226 additions & 40 deletions

File tree

assets/theme-v2/css/colors.css

Lines changed: 49 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,13 @@
5252
--meaning-purple-border: rgba(184, 119, 255, .48);
5353
--meaning-steel-gray-soft: rgba(107, 114, 128, .18);
5454
--meaning-steel-gray-border: rgba(107, 114, 128, .56);
55+
--toolbox-group-ai-color: var(--purple);
56+
--toolbox-group-audio-color: var(--orange);
57+
--toolbox-group-build-color: #ff4d4d;
58+
--toolbox-group-design-color: var(--pink);
59+
--toolbox-group-marketplace-color: var(--gold);
60+
--toolbox-group-platform-color: var(--electric-blue);
61+
--toolbox-group-play-color: var(--green);
5562
--transparent: transparent;
5663
--body-background: radial-gradient(circle at 20% 0%, rgba(255, 122, 0, .16), var(--transparent) 28%), radial-gradient(circle at 80% 10%, rgba(32, 214, 255, .10), var(--transparent) 24%), var(--bg);
5764
--card-background: linear-gradient(180deg, var(--panel-soft-strong), var(--panel-soft-subtle));
@@ -124,6 +131,34 @@
124131
background: var(--steel-gray)
125132
}
126133

134+
.toolbox-group-ai {
135+
background: var(--toolbox-group-ai-color)
136+
}
137+
138+
.toolbox-group-audio {
139+
background: var(--toolbox-group-audio-color)
140+
}
141+
142+
.toolbox-group-build {
143+
background: var(--toolbox-group-build-color)
144+
}
145+
146+
.toolbox-group-design {
147+
background: var(--toolbox-group-design-color)
148+
}
149+
150+
.toolbox-group-marketplace {
151+
background: var(--toolbox-group-marketplace-color)
152+
}
153+
154+
.toolbox-group-platform {
155+
background: var(--toolbox-group-platform-color)
156+
}
157+
158+
.toolbox-group-play {
159+
background: var(--toolbox-group-play-color)
160+
}
161+
127162
.side-orange {
128163
--accent: var(--orange)
129164
}
@@ -149,38 +184,38 @@
149184
}
150185

151186
.tool-group-ai {
152-
--tool-group-color: var(--purple);
153-
--tool-group-accent: var(--purple)
187+
--tool-group-color: var(--toolbox-group-ai-color);
188+
--tool-group-accent: var(--toolbox-group-ai-color)
154189
}
155190

156191
.tool-group-audio {
157-
--tool-group-color: var(--orange);
158-
--tool-group-accent: var(--orange)
192+
--tool-group-color: var(--toolbox-group-audio-color);
193+
--tool-group-accent: var(--toolbox-group-audio-color)
159194
}
160195

161196
.tool-group-build {
162-
--tool-group-color: var(--red);
163-
--tool-group-accent: var(--red)
197+
--tool-group-color: var(--toolbox-group-build-color);
198+
--tool-group-accent: var(--toolbox-group-build-color)
164199
}
165200

166201
.tool-group-design {
167-
--tool-group-color: var(--pink);
168-
--tool-group-accent: var(--pink)
202+
--tool-group-color: var(--toolbox-group-design-color);
203+
--tool-group-accent: var(--toolbox-group-design-color)
169204
}
170205

171206
.tool-group-marketplace {
172-
--tool-group-color: var(--gold);
173-
--tool-group-accent: var(--gold)
207+
--tool-group-color: var(--toolbox-group-marketplace-color);
208+
--tool-group-accent: var(--toolbox-group-marketplace-color)
174209
}
175210

176211
.tool-group-platform {
177-
--tool-group-color: var(--electric-blue);
178-
--tool-group-accent: var(--electric-blue)
212+
--tool-group-color: var(--toolbox-group-platform-color);
213+
--tool-group-accent: var(--toolbox-group-platform-color)
179214
}
180215

181216
.tool-group-play {
182-
--tool-group-color: var(--green);
183-
--tool-group-accent: var(--green)
217+
--tool-group-color: var(--toolbox-group-play-color);
218+
--tool-group-accent: var(--toolbox-group-play-color)
184219
}
185220

186221
.meaning-molten-orange {

assets/theme-v2/css/status.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,3 +55,9 @@
5555
color: var(--bg);
5656
text-shadow: none
5757
}
58+
59+
.swatch-label.toolbox-group-marketplace,
60+
.swatch-label.toolbox-group-play {
61+
color: var(--bg);
62+
text-shadow: none
63+
}

docs_build/dev/reports/coverage_changed_js_guardrail.txt

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,14 @@ Source: Playwright/Chromium built-in V8 coverage from the active Playwright run.
77

88
Changed runtime JS files considered:
99
(0%) src/dev-runtime/server/mock-api-router.mjs - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
10+
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
1011
(0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
11-
(57%) toolbox/colors/colors.js - executed lines 2289/2289; executed functions 123/216
12-
(80%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 4/5
13-
(100%) admin/tool-votes.js - executed lines 268/268; executed functions 35/35
12+
(40%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 2/5
13+
(73%) admin/tool-votes.js - executed lines 268/268; executed functions 24/33
14+
(75%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 77/103
1415

1516
Guardrail warnings:
1617
(0%) src/dev-runtime/server/mock-api-router.mjs - WARNING: changed runtime JS file missing from coverage; advisory only
18+
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file missing from coverage; advisory only
1719
(0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file missing from coverage; advisory only
20+
(40%) src/engine/api/toolbox-votes-api-client.js - WARNING: advisory low coverage below 50%; executed lines 37/37; executed functions 2/5

docs_build/dev/reports/playwright_v8_coverage_report.txt

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -12,38 +12,39 @@ Note: entry percentages use function coverage when available, otherwise line cov
1212
Note: coverage entries are aggregated across every page/tool where coverageReporter.start(page) and coverageReporter.stop(page) ran.
1313

1414
Exercised tool entry points detected:
15-
(72%) Toolbox Index - exercised 5 runtime JS files
15+
(70%) Toolbox Index - exercised 3 runtime JS files
1616
(0%) Tool Template V2 - not exercised by this Playwright run
17-
(74%) Theme V2 Shared JS - exercised 2 runtime JS files
17+
(77%) Theme V2 Shared JS - exercised 1 runtime JS files
1818

1919
Changed runtime JS files covered:
2020
(0%) src/dev-runtime/server/mock-api-router.mjs - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
21+
(0%) toolbox/colors/colors.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
2122
(0%) toolbox/toolRegistry.js - WARNING: changed runtime JS file was not collected by Playwright V8 coverage; advisory only
22-
(57%) toolbox/colors/colors.js - executed lines 2289/2289; executed functions 123/216
23-
(80%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 4/5
24-
(100%) admin/tool-votes.js - executed lines 268/268; executed functions 35/35
23+
(40%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 2/5
24+
(73%) admin/tool-votes.js - executed lines 268/268; executed functions 24/33
25+
(75%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 77/103
2526

2627
Files with executed line/function counts where available:
2728
(38%) src/engine/api/session-api-client.js - executed lines 34/34; executed functions 3/8
28-
(57%) toolbox/colors/colors.js - executed lines 2289/2289; executed functions 123/216
29-
(58%) src/engine/api/server-api-client.js - executed lines 159/159; executed functions 11/19
30-
(64%) assets/theme-v2/js/tool-display-mode.js - executed lines 209/209; executed functions 9/14
29+
(40%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 2/5
30+
(43%) toolbox/tool-registry-api-client.js - executed lines 148/148; executed functions 9/21
31+
(53%) src/engine/api/server-api-client.js - executed lines 159/159; executed functions 10/19
32+
(73%) admin/tool-votes.js - executed lines 268/268; executed functions 24/33
33+
(75%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 77/103
3134
(77%) assets/theme-v2/js/gamefoundry-partials.js - executed lines 547/547; executed functions 37/48
32-
(80%) src/engine/api/toolbox-votes-api-client.js - executed lines 37/37; executed functions 4/5
33-
(85%) toolbox/tool-registry-api-client.js - executed lines 148/148; executed functions 23/27
34-
(95%) toolbox/tools-page-accordions.js - executed lines 1034/1034; executed functions 108/114
35-
(100%) admin/tool-votes.js - executed lines 268/268; executed functions 35/35
36-
(100%) toolbox/colors/palette-api-client.js - executed lines 19/19; executed functions 4/4
3735
(100%) toolbox/project-workspace/project-workspace-api-client.js - executed lines 12/12; executed functions 2/2
3836

3937
Uncovered or low-coverage changed JS files:
4038
(0%) src/dev-runtime/server/mock-api-router.mjs - WARNING: uncovered changed runtime JS file; advisory only
39+
(0%) toolbox/colors/colors.js - WARNING: uncovered changed runtime JS file; advisory only
4140
(0%) toolbox/toolRegistry.js - WARNING: uncovered changed runtime JS file; advisory only
41+
(40%) src/engine/api/toolbox-votes-api-client.js - WARNING: advisory low coverage; executed lines 37/37
4242

4343
Changed JS files considered:
4444
(0%) src/dev-runtime/server/mock-api-router.mjs - changed JS file not collected as browser runtime coverage
4545
(0%) tests/playwright/tools/ToolboxRoutePages.spec.mjs - changed JS file not collected as browser runtime coverage
46+
(0%) toolbox/colors/colors.js - changed JS file not collected as browser runtime coverage
4647
(0%) toolbox/toolRegistry.js - changed JS file not collected as browser runtime coverage
47-
(57%) toolbox/colors/colors.js - changed JS file with browser V8 coverage
48-
(80%) src/engine/api/toolbox-votes-api-client.js - changed JS file with browser V8 coverage
49-
(100%) admin/tool-votes.js - changed JS file with browser V8 coverage
48+
(40%) src/engine/api/toolbox-votes-api-client.js - changed JS file with browser V8 coverage
49+
(73%) admin/tool-votes.js - changed JS file with browser V8 coverage
50+
(75%) toolbox/tools-page-accordions.js - changed JS file with browser V8 coverage
Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
# PR_26160_062 Toolbox Group Color Restore
2+
3+
## Branch Validation
4+
5+
| Check | Expected | Actual | Status | Evidence |
6+
| --- | --- | --- | --- | --- |
7+
| Current git branch | main | main | PASS | `git branch --show-current` |
8+
9+
## Requirement Checklist
10+
11+
| Requirement | Status | Evidence |
12+
| --- | --- | --- |
13+
| Restore `toolbox/index.html` group values to match Admin Tool Votes. | PASS | Playwright reads Admin Tool Votes rows from `admin/tool-votes.html`, then verifies every visible Toolbox card group label matches the Admin assignment. |
14+
| Use `admin/tool-votes.html` as source for current correct assignment. | PASS | Targeted Playwright extracts `Tool -> Group` from `[data-toolbox-votes-tool-id]` rows and compares it with `[data-toolbox-tool-card]` group labels. |
15+
| Restore Toolbox group colors to pre-voting/filter values. | PASS | `assets/theme-v2/css/colors.css` now owns `--toolbox-group-*` colors; Build/Create is restored to recovered `#ff4d4d`. |
16+
| Recover prior group color values from git history. | PASS | Source: `git show a3bc4016e:toolbox/tools-page-accordions.js` and `git show a3bc4016e:assets/theme-v2/css/colors.css`; `a3bc4016e` is the pre-PR_26160_055 recovery point. |
17+
| Keep group as metadata, not status. | PASS | Group mapping remains separate from `stateSwatchMap` and release channel/status code. |
18+
| Do not change tool status values or vote behavior. | PASS | No registry status/release/vote logic was changed. |
19+
| Do not add new features or expand scope. | PASS | Changes are limited to group color classes/tokens, group swatch class mapping, readability preservation, and targeted validation. |
20+
| Do not use inline script/style/event handlers. | PASS | `rg --pcre2` found no inline script/style/event handler matches in `toolbox/index.html` or `admin/tool-votes.html`. |
21+
22+
## Restored Group Color Source
23+
24+
Recovered from git history at `a3bc4016e` (`PR_26159_054-toolbox-status-and-display-cleanup`), before today’s Toolbox voting/filter changes:
25+
26+
| Group | Restored Color Source | Rendered Color |
27+
| --- | --- | --- |
28+
| AI | `swatch-purple` / `var(--purple)` | `rgb(184, 119, 255)` |
29+
| Audio | `swatch-orange` / `var(--orange)` | `rgb(255, 122, 0)` |
30+
| Build/Create | historical `swatch-red` when `--red` was `#ff4d4d` | `rgb(255, 77, 77)` |
31+
| Design | `swatch-pink` / `var(--pink)` | `rgb(255, 79, 139)` |
32+
| Marketplace | `swatch-gold` / `var(--gold)` | `rgb(255, 200, 87)` |
33+
| Platform | `swatch-blue` / `var(--electric-blue)` | `rgb(77, 163, 255)` |
34+
| Play | `swatch-green` / `var(--green)` | `rgb(125, 217, 87)` |
35+
36+
Note: PR_26160_061 intentionally changed the global Theme V2 `--red` token to `#ff2d2d`. This PR restores Toolbox group color display without reverting that global token by adding group-specific Theme V2 tokens such as `--toolbox-group-build-color: #ff4d4d`.
37+
38+
## Validation
39+
40+
| Lane | Command | Status |
41+
| --- | --- | --- |
42+
| Branch guard | `git branch --show-current` | PASS |
43+
| Changed-file syntax | `node --check toolbox/tools-page-accordions.js`; `node --check tests/playwright/tools/ToolboxRoutePages.spec.mjs` | PASS |
44+
| Inline handler/style/script audit | `rg --pcre2 "onclick=|onchange=|oninput=|style=|<script(?![^>]+src=)|<style[\s>]" toolbox/index.html admin/tool-votes.html` | PASS |
45+
| Group color token audit | `Select-String -Path assets/theme-v2/css/colors.css -Pattern '--toolbox-group-build-color|#ff4d4d|--red:'` | PASS |
46+
| Targeted Toolbox/Admin group Playwright | `npx playwright test tests/playwright/tools/ToolboxRoutePages.spec.mjs -g "toolbox group labels match"` | PASS |
47+
| Static diff check | `git diff --check` | PASS with CRLF normalization warnings only |
48+
49+
## Impacted Lane
50+
51+
Targeted Toolbox/Admin group display validation was impacted and run.
52+
53+
## Skipped Lanes
54+
55+
Full samples validation was skipped because this PR only changes Toolbox group display colors and targeted Toolbox/Admin validation. No sample loader/framework code changed.
56+
57+
## Manual Test Notes
58+
59+
- Admin Tool Votes remains the source for `Tool -> Group` assignment.
60+
- Toolbox cards show the same group names as Admin Tool Votes.
61+
- Build/Create group badges render the recovered pre-voting red `rgb(255, 77, 77)`.
62+
- Marketplace and Play group badges keep the previous readable dark text behavior.
63+
64+
## Artifact
65+
66+
- Repo-structured delta ZIP: `tmp/PR_26160_062-toolbox-group-color-restore_delta.zip`

tests/playwright/tools/ToolboxRoutePages.spec.mjs

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -438,6 +438,81 @@ test("toolbox status kickers, filters, card order, and voting controls work from
438438
}
439439
});
440440

441+
test("toolbox group labels match Admin Tool Votes assignments and restored group colors", async ({ page }) => {
442+
const server = await startRepoServer();
443+
const failedRequests = [];
444+
const pageErrors = [];
445+
const consoleErrors = [];
446+
447+
page.on("response", (response) => {
448+
if (response.status() >= 400) {
449+
failedRequests.push(`${response.status()} ${response.url()}`);
450+
}
451+
});
452+
page.on("requestfailed", (request) => {
453+
failedRequests.push(`FAILED ${request.url()}`);
454+
});
455+
page.on("pageerror", (error) => {
456+
const text = error.stack || error.message;
457+
if (!isBrowserExtensionNoise(text)) {
458+
pageErrors.push(error.message);
459+
}
460+
});
461+
page.on("console", (message) => {
462+
if (message.type() === "error" && !isBrowserExtensionNoise(message.text())) {
463+
consoleErrors.push(message.text());
464+
}
465+
});
466+
467+
try {
468+
await workspaceV2CoverageReporter.start(page);
469+
await setServerSession(server, MOCK_DB_KEYS.users.admin);
470+
await page.goto(`${server.baseUrl}/admin/tool-votes.html`, { waitUntil: "networkidle" });
471+
const adminGroupsByTool = await page.locator("[data-toolbox-votes-tool-id]").evaluateAll((rows) => (
472+
Object.fromEntries(rows.map((row) => [
473+
row.querySelector("td")?.textContent.trim(),
474+
row.querySelectorAll("td")[2]?.textContent.trim(),
475+
]))
476+
));
477+
478+
await page.goto(`${server.baseUrl}/toolbox/index.html`, { waitUntil: "networkidle" });
479+
const plannedFilter = page.locator("[data-toolbox-status-filter='planned']");
480+
if (await plannedFilter.getAttribute("aria-pressed") !== "true") {
481+
await plannedFilter.click();
482+
}
483+
const toolboxGroupsByTool = await page.locator("[data-toolbox-tool-card]").evaluateAll((cards) => (
484+
Object.fromEntries(cards.map((card) => [
485+
card.getAttribute("data-toolbox-tool-card"),
486+
card.querySelector("[data-toolbox-group-label]")?.textContent.trim() || "",
487+
]))
488+
));
489+
expect(Object.keys(toolboxGroupsByTool).sort()).toEqual(Object.keys(adminGroupsByTool).sort());
490+
expect(toolboxGroupsByTool).toEqual(adminGroupsByTool);
491+
492+
const expectedGroupColors = {
493+
"AI": "rgb(184, 119, 255)",
494+
"Audio": "rgb(255, 122, 0)",
495+
"Build/Create": "rgb(255, 77, 77)",
496+
"Design": "rgb(255, 79, 139)",
497+
"Marketplace": "rgb(255, 200, 87)",
498+
"Platform": "rgb(77, 163, 255)",
499+
"Play": "rgb(125, 217, 87)",
500+
};
501+
for (const [groupName, expectedColor] of Object.entries(expectedGroupColors)) {
502+
await expect(page.locator(`[data-toolbox-group-label='${groupName}']`).first()).toHaveCSS("background-color", expectedColor);
503+
}
504+
await expect(page.locator("[data-toolbox-group-label='Marketplace']").first()).toHaveCSS("color", "rgb(9, 11, 15)");
505+
await expect(page.locator("[data-toolbox-group-label='Play']").first()).toHaveCSS("color", "rgb(9, 11, 15)");
506+
507+
expect(failedRequests).toEqual([]);
508+
expect(pageErrors).toEqual([]);
509+
expect(consoleErrors).toEqual([]);
510+
} finally {
511+
await workspaceV2CoverageReporter.stop(page);
512+
await server.close();
513+
}
514+
});
515+
441516
test("toolbox Build Path status filters support multi-select registry-matched tool rows", async ({ page }) => {
442517
const server = await startRepoServer();
443518
const failedRequests = [];

toolbox/tools-page-accordions.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -108,13 +108,13 @@ import { getSessionCurrent } from "../src/engine/api/session-api-client.js";
108108
}))
109109
.filter((group) => group.tools.length > 0);
110110
const groupSwatchMap = {
111-
"AI": "swatch-purple",
112-
"Audio": "swatch-orange",
113-
"Build/Create": "swatch-red",
114-
"Design": "swatch-pink",
115-
"Marketplace": "swatch-gold",
116-
"Platform": "swatch-blue",
117-
"Play": "swatch-green"
111+
"AI": "toolbox-group-ai",
112+
"Audio": "toolbox-group-audio",
113+
"Build/Create": "toolbox-group-build",
114+
"Design": "toolbox-group-design",
115+
"Marketplace": "toolbox-group-marketplace",
116+
"Platform": "toolbox-group-platform",
117+
"Play": "toolbox-group-play"
118118
};
119119
const stateSwatchMap = {
120120
planned: "swatch-gray",

0 commit comments

Comments
 (0)