diff --git a/components/FileExplorer/FileExplorerIcon.tsx b/components/FileExplorer/FileExplorerIcon.tsx index 8661574..f85d353 100644 --- a/components/FileExplorer/FileExplorerIcon.tsx +++ b/components/FileExplorer/FileExplorerIcon.tsx @@ -11,6 +11,7 @@ type Props = { color: string; }; iconFrameMode?: "always" | "never"; + iconColorMode?: "status" | "theme"; }; export const FileExplorerIcon: FC = memo( @@ -21,6 +22,7 @@ export const FileExplorerIcon: FC = memo( hideUnknownStatus, unknownStatusConfig, iconFrameMode = "never", + iconColorMode = "status", }) => { const statusEntries = Object.entries(statuses); const totalStatuses = statusEntries.reduce( @@ -28,6 +30,8 @@ export const FileExplorerIcon: FC = memo( 0, ); + const useStatusColors = iconColorMode === "status"; + const getStatusColor = (color?: string) => (color && color.trim()) || "var(--text-accent)"; @@ -37,13 +41,19 @@ export const FileExplorerIcon: FC = memo( // Use config passed from integration, with fallbacks const icon = unknownStatusConfig?.icon || "❓"; - const color = unknownStatusConfig?.color?.trim() || "#8b949e"; + const color = useStatusColors + ? unknownStatusConfig?.color?.trim() || "#8b949e" + : undefined; const shouldFrameUnknown = iconFrameMode === "always"; - const unknownStyles: React.CSSProperties = { color }; + const unknownStyles: React.CSSProperties = {}; + if (color) { + unknownStyles.color = color; + } if (shouldFrameUnknown) { - unknownStyles.boxShadow = `0 0 0 1px ${color}`; + const frameColor = color || "currentColor"; + unknownStyles.boxShadow = `0 0 0 1px ${frameColor}`; unknownStyles.borderRadius = "var(--radius-s)"; } @@ -63,11 +73,17 @@ export const FileExplorerIcon: FC = memo( const primaryStatus = statusEntries[0]?.[1]?.[0]; if (!primaryStatus) return null; - const iconColor = getStatusColor(primaryStatus.color); + const iconColor = useStatusColors + ? getStatusColor(primaryStatus.color) + : undefined; const shouldShowFrame = iconFrameMode === "always"; - const iconStyles: React.CSSProperties = { color: iconColor }; + const iconStyles: React.CSSProperties = {}; + if (iconColor) { + iconStyles.color = iconColor; + } if (shouldShowFrame) { - iconStyles.boxShadow = `0 0 0 1px ${iconColor}`; + const frameColor = iconColor || "currentColor"; + iconStyles.boxShadow = `0 0 0 1px ${frameColor}`; iconStyles.borderRadius = "var(--radius-s)"; } @@ -85,7 +101,11 @@ export const FileExplorerIcon: FC = memo( {totalStatuses > 1 && ( {totalStatuses} diff --git a/components/SettingsUI/UISettings.tsx b/components/SettingsUI/UISettings.tsx index b6cfda0..532da1e 100644 --- a/components/SettingsUI/UISettings.tsx +++ b/components/SettingsUI/UISettings.tsx @@ -240,6 +240,30 @@ export const UISettings: React.FC = ({ settings, onChange }) => { /> + +