TokensTable.js
23.3 KB
-
✨ feat(ui): Implement unified compact/adaptive table mode + icon refinement · 6bd4e202Summary • Added per-table “Compact / Adaptive” view toggle to all major table components (Tokens, Channels, Logs, MjLogs, TaskLogs, Redemptions, Users). • Persist user preference in a single localStorage entry (`table_compact_modes`) instead of scattered keys. Details 1. utils.js • Re-implemented `getTableCompactMode` / `setTableCompactMode` to read & write a shared JSON object. • Imported storage-key constant from `constants`. 2. hooks/useTableCompactMode.js • Hook now consumes the unified helpers and listens to `storage` events via the shared key constant. 3. constants • Added `TABLE_COMPACT_MODES_KEY` to `common.constant.js` and re-exported via `constants/index.js`. 4. Table components • Integrated `useTableCompactMode('<tableName>')`. • Dynamically remove `fixed: 'right'` column and horizontal `scroll` when in compact mode. • UI: toggle button placed at card title’s right; responsive layout on small screens. 5. UI polish • Replaced all lucide-react `List`/`ListIcon` usages with Semi UI `IconDescend` for consistency. • Restored correct icons where `Hash` was intended (TaskLogsTable). Benefits • Consistent UX for switching list density across the app. • Cleaner localStorage footprint with easier future maintenance.t0ng7u committed