Skip to content

fix(providers): address Pi review findings

MacroscopeApp / Macroscope - UI Consistency failed Aug 16, 2026 in 2m 25s

UI Consistency: 1 issue found

apps/web/src/components/Icons.tsx — PiAgentIcon now renders an inset glyph. Removing the 800x800 background tile leaves the paths spanning only 165.29 → 634.72 on both axes (~59% of the viewBox), so at the shared fixed icon boxes (size-4 / size-5) the Pi mark renders noticeably smaller than every other provider mark (OpenAI, ClaudeAI, CursorIcon, GrokIcon, OpenCodeIcon, GithubCopilotIcon), all of whose paths fill their viewBox. Suggested fix (posted inline): tighten the viewBox to 165.29 165.29 469.43 469.43.

No other findings in the in-scope web files.

Details

Note

Your check run agent prompt is: .macroscope/check-run-agents/ui-consistency.md
More information about how Check Run Agents work can be found in our Help Center.

Files examined (in scope):

  • apps/web/src/components/Icons.tsx — PiAgentIcon converted from opaque black tile to theme-aware glyph (fill-[#0F0F0F] dark:fill-[#F5F5F5] + fill="none" attribute), matching the GrokIcon / ACPRegistryIcon pattern. The theming concern raised in the prior run is resolved; only the residual glyph inset remains.
  • apps/web/src/components/chat/providerIconUtils.ts — pi → PiAgentIcon entry consistent with the other driver entries.
  • apps/web/src/components/settings/providerDriverMeta.ts — pi definition uses the existing badgeLabel contract ("Early Access", rendered as Badge variant="warning" size="sm"), same as acpRegistry.
  • apps/web/src/components/settings/AddProviderInstanceDialog.tsx — Pi moved from COMING_SOON_DRIVER_OPTIONS into the real DRIVER_OPTIONS list; unused PiAgentIcon import removed; badge rendering path unchanged.
  • apps/web/src/components/settings/ProviderModelsSection.tsx — custom-model placeholder follows the existing per-kind map.
  • apps/web/src/lib/contextWindow.ts, apps/web/src/session-logic.ts — display-name case and PROVIDER_OPTIONS entry (pickerSidebarBadge: "new") match the opencode / cursor precedent.

Verification notes: consumers of PROVIDER_ICON_BY_PROVIDER (ProviderInstanceIcon, ModelListRow, V2LifecycleRow, ProviderUpdatePrimaryNotification) render the icon bare on card/popover backgrounds with a fixed square box and no color indirection, which is why the inset geometry is visible as an optical size mismatch rather than a color problem. Server, mobile, contracts, and docs changes were read for context only and not targeted.


🔍 Agent activity — 1 tool call

💭 Looking at the scope of changes across these files, I can see the team addressed the icon visibility issue by updating the PiAgentIcon styling to use a dark color that works in light mode and switches to a lighter shade in dark mode. Now I need to verify consistency with how other icons handle their fill properties—checking whether they're using the same pattern of removing inline fill attributes and relying on Tailwind classes instead. I should also cross-check the provider badging across session-logic.ts and providerDriverMeta.ts to see if there's an inconsistency between "new" and "Early Access" labels, and whether this pattern is applied uniformly to other providers. The earlier issue is resolved. Now I'm checking the other in-scope changes for consistency—specifically looking at how badges are labeled across different providers. In session-logic.ts, pi uses pickerSidebarBadge: "new" while providerDriverMeta applies badgeLabel: "Early Access", and I need to see if other providers follow similar patterns or if there's a mismatch. The contextWindow.ts changes look fine—it's properly formatting pi's display name and the PROVIDER_DISPLAY_NAMES contract includes it. Now I'm verifying whether PiAgentIcon is used in contexts expecting the black tile styling, and checking how className handling changed since the icon previously had fill-none applied. I'm also comparing how other provider icons like GrokIcon and OpenCodeIcon handle their fill colors—they're using hardcoded fills that match the mobile implementation, and PiAgentIcon follows the same pattern with its dark mode variants. There's a potential issue with how the dark variant is defined in the repo's custom Tailwind configuration that I need to verify. Let me check session-logic.ts to see how PROVIDER_OPTIONS is structured, how badges render for the "pi" provider, and whether the picker sidebar badge and "Early Access" badge appear consistently across ProviderModelsSection. I'm checking whether the AddProviderInstanceDialog pulls from PROVIDER_CLIENT_DEFINITIONS to show pi as an available option now, and verifying that the badgeLabel displays correctly for available drivers and that removing the PiAgentIcon import doesn't leave any unused dependencies. Pi is now showing up as a real driver option with a badge. The settings have enabled defaulting to false on the server side, while the web dialog handles enabling it at the instance level. I'm thinking through the icon change more carefully—previously the Pi icon was a black rounded tile logo that only appeared in the "coming soon" section, so I need to check if switching it elsewhere could cause any regressions. The icon now uses fill="none" on the root SVG plus a Tailwind fill class, which is consistent with other icons in the repo—the class overrides the presentation attribute, so paths inherit the computed fill color correctly. I should verify whether consumers of provider icons are expecting currentColor behavior or if they're passing fill classes as className overrides. I'm noticing a discrepancy between what git_grep shows at the current commit and what the actual view displays — the imports and icon references don't match up, which suggests the revision being queried might not align with what I'm looking at. I'm checking where this icon component is being used—specifically in ProviderInstanceIcon, ModelListRow, V2LifecycleRow, and ProviderUpdatePrimaryNotification—to see if any of these render the icon on colored backgrounds like badges or inverted chips where a hardcoded fill might clash. I'm noticing an issue with the Pi glyph's geometry—it has built-in padding from the original tile design, so while its viewBox is 0 0 800 800, the actual glyph only occupies the 165–635 range. This means it'll render noticeably smaller than other icons like Grok or Cursor when displayed at the same size, since the glyph itself is only about 59% of the viewBox. This is a concrete visual inconsistency: icons in the same row will have different optical sizes. I should check how other provider icons handle their geometry to see if they fill their viewBox properly or if this is a broader pattern. The GrokIcon uses a standard viewBox that fills the entire box, but the Pi icon's glyph only occupies about 59% of its 800×800 viewBox, which means at smaller sizes like 20px it renders noticeably smaller than other provider icons—a visual regression that happened when the tile wrapper was removed since that previously ensured consistent sizing across all icons. I can fix this by tightening the viewBox to match the glyph bounds, which would be a straightforward inline adjustment. Before committing to that though, I should verify whether other icons have similar padding issues or if this is unique to Pi, and check if the mobile version has the same problem to understand the full scope. So the Pi icon's glyph only fills about 59% of its viewBox while other provider marks use the full space, making it render roughly 41% smaller at the same nominal size. This optical inconsistency stems directly from removing the tile in Icons.tsx—the glyph was previously hidden by it. I need to decide whether this qualifies as a concrete violation introduced by the changed lines, since my instructions are to report only violations that the modifications actually caused. The Pi icon now appears noticeably smaller than its neighbors in the model picker and lifecycle rows, so I should flag this with an inline suggestion that tightens the viewBox to match the actual glyph bounds. Computing those bounds from the path data gives me a square region from 165.29 to 634.72 on both axes, which preserves the aspect ratio. I'll propose adjusting the viewBox on line 691 of Icons.tsx to these tighter coordinates and set the check to failure since there's a concrete finding. Before posting, I want to confirm this is a real regression rather than intentional design. The mobile version has the same padding, and the author was asked to make the icon theme-aware like the others—they did that but left the original tile padding intact. So flagging the size mismatch is a natural follow-up on the same changed lines. The dark mode fill color matches what other icons use, so that's not a concern. I'll post the review now.

1. modify_pr — One finding on the Pi icon geometry after the tile removal. Everything else in the web scope (provider icon map, driver meta, model placeholder, display-name and picker option entries) follows the existing per-provider patterns.


Agent Credits: 172 credits