From 80fc23ac32cd8fe5011a94420cff1f469367f1fc Mon Sep 17 00:00:00 2001 From: Julius Marminge Date: Thu, 24 Sep 2026 10:49:04 -0700 Subject: [PATCH] lint/unknown and static (#13366) Co-authored-by: Claude Opus 5.5 (1M context) --- apps/web/src/components/AppSidebarLayout.tsx | 8 +--- apps/web/src/components/ChatMarkdown.test.tsx | 10 ++--- apps/web/src/components/ChatMarkdown.tsx | 3 +- apps/web/src/components/CommandPalette.tsx | 1 - .../src/components/CommandPaletteContent.tsx | 20 ++++++++-- apps/web/src/components/DiffPanelShell.tsx | 38 ++++++++++++++----- apps/web/src/components/LegacySidebar.tsx | 31 +++++++++------ apps/web/src/components/RightPanelSheet.tsx | 3 +- apps/web/src/components/Sidebar.logic.test.ts | 23 ----------- apps/web/src/components/Sidebar.logic.ts | 34 ----------------- .../src/components/SidebarStageBackdrop.tsx | 14 ++----- .../src/components/ThreadTerminalDrawer.tsx | 10 +++-- .../diffs/DiffFileLoadingBoundary.tsx | 2 +- .../components/files/ProjectFilePicker.tsx | 2 +- .../components/onboarding/WelcomeWizard.tsx | 5 ++- .../components/preview/PreviewPanelShell.tsx | 3 -- .../pullRequest/PullRequestDetailPanel.tsx | 8 ++-- .../pullRequest/PullRequestGhosts.tsx | 3 +- .../components/pullRequest/PullRequestRow.tsx | 19 ++++++++-- .../search/ProjectContentSearchDialog.tsx | 6 +-- .../settings/ProjectFaviconPickerDialog.tsx | 2 +- .../src/components/sidebar/SidebarChrome.tsx | 6 +-- .../sidebar/SidebarProviderUpdatePill.tsx | 11 +++--- apps/web/src/components/ui/alert-dialog.tsx | 2 +- apps/web/src/components/ui/button.tsx | 2 +- apps/web/src/components/ui/dialog.tsx | 2 +- apps/web/src/components/ui/empty.tsx | 6 +-- apps/web/src/components/ui/scroll-area.tsx | 2 +- apps/web/src/components/ui/sheet.tsx | 2 +- apps/web/src/index.css | 2 + apps/web/src/rightPanelLayout.ts | 2 - vite.config.ts | 8 ++++ 32 files changed, 138 insertions(+), 152 deletions(-) diff --git a/apps/web/src/components/AppSidebarLayout.tsx b/apps/web/src/components/AppSidebarLayout.tsx index eccf3ef21355f57dc2f7dea5563873ca6d81c0b5..97c0bd44eb961f7155f28ec423cc0684370ceec8 100644 --- a/apps/web/src/components/AppSidebarLayout.tsx +++ b/apps/web/src/components/AppSidebarLayout.tsx @@ -35,10 +35,7 @@ import LegacyThreadSidebar from "./LegacySidebar"; import ThreadSidebar from "./Sidebar"; import { SettingsSidebarNav } from "./settings/SettingsSidebarNav"; import { SidebarChromeHeader } from "./sidebar/SidebarChrome"; -import { - resolveSidebarStageFocusRingOffsetClass, - useSidebarStageBackdropVariant, -} from "./SidebarStageBackdrop"; +import { useSidebarStageBackdropVariant } from "./SidebarStageBackdrop"; import { useProjects } from "../state/entities"; import { resolveInitialThreadSidebarWidth, @@ -138,9 +135,6 @@ function SidebarControl() { className={cn( "pointer-events-auto", isSidebarVisible && stageBackdropVariant && "relative top-auto translate-y-0", - isSidebarVisible && - stageBackdropVariant && - resolveSidebarStageFocusRingOffsetClass(stageBackdropVariant), )} aria-label="Toggle main sidebar" /> diff --git a/apps/web/src/components/ChatMarkdown.test.tsx b/apps/web/src/components/ChatMarkdown.test.tsx index 3e1222e0ebb9620ebf8389bd9623cd327ea656ad..d8a5f651ff835159a88be40c67b304275d8bd502 100644 --- a/apps/web/src/components/ChatMarkdown.test.tsx +++ b/apps/web/src/components/ChatMarkdown.test.tsx @@ -639,7 +639,7 @@ describe("ChatMarkdown artifact-template cards", () => { ); expect(html).not.toContain("::artifact-template"); - expect(html).toContain("chat-markdown-artifact-template"); + expect(html).toContain("data-chat-markdown-artifact-template"); expect(html).toContain('data-artifact-kind="document"'); expect(html).toContain('data-markdown-copy="Hello World (Document template)\n\n"'); expect(html).toContain('data-skill-name="artifact-template-hello-world"'); @@ -654,7 +654,7 @@ describe("ChatMarkdown artifact-template cards", () => { , ); - expect(html).toContain("chat-markdown-artifact-template"); + expect(html).toContain("data-chat-markdown-artifact-template"); expect(html).not.toContain("Use template"); }); @@ -666,7 +666,7 @@ describe("ChatMarkdown artifact-template cards", () => { for (const text of [malformed, unfinished]) { const html = renderToStaticMarkup(); expect(html).toContain("::artifact-template"); - expect(html).not.toContain("chat-markdown-artifact-template"); + expect(html).not.toContain("data-chat-markdown-artifact-template"); } }); @@ -678,7 +678,7 @@ describe("ChatMarkdown artifact-template cards", () => { const html = renderToStaticMarkup(); expect(html).toContain("::artifact-template"); - expect(html).not.toContain("chat-markdown-artifact-template"); + expect(html).not.toContain("data-chat-markdown-artifact-template"); } }); @@ -691,7 +691,7 @@ describe("ChatMarkdown artifact-template cards", () => { ); expect(html.match(/::artifact-template/g)).toHaveLength(2); - expect(html).not.toContain("chat-markdown-artifact-template"); + expect(html).not.toContain("data-chat-markdown-artifact-template"); }); }); diff --git a/apps/web/src/components/ChatMarkdown.tsx b/apps/web/src/components/ChatMarkdown.tsx index f48c573aa8bc0066caf0908083f293c6a732317e..56d46c010891e77de07897bf98db82f109a0c8ec 100644 --- a/apps/web/src/components/ChatMarkdown.tsx +++ b/apps/web/src/components/ChatMarkdown.tsx @@ -299,7 +299,8 @@ function CodexArtifactTemplateCard(props: {
diff --git a/apps/web/src/components/CommandPaletteContent.tsx b/apps/web/src/components/CommandPaletteContent.tsx index e9e6149b6cd79470c1471cf215bca285b14a2203..8732c6ef926f761f61eaba2a79419b8c1c604e35 100644 --- a/apps/web/src/components/CommandPaletteContent.tsx +++ b/apps/web/src/components/CommandPaletteContent.tsx @@ -11,7 +11,11 @@ type CommandPaletteContentProps = Omit, "children readonly footerTrailing?: ReactNode; readonly inputAccessory?: ReactNode; readonly inputProps: ComponentProps; - readonly panelClassName?: string; + /** + * How tall the results panel may grow: the palette's list, a taller file list, or the whole + * dialog body (for modes that lay out their own status and empty states). + */ + readonly panelSize?: "list" | "tall-list" | "fill"; readonly showBackHint?: boolean; readonly testId?: string; }; @@ -28,7 +32,7 @@ export function CommandPaletteContent({ footerTrailing, inputAccessory, inputProps, - panelClassName, + panelSize = "list", showBackHint, testId, ...commandProps @@ -49,7 +53,17 @@ export function CommandPaletteContent({ {inputAccessory}
- {children} + + {children} +
diff --git a/apps/web/src/components/DiffPanelShell.tsx b/apps/web/src/components/DiffPanelShell.tsx index 61d78518b00a01c3a9600776d847a68fc1ec7556..0b7da6ab635a8f45ac5863613276390c46c7b96f 100644 --- a/apps/web/src/components/DiffPanelShell.tsx +++ b/apps/web/src/components/DiffPanelShell.tsx @@ -46,14 +46,27 @@ export function DiffPanelShell(props: { ); } -export function DiffFileHeaderSkeleton({ titleClassName }: { titleClassName: string }) { +export function DiffFileHeaderSkeleton({ + titleWidth, +}: { + titleWidth: "short" | "medium" | "long"; +}) { return (
- +
@@ -62,11 +75,16 @@ export function DiffFileHeaderSkeleton({ titleClassName }: { titleClassName: str ); } -function DiffCodeLineSkeleton({ contentClassName }: { contentClassName: string }) { +function DiffCodeLineSkeleton({ width }: { width: "short" | "medium" | "long" }) { return (
- +
); } @@ -79,19 +97,19 @@ export function DiffPanelLoadingState(props: { label: string }) { aria-live="polite" aria-label={props.label} > - +
- - - + + +
- - + + {props.label}
); diff --git a/apps/web/src/components/LegacySidebar.tsx b/apps/web/src/components/LegacySidebar.tsx index 075ccea0a1c5f55a5295265eb4b309de2815e6a9..82c5af7de136ad50cd4c68d216aa2f15978a19dc 100644 --- a/apps/web/src/components/LegacySidebar.tsx +++ b/apps/web/src/components/LegacySidebar.tsx @@ -26,6 +26,7 @@ import { ProjectFavicon } from "./ProjectFavicon"; import { useAtomValue } from "@effect/atom-react"; import { autoAnimate } from "@formkit/auto-animate"; import React, { useCallback, useEffect, memo, useMemo, useRef, useState } from "react"; +import { cn } from "~/lib/utils"; import { useShallow } from "zustand/react/shallow"; import { DndContext, @@ -184,7 +185,6 @@ import { isSidebarNestedLinkClick, isTrailingDoubleClick, resolveProjectStatusIndicator, - resolveThreadRowClassName, resolveThreadStatusPill, orderItemsByPreferredIds, shouldClearThreadSelectionOnMouseDown, @@ -696,7 +696,6 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: SidebarThreadRowP }, [attemptArchiveThread, threadRef], ); - const rowButtonRender = useMemo(() =>
, []); return ( - span:last-child]:truncate [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-muted-foreground", + isActive + ? "bg-sidebar-row-active font-medium text-sidebar-foreground hover:bg-sidebar-row-active" + : isSelected + ? "bg-sidebar-row-selected text-sidebar-foreground hover:bg-sidebar-row-active" + : "text-sidebar-muted-foreground/80 hover:bg-sidebar-row-hover hover:text-sidebar-foreground", + isFileDragOver && "ring-1 ring-inset ring-primary/70", + )} onClick={handleRowClick} onDoubleClick={handleRowDoubleClick} onKeyDown={handleRowKeyDown} @@ -934,7 +943,7 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: SidebarThreadRowP
- +
); }); diff --git a/apps/web/src/components/RightPanelSheet.tsx b/apps/web/src/components/RightPanelSheet.tsx index e3468034396b1fd393a594d7acd0ca39ef2e60cf..044369ed0f76624572683ad7958d8ff6a1985fdf 100644 --- a/apps/web/src/components/RightPanelSheet.tsx +++ b/apps/web/src/components/RightPanelSheet.tsx @@ -1,6 +1,5 @@ import { type ReactNode } from "react"; -import { RIGHT_PANEL_SHEET_CLASS_NAME } from "../rightPanelLayout"; import { Sheet, SheetPopup } from "./ui/sheet"; export function RightPanelSheet(props: { @@ -23,7 +22,7 @@ export function RightPanelSheet(props: { side="right" showCloseButton={false} keepMounted - className={RIGHT_PANEL_SHEET_CLASS_NAME} + className="w-[min(42vw,28rem)] min-w-80 max-w-[28rem] max-[760px]:w-[min(88vw,24rem)] max-[760px]:min-w-0 wco:mt-[env(titlebar-area-height)] wco:h-[calc(100%-env(titlebar-area-height))] wco:max-h-[calc(100%-env(titlebar-area-height))]" > {props.children} diff --git a/apps/web/src/components/Sidebar.logic.test.ts b/apps/web/src/components/Sidebar.logic.test.ts index 76960f3f533bc30f274281a1e24dc4c3fb97788d..30044e6411370fd6cf98ef5cd7ba523fc8387448 100644 --- a/apps/web/src/components/Sidebar.logic.test.ts +++ b/apps/web/src/components/Sidebar.logic.test.ts @@ -23,7 +23,6 @@ import { isTrailingDoubleClick, orderItemsByPreferredIds, resolveProjectStatusIndicator, - resolveThreadRowClassName, resolveSidebarThreadStatus, resolveThreadStatusPill, resolveWorkingStartedAt, @@ -2059,28 +2058,6 @@ describe("resolveThreadStatusPill", () => { }); }); -describe("resolveThreadRowClassName", () => { - it("uses the active sidebar surface when a thread is both selected and active", () => { - const className = resolveThreadRowClassName({ isActive: true, isSelected: true }); - expect(className).toContain("bg-sidebar-row-active"); - expect(className).toContain("text-sidebar-foreground"); - expect(className).not.toContain("bg-primary"); - }); - - it("uses selected hover colors for selected threads", () => { - const className = resolveThreadRowClassName({ isActive: false, isSelected: true }); - expect(className).toContain("bg-sidebar-row-selected"); - expect(className).toContain("hover:bg-sidebar-row-active"); - expect(className).not.toContain("bg-primary"); - }); - - it("uses the active sidebar surface for active-only threads", () => { - const className = resolveThreadRowClassName({ isActive: true, isSelected: false }); - expect(className).toContain("bg-sidebar-row-active"); - expect(className).toContain("hover:bg-sidebar-row-active"); - }); -}); - describe("resolveProjectStatusIndicator", () => { it("returns null when no threads have a notable status", () => { expect(resolveProjectStatusIndicator([null, null])).toBeNull(); diff --git a/apps/web/src/components/Sidebar.logic.ts b/apps/web/src/components/Sidebar.logic.ts index fcedf46ce50787d585a5348f79386191eae0ebd0..f4b13a5000bc4cfd4289b34b8cf37b3af3a4bd76 100644 --- a/apps/web/src/components/Sidebar.logic.ts +++ b/apps/web/src/components/Sidebar.logic.ts @@ -768,40 +768,6 @@ export function isContextMenuPointerDown(input: { return input.isMac && input.button === 0 && input.ctrlKey; } -export function resolveThreadRowClassName(input: { - isActive: boolean; - isSelected: boolean; -}): string { - const baseClassName = - "h-8 w-full translate-x-0 cursor-pointer justify-start rounded-md px-2 text-left text-sm select-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring"; - - if (input.isSelected && input.isActive) { - return cn( - baseClassName, - "bg-sidebar-row-active text-sidebar-foreground font-medium hover:bg-sidebar-row-active hover:text-sidebar-foreground", - ); - } - - if (input.isSelected) { - return cn( - baseClassName, - "bg-sidebar-row-selected text-sidebar-foreground hover:bg-sidebar-row-active hover:text-sidebar-foreground", - ); - } - - if (input.isActive) { - return cn( - baseClassName, - "bg-sidebar-row-active text-sidebar-foreground font-medium hover:bg-sidebar-row-active hover:text-sidebar-foreground", - ); - } - - return cn( - baseClassName, - "text-sidebar-muted-foreground/80 hover:bg-sidebar-row-hover hover:text-sidebar-foreground", - ); -} - // ── Sidebar thread status model ───────────────────────────────────── // Five visual states, three colors: color is reserved for "act now" // (approval), "in motion" (working), and "broken" (failed). Ready is the diff --git a/apps/web/src/components/SidebarStageBackdrop.tsx b/apps/web/src/components/SidebarStageBackdrop.tsx index 9f77d7298c397479954cc8234e940fd93cb55fd0..c1e0209064923f620e344bdcd62ef68afc8b2b5e 100644 --- a/apps/web/src/components/SidebarStageBackdrop.tsx +++ b/apps/web/src/components/SidebarStageBackdrop.tsx @@ -23,14 +23,6 @@ export function resolveSidebarStageBackdropVariant( return null; } -export function resolveSidebarStageFocusRingOffsetClass( - variant: SidebarStageBackdropVariant, -): string { - return variant === "nightly" - ? "focus-visible:ring-offset-(--stage-night-bottom)" - : "focus-visible:ring-offset-(--stage-art-bottom)"; -} - export function resolveEnvironmentIdentificationPillLabel( stageLabel: string, ): EnvironmentIdentificationPillLabel | null { @@ -116,7 +108,8 @@ function NightlySkyArt({ compact = false }: { compact?: boolean }) { return ( void; cou
{Array.from({ length: Math.min(count, 4) }, (_, index) => (
- +
))}
diff --git a/apps/web/src/components/files/ProjectFilePicker.tsx b/apps/web/src/components/files/ProjectFilePicker.tsx index a59e8dd77e4784c8b458dc06d689adbe9cb555e2..38d21f6c1005eb32927b95abbccfa8370b08caeb 100644 --- a/apps/web/src/components/files/ProjectFilePicker.tsx +++ b/apps/web/src/components/files/ProjectFilePicker.tsx @@ -130,7 +130,7 @@ function OpenProjectFilePicker(props: ProjectFilePickerProps & { target: ActiveP setHighlightedItemValue(null); setQuery(value); }} - panelClassName="max-h-[min(34rem,76vh)]" + panelSize="tall-list" testId="project-file-picker" value={query} > diff --git a/apps/web/src/components/onboarding/WelcomeWizard.tsx b/apps/web/src/components/onboarding/WelcomeWizard.tsx index 26ba0cea419df5332e3f93dae4dbf6c9b9f24f10..169f1f8b0575f8da5bed3bcd1214e81f5ade92b0 100644 --- a/apps/web/src/components/onboarding/WelcomeWizard.tsx +++ b/apps/web/src/components/onboarding/WelcomeWizard.tsx @@ -887,7 +887,10 @@ function AgentInstallTerminal({ ]); return ( -
+
{setupState === "writeFailed" ? ( diff --git a/apps/web/src/components/preview/PreviewPanelShell.tsx b/apps/web/src/components/preview/PreviewPanelShell.tsx index eddb549cf225b7366b75fba6fa2f5c80beea8624..71dde5b3ad91806f00d8eb450d8e19b29e947c16 100644 --- a/apps/web/src/components/preview/PreviewPanelShell.tsx +++ b/apps/web/src/components/preview/PreviewPanelShell.tsx @@ -7,7 +7,6 @@ import { useState, } from "react"; -import { isElectron } from "~/env"; import { useResizableWidth } from "~/hooks/useResizableWidth"; import { cn } from "~/lib/utils"; @@ -64,7 +63,6 @@ export function PreviewPanelShell(props: { defaultWidth?: number; children: ReactNode; }) { - const useDragRegion = isElectron && props.mode !== "sheet" && props.mode !== "embedded"; const isInline = props.mode === "inline"; const collapsible = isInline && props.open !== undefined; const open = props.open ?? true; @@ -149,7 +147,6 @@ export function PreviewPanelShell(props: { className="flex h-full min-h-0 min-w-0 flex-col" style={collapsible && !maximized ? { width: `calc(${width}px - 1px)` } : undefined} > - {useDragRegion ?
: null} {props.children}
diff --git a/apps/web/src/components/pullRequest/PullRequestDetailPanel.tsx b/apps/web/src/components/pullRequest/PullRequestDetailPanel.tsx index 536bab75b438b612682122288b6e707fec6cceb6..de2ee18f9d9978dd44db893a420db8b9e8190c1c 100644 --- a/apps/web/src/components/pullRequest/PullRequestDetailPanel.tsx +++ b/apps/web/src/components/pullRequest/PullRequestDetailPanel.tsx @@ -1980,9 +1980,11 @@ export function PullRequestDetailPanel({ ) : (primaryAction === "merged" || primaryAction === "closed") && statePresentation !== null ? ( - - - {statePresentation.label} + + + + {statePresentation.label} + ) : null} diff --git a/apps/web/src/components/pullRequest/PullRequestGhosts.tsx b/apps/web/src/components/pullRequest/PullRequestGhosts.tsx index 78d93915e0dd4859193ebc44bd11edefdf383f92..85c9802c21706ce34a6f6bd21b13a9c1bde91782 100644 --- a/apps/web/src/components/pullRequest/PullRequestGhosts.tsx +++ b/apps/web/src/components/pullRequest/PullRequestGhosts.tsx @@ -169,10 +169,9 @@ export function PullRequestDetailGhost({ {seed.repository} void readLocalApi()?.shell.openExternal(seed.url)} - className={statePresentation?.toneClassName} aria-label={`Open pull request #${seed.number} on host`} > - #{seed.number} + #{seed.number} diff --git a/apps/web/src/components/pullRequest/PullRequestRow.tsx b/apps/web/src/components/pullRequest/PullRequestRow.tsx index e32decde136c22bb5bd2e5fb51b63ffcdc75def6..898f58ecb220083a46622d192bd9faa05ffe613a 100644 --- a/apps/web/src/components/pullRequest/PullRequestRow.tsx +++ b/apps/web/src/components/pullRequest/PullRequestRow.tsx @@ -27,10 +27,11 @@ import { * narrow row shows one label and a "+N" while a wide one spreads out up to three. The "+N" * rides on whichever pill is the last visible one, and is hidden as soon as the next slot shows. */ +// Each slot's pill appears at a wider row, and its overflow count yields to the next slot. const LABEL_SLOTS = [ - { pill: "", overflow: "@xl/pr-row-meta:hidden" }, - { pill: "hidden @xl/pr-row-meta:inline-flex", overflow: "@3xl/pr-row-meta:hidden" }, - { pill: "hidden @3xl/pr-row-meta:inline-flex", overflow: "" }, + { overflow: "@xl/pr-row-meta:hidden" }, + { overflow: "@3xl/pr-row-meta:hidden" }, + { overflow: "" }, ] as const; function PullRequestRowLabels({ labels }: { labels: EnvironmentPullRequestEntry["labels"] }) { @@ -42,7 +43,17 @@ function PullRequestRowLabels({ labels }: { labels: EnvironmentPullRequestEntry[ if (!label) return null; const remaining = labels.length - index - 1; return ( - + {remaining > 0 ? ( +{remaining} ) : null} diff --git a/apps/web/src/components/search/ProjectContentSearchDialog.tsx b/apps/web/src/components/search/ProjectContentSearchDialog.tsx index e037dd0ee9c8fd2c02710af636320d8aff20e85f..2812b60046920df41cc00d239b7d528e3726de13 100644 --- a/apps/web/src/components/search/ProjectContentSearchDialog.tsx +++ b/apps/web/src/components/search/ProjectContentSearchDialog.tsx @@ -88,11 +88,11 @@ function EmptyContentSearchDialog() { footerActionLabel="Open file" inputProps={{ disabled: true, placeholder: "Search project contents…" }} mode="none" - panelClassName="flex min-h-0 flex-1 items-center justify-center" + panelSize="fill" testId="project-content-search" value="" > -

+

Open a project to search its files.

@@ -219,7 +219,7 @@ function OpenContentSearchDialog(props: { }} mode="none" onValueChange={setQuery} - panelClassName="flex min-h-0 flex-1 flex-col" + panelSize="fill" testId="project-content-search" value={query} > diff --git a/apps/web/src/components/settings/ProjectFaviconPickerDialog.tsx b/apps/web/src/components/settings/ProjectFaviconPickerDialog.tsx index a0971db3ac25a817e8a53f7e3460597df6201dfa..5ed077f31bcfea1eefe82f6c5b868d429e810429 100644 --- a/apps/web/src/components/settings/ProjectFaviconPickerDialog.tsx +++ b/apps/web/src/components/settings/ProjectFaviconPickerDialog.tsx @@ -115,7 +115,7 @@ export function ProjectFaviconPickerDialog(props: { setHighlightedItemValue(null); setQuery(value); }} - panelClassName="max-h-[min(34rem,76vh)]" + panelSize="tall-list" testId="project-favicon-picker" value={query} > diff --git a/apps/web/src/components/sidebar/SidebarChrome.tsx b/apps/web/src/components/sidebar/SidebarChrome.tsx index c956ab0a63c81ba6556a8b1629ae4731b606842a..a37aba27b8de6431ba7f3119b8daf7e55011b4ab 100644 --- a/apps/web/src/components/sidebar/SidebarChrome.tsx +++ b/apps/web/src/components/sidebar/SidebarChrome.tsx @@ -10,7 +10,6 @@ import { T3Wordmark } from "../T3Wordmark"; import { resolveEnvironmentIdentificationPillLabel, resolveSidebarStageBackdropVariant, - resolveSidebarStageFocusRingOffsetClass, SidebarStageBackdrop, useEnvironmentStageLabel, } from "../SidebarStageBackdrop"; @@ -58,10 +57,7 @@ export const SidebarChromeHeader = memo(function SidebarChromeHeader({ {pillLabel ? ( diff --git a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx b/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx index 2d1159bdb40c765dc30230dc7d60b8d6d43b28f1..b77848f96f2432679dd77693d630fb39263d2ce7 100644 --- a/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx +++ b/apps/web/src/components/sidebar/SidebarProviderUpdatePill.tsx @@ -14,13 +14,13 @@ import { Tooltip, TooltipPopup, TooltipTrigger } from "../ui/tooltip"; const PROVIDER_UPDATE_PILL_STYLES = { loading: - "bg-sidebar-control-surface text-sidebar-foreground group-has-[button.provider-update-main:hover]/provider-update:bg-sidebar-row-hover", + "bg-sidebar-control-surface text-sidebar-foreground group-has-[button[data-provider-update-main]:hover]/provider-update:bg-sidebar-row-hover", success: - "bg-sidebar-control-surface text-sidebar-foreground group-has-[button.provider-update-main:hover]/provider-update:bg-sidebar-row-hover", + "bg-sidebar-control-surface text-sidebar-foreground group-has-[button[data-provider-update-main]:hover]/provider-update:bg-sidebar-row-hover", warning: - "bg-warning/12 text-warning group-has-[button.provider-update-main:hover]/provider-update:bg-warning/18", + "bg-warning/12 text-warning group-has-[button[data-provider-update-main]:hover]/provider-update:bg-warning/18", error: - "bg-destructive/12 text-destructive group-has-[button.provider-update-main:hover]/provider-update:bg-destructive/18", + "bg-destructive/12 text-destructive group-has-[button[data-provider-update-main]:hover]/provider-update:bg-destructive/18", } as const; const PROVIDER_UPDATE_PILL_PROGRESS_STYLES = { @@ -169,7 +169,8 @@ export function SidebarProviderUpdatePill() {