refactor(cabinet): migrate inline SVG icons to the central react-icons set

Audit-driven sweep: replaced 168 hand-written inline <svg> icons across 77
files with the central Phosphor (react-icons/pi) components from
@/components/icons, preserving each icon's size classes and colour (dynamic
stroke colours via the parent's currentColor, RefreshIcon's spinning state,
conditional rotate-180 chevrons).

Verified: tsc + vite build + eslint clean; an adversarial diff review of all
changed files found the replacements correct (70 files clean, 0 blockers).
Remaining inline <svg> dropped from 262 to ~95 — the survivors are legitimate
non-icons (brand/provider logos, loading spinners & framer-motion animations,
charts/sparklines, background decoration) plus a few ambiguous glyphs.
This commit is contained in:
c0mrade
2026-05-31 23:37:12 +03:00
parent 08f12daa40
commit b5088c70a1
76 changed files with 331 additions and 1985 deletions

View File

@@ -6,7 +6,7 @@ import { motion } from 'framer-motion';
import { newsApi } from '../../api/news';
import { useHapticFeedback } from '../../platform/hooks/useHaptic';
import { cn } from '../../lib/utils';
import { ArrowIcon } from '@/components/icons';
import { ArrowIcon, NewsIcon } from '@/components/icons';
import type { NewsListItem } from '../../types/news';
// --- Security: hex color validation to prevent CSS injection ---
@@ -415,35 +415,7 @@ export default function NewsSection() {
>
<div className="mb-2 flex items-center gap-2.5">
<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-gradient-to-br from-accent-400 to-accent-600">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" aria-hidden="true">
<path
d="M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Z"
fill="currentColor"
className="text-dark-950/20"
/>
<path
d="M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2Z"
stroke="currentColor"
strokeWidth="1.5"
className="text-dark-950"
/>
<path
d="M7 8h4M7 11h10M7 14h10M7 17h6"
stroke="currentColor"
strokeWidth="1.5"
strokeLinecap="round"
className="text-dark-950"
/>
<rect
x="14"
y="7"
width="4"
height="4"
rx="0.5"
fill="currentColor"
className="text-dark-950"
/>
</svg>
<NewsIcon className="h-[18px] w-[18px] text-dark-950" />
</div>
<span className="font-mono text-[11px] font-bold uppercase tracking-[0.18em] text-dark-500">
{t('news.title')}