chore: replace Unicode/emoji icons with Lucide React
All checks were successful
CI / cleanup-branch (push) Has been skipped
CI / build (push) Successful in 1m14s
CI / docker (push) Successful in 1m11s
CI / deploy-feature (push) Has been skipped
CI / deploy (push) Successful in 37s

Adds lucide-react and replaces all HTML entity and emoji icons across
the UI with proper SVG icon components. Tree-shaken — only imported
icons are bundled.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-03-27 23:16:39 +01:00
parent e9b1c94d1a
commit 41111b082c
10 changed files with 57 additions and 52 deletions

View File

@@ -1,5 +1,6 @@
import { useEffect, useState, useMemo } from 'react';
import { useParams, useNavigate } from 'react-router';
import { ArrowLeft, Pencil, X } from 'lucide-react';
import {
Button, SectionHeader, MonoText, Badge, DataTable, Spinner, Toggle, useToast,
} from '@cameleer/design-system';
@@ -248,7 +249,7 @@ export default function AppConfigDetailPage() {
if (row.captureMode === null) return null;
return (
<button className={styles.removeBtn} title="Remove" onClick={() => updateTracedProcessor(row.processorId, 'REMOVE')}>
&times;
<X size={14} />
</button>
);
},
@@ -303,7 +304,7 @@ export default function AppConfigDetailPage() {
return (
<div className={styles.page}>
<div className={styles.toolbar}>
<button className={styles.backBtn} onClick={() => navigate('/admin/appconfig')}>&larr; Back</button>
<button className={styles.backBtn} onClick={() => navigate('/admin/appconfig')}><ArrowLeft size={14} /> Back</button>
{editing ? (
<div className={styles.toolbarActions}>
<Button onClick={handleSave} disabled={updateConfig.isPending}>
@@ -312,7 +313,7 @@ export default function AppConfigDetailPage() {
<button className={styles.cancelBtn} onClick={cancelEditing}>Cancel</button>
</div>
) : (
<button className={styles.editBtn} onClick={startEditing}>&#x270E; Edit</button>
<button className={styles.editBtn} onClick={startEditing}><Pencil size={14} /> Edit</button>
)}
</div>

View File

@@ -1,5 +1,6 @@
import { useState, useMemo, useEffect } from 'react';
import { useNavigate, useSearchParams } from 'react-router';
import { Pencil, X } from 'lucide-react';
import {
DataTable, Badge, MonoText, DetailPanel, SectionHeader, Button, Toggle, Spinner, useToast,
} from '@cameleer/design-system';
@@ -197,7 +198,7 @@ function AppConfigDetail({ appId, onClose }: { appId: string; onClose: () => voi
...(editing ? [{
key: '_remove' as const, header: '', width: '36px',
render: (_v: unknown, row: TracedTapRow) => row.captureMode === null ? null : (
<button className={styles.removeBtn} title="Remove" onClick={() => updateTracedProcessor(row.processorId, 'REMOVE')}>&times;</button>
<button className={styles.removeBtn} title="Remove" onClick={() => updateTracedProcessor(row.processorId, 'REMOVE')}><X size={14} /></button>
),
}] : []),
], [editing, processorToRoute]);
@@ -233,7 +234,7 @@ function AppConfigDetail({ appId, onClose }: { appId: string; onClose: () => voi
</Button>
</div>
) : (
<button className={styles.editBtn} onClick={startEditing} title="Edit configuration">&#x270E;</button>
<button className={styles.editBtn} onClick={startEditing} title="Edit configuration"><Pencil size={14} /></button>
)}
</div>