init

Bin

2025-12-16 9e0b2ba2c317b1a86212f24cbae3195ad1f3dbfa

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import { inject, observer } from "mobx-react";
import { RadioGroup } from "../../Common/RadioGroup/RadioGroup";
import { IconGrid, IconList } from "@humansignal/icons";
import { Tooltip } from "@humansignal/ui";
 
const viewInjector = inject(({ store }) => ({
  view: store.currentView,
}));
 
export const ViewToggle = viewInjector(
  observer(({ view, size, ...rest }) => {
    return (
      <RadioGroup
        size={size}
        value={view.type}
        onChange={(e) => view.setType(e.target.value)}
        {...rest}
        style={{ "--button-padding": "0 var(--spacing-tighter)" }}
      >
        <Tooltip title="列表视图">
          <div>
            <RadioGroup.Button value="list" aria-label="Switch to list view">
              <IconList />
            </RadioGroup.Button>
          </div>
        </Tooltip>
        <Tooltip title="网格视图">
          <div>
            <RadioGroup.Button value="grid" aria-label="Switch to grid view">
              <IconGrid />
            </RadioGroup.Button>
          </div>
        </Tooltip>
      </RadioGroup>
    );
  }),
);
 
export const DataStoreToggle = viewInjector(({ view, size, ...rest }) => {
  return (
    <RadioGroup value={view.target} size={size} onChange={(e) => view.setTarget(e.target.value)} {...rest}>
      <RadioGroup.Button value="tasks">任务</RadioGroup.Button>
      <RadioGroup.Button value="annotations" disabled>
        标注
      </RadioGroup.Button>
    </RadioGroup>
  );
});