refactor: centralise color maps, org color fallback, and motion-safe transitions
Create src/lib/theme-colors.ts with DOT_COLORS, KPI_COLORS, PROJECT_STATUS_COLORS, and DEFAULT_ORG_COLOR constants. Add motionSafeTransition() utility to src/lib/utils.ts. Removes 6 duplicate color map definitions across Card, DetailPanel, PatientSummaryTile, KPIDetail, ProjectsTile, and ProjectDetail. Replaces 9 hardcoded '#0D6E6E' fallbacks and 7 inline motion ternaries. Fixes project status color inconsistency between ProjectsTile and ProjectDetail (Ongoing was teal in tile, amber in detail).
This commit is contained in:
@@ -6,12 +6,7 @@ import { kpis } from '@/data/kpis'
|
||||
import type { KPI } from '@/types/pmr'
|
||||
import { useDetailPanel } from '@/contexts/DetailPanelContext'
|
||||
import { getLatestResultsCopy, getProfileSectionTitle, getProfileSummaryText } from '@/lib/profile-content'
|
||||
|
||||
const colorMap: Record<KPI['colorVariant'], string> = {
|
||||
green: '#059669',
|
||||
amber: '#D97706',
|
||||
teal: '#0D6E6E',
|
||||
}
|
||||
import { KPI_COLORS } from '@/lib/theme-colors'
|
||||
|
||||
interface MetricCardProps {
|
||||
kpi: KPI
|
||||
@@ -52,7 +47,7 @@ function MetricCard({ kpi }: MetricCardProps) {
|
||||
fontWeight: 700,
|
||||
letterSpacing: '-0.02em',
|
||||
lineHeight: 1.2,
|
||||
color: colorMap[kpi.colorVariant],
|
||||
color: KPI_COLORS[kpi.colorVariant],
|
||||
}
|
||||
|
||||
const labelStyles: React.CSSProperties = {
|
||||
|
||||
@@ -3,12 +3,7 @@ import { investigations } from '@/data/investigations'
|
||||
import { Card, CardHeader } from '../Card'
|
||||
import { useDetailPanel } from '@/contexts/DetailPanelContext'
|
||||
import type { Investigation } from '@/types/pmr'
|
||||
|
||||
const statusColorMap: Record<string, string> = {
|
||||
Complete: '#059669',
|
||||
Ongoing: '#0D6E6E',
|
||||
Live: '#059669',
|
||||
}
|
||||
import { PROJECT_STATUS_COLORS } from '@/lib/theme-colors'
|
||||
|
||||
interface ProjectItemProps {
|
||||
project: Investigation
|
||||
@@ -25,7 +20,7 @@ function ProjectItem({
|
||||
thumbnailHeight,
|
||||
onClick,
|
||||
}: ProjectItemProps) {
|
||||
const dotColor = statusColorMap[project.status] || '#0D6E6E'
|
||||
const dotColor = PROJECT_STATUS_COLORS[project.status]
|
||||
const isLive = project.status === 'Live'
|
||||
|
||||
const handleKeyDown = useCallback(
|
||||
|
||||
Reference in New Issue
Block a user