osobh/clawmates
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Computer panel: "Add Apps" tile with a visible plus

Browse Source 
The far-right home tile read "Add" and rendered its plus through GradientGlyph
(coral, faint/unclear). Match WorkClaw's capture: label "Add Apps" and a plain
lucide-plus in currentColor (white/65, inherits from the dashed tile),
strokeWidth 2, 19px. Updated the p3-panel E2E label + computer-home baseline.

Co-Authored-By: Claude Opus 4.8 <[email protected]>
This commit is contained in:
Omar Sobh
2026-06-12 18:30:42 -05:00
co-authored by Claude Opus 4.8
parent 8dac7aff49
commit db3dcff932
4 changed files with 7 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/computer/HomeScreen.tsx
+4 -1
View File
@@ -36,9 +36,12 @@ function tileSurface(app: AppId) {
); );
} }
if (app === "apps") { if (app === "apps") {
// Plain plus in the dashed tile (currentColor = white/65), not the coral
// gradient glyph — matches WorkClaw's Add Apps tile.
const Plus = APP_ICON.apps;
return ( return (
<div className="relative flex size-14 items-center justify-center rounded-2xl border border-dashed border-white/40 text-white/65 select-none"> <div className="relative flex size-14 items-center justify-center rounded-2xl border border-dashed border-white/40 text-white/65 select-none">
<GradientGlyph icon={APP_ICON.apps} size={26} /> <Plus size={19} strokeWidth={2} />
</div> </div>
); );
} }
frontend/src/components/computer/appCatalog.ts
+1 -1
View File
@@ -31,7 +31,7 @@ export const HOME_GRID: { app: AppId; label: string }[] = [
{ app: "browser", label: "Browser" }, { app: "browser", label: "Browser" },
{ app: "slack", label: "Slack" }, { app: "slack", label: "Slack" },
{ app: "chat", label: "Claw Chat" }, { app: "chat", label: "Claw Chat" },
{ app: "apps", label: "Add" }, { app: "apps", label: "Add Apps" },
]; ];
export const HOME_DOCK: { app: AppId; label: string }[] = [ export const HOME_DOCK: { app: AppId; label: string }[] = [
frontend/tests/e2e/p3-panel.spec.ts
+2 -2
View File
@@ -117,7 +117,7 @@ test("every panel app is reachable and the deep link cold-loads", async ({
["Browser", /No active browsing session/], ["Browser", /No active browsing session/],
["Slack", /Bring this claw into Slack/], ["Slack", /Bring this claw into Slack/],
["Claw Chat", /No claw-to-claw conversations yet/], ["Claw Chat", /No claw-to-claw conversations yet/],
["Add", /Connect with an API key/], ["Add Apps", /Connect with an API key/],
["Skills", /Scout's Skills|Installed skills/], ["Skills", /Scout's Skills|Installed skills/],
]; ];
for (const [tile, marker] of stops) { for (const [tile, marker] of stops) {
@@ -128,7 +128,7 @@ test("every panel app is reachable and the deep link cold-loads", async ({
// Inline keys connect from the directory (P4): Notion via API key. // Inline keys connect from the directory (P4): Notion via API key.
await panel.getByRole("button", { name: "Computer home" }).click(); await panel.getByRole("button", { name: "Computer home" }).click();
await panel.getByRole("button", { name: "Add", exact: true }).click(); await panel.getByRole("button", { name: "Add Apps", exact: true }).click();
await panel.getByRole("button", { name: "Connect Notion" }).click(); await panel.getByRole("button", { name: "Connect Notion" }).click();
await panel.getByLabel("Notion API key").fill("secret_notion_key"); await panel.getByLabel("Notion API key").fill("secret_notion_key");
await panel.getByRole("button", { name: "Connect", exact: true }).click(); await panel.getByRole("button", { name: "Connect", exact: true }).click();
frontend/tests/e2e/visual.spec.ts-snapshots/computer-home-chromium-darwin.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 195 KiB

After

Width:  |  Height:  |  Size: 195 KiB