feat(assets): add verified asset history trends and compact overview

2026-10-24 13:16:48 +08:00
parent dbe0421bfe
commit 8afe13c9a3
36 changed files with 1716 additions and 9 deletions
@@ -0,0 +1,31 @@
+import { Select } from 'radix-ui';
+import { Check, ChevronDown, ChevronUp } from 'lucide-react';
+
+interface HistorySelectProps {
+  label: string;
+  value: string;
+  options: { value: string; label: string; detail?: string }[];
+  onChange: (value: string) => void;
+}
+
+export function HistorySelect({ label, value, options, onChange }: HistorySelectProps) {
+  return <Select.Root value={value} onValueChange={onChange}>
+    <Select.Trigger className="asset-history-select" aria-label={label}>
+      <Select.Value />
+      <Select.Icon className="asset-history-select-icon"><ChevronDown size={14} /></Select.Icon>
+    </Select.Trigger>
+    <Select.Portal>
+      <Select.Content className="asset-history-select-menu" position="popper" align="start" sideOffset={6} collisionPadding={10}>
+        <Select.ScrollUpButton className="asset-history-select-scroll"><ChevronUp size={14} /></Select.ScrollUpButton>
+        <Select.Viewport className="asset-history-select-options">
+          {options.map(option => <Select.Item className="asset-history-select-option" key={option.value} value={option.value} textValue={option.label}>
+            <Select.ItemText>{option.label}</Select.ItemText>
+            {option.detail && <span className="asset-history-option-detail">{option.detail}</span>}
+            <Select.ItemIndicator className="asset-history-option-check"><Check size={14} /></Select.ItemIndicator>
+          </Select.Item>)}
+        </Select.Viewport>
+        <Select.ScrollDownButton className="asset-history-select-scroll"><ChevronDown size={14} /></Select.ScrollDownButton>
+      </Select.Content>
+    </Select.Portal>
+  </Select.Root>;
+}