Abin ToppoandClaude Opus 4.8
95d8e0a925
Optimization (audited across src/, typecheck green): - Crash guards: PurchaseAuction data?.result + stray text-node, AuctionItemDetail length>0, LiveAuction user?.contractorId, KYC params guard - Hoisted render-defined components: Login MinimalInput (keyboard-focus bug), TenderFullDetail Section/InfoBox (subtree remount) - Memoized hot paths: Spreadsheet ColumnHeaderRow/DataRow, list makeStyles, shared infinite-query select (stops per-render flatMap) - Removed hot-path/in-list console logs; SkeletonList 10->1 shimmer UI/theme: themed AppToast, redesigned sidebar drawer, list empty states, KYC WebView cleanup Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
64 lines
1.9 KiB
TypeScript
64 lines
1.9 KiB
TypeScript
/**
|
|
* Derives a spreadsheet-specific palette from the app theme so the grid matches
|
|
* the product and supports light + dark mode out of the box.
|
|
*/
|
|
import { useMemo } from 'react';
|
|
import { useTheme } from '../../Hooks/useTheme';
|
|
|
|
export interface GridTheme {
|
|
isDark: boolean;
|
|
background: string;
|
|
gridLine: string;
|
|
headerBg: string;
|
|
headerText: string;
|
|
headerActiveBg: string;
|
|
cellText: string;
|
|
mutedText: string;
|
|
selectionFill: string;
|
|
selectionBorder: string;
|
|
laneHighlight: string;
|
|
readOnlyBg: string;
|
|
errorBorder: string;
|
|
errorFill: string;
|
|
editorBg: string;
|
|
editorBorder: string;
|
|
searchHighlight: string;
|
|
lockIcon: string;
|
|
primary: string;
|
|
surface: string;
|
|
}
|
|
|
|
export const useGridTheme = (): GridTheme => {
|
|
const { colors, isDarkMode } = useTheme();
|
|
|
|
return useMemo<GridTheme>(
|
|
() => ({
|
|
isDark: isDarkMode,
|
|
background: isDarkMode ? '#1b1c1d' : '#ffffff',
|
|
gridLine: isDarkMode ? 'rgba(255,255,255,0.12)' : 'rgba(15,23,42,0.12)',
|
|
headerBg: isDarkMode ? '#2b2c2e' : '#f1f5f9',
|
|
headerText: isDarkMode ? '#cbd5e1' : '#475569',
|
|
headerActiveBg: colors.primary,
|
|
cellText: colors.text,
|
|
mutedText: colors.textSecondary,
|
|
selectionFill: isDarkMode ? 'rgba(227,149,70,0.20)' : 'rgba(227,149,70,0.16)',
|
|
selectionBorder: colors.primary,
|
|
laneHighlight: isDarkMode ? 'rgba(227,149,70,0.10)' : 'rgba(227,149,70,0.08)',
|
|
readOnlyBg: isDarkMode ? 'rgba(255,255,255,0.05)' : 'rgba(15,23,42,0.045)',
|
|
errorBorder: colors.error,
|
|
errorFill: isDarkMode ? 'rgba(248,113,113,0.16)' : 'rgba(239,68,68,0.10)',
|
|
editorBg: colors.surface,
|
|
editorBorder: colors.primary,
|
|
searchHighlight: isDarkMode ? 'rgba(253,186,116,0.30)' : 'rgba(253,186,116,0.45)',
|
|
lockIcon: isDarkMode ? 'rgba(255,255,255,0.55)' : 'rgba(15,23,42,0.45)',
|
|
primary: colors.primary,
|
|
surface: colors.surface,
|
|
}),
|
|
[colors, isDarkMode],
|
|
);
|
|
};
|
|
|
|
export default useGridTheme;
|
|
|
|
|