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
49
50
51
52
53
import { forwardRef } from "react";
import { observer } from "mobx-react";
import { IconBan, IconSparks, IconStar } from "@humansignal/icons";
import { Userpic } from "@humansignal/ui";
import { Space } from "../../common/Space/Space";
import { cn } from "../../utils/bem";
import "./AnnotationTabs.scss";
 
export const EntityTab = observer(
  forwardRef(
    ({ entity, selected, style, onClick, bordered = true, prediction = false, displayGroundTruth = false }, ref) => {
      const isUnsaved = (entity.userGenerate && !entity.sentUserGenerate) || entity.draftSelected;
      const infoIsHidden = entity.store.hasInterface("annotations:hide-info");
 
      return (
        <div
          ref={ref}
          data-annotation-id={entity.pk ?? entity.id}
          className={cn("entity-tab").mod({ selected, bordered }).toClassName()}
          style={style}
          onClick={(e) => {
            e.preventDefault();
            e.stopPropagation();
            onClick?.(entity, prediction);
          }}
        >
          <Space size="small">
            <Userpic
              className={cn("entity-tab").elem("userpic").mod({ prediction }).toClassName()}
              showUsernameTooltip
              username={prediction ? entity.createdBy : null}
              user={infoIsHidden ? {} : (entity.user ?? { email: entity.createdBy })}
            >
              {prediction && <IconSparks style={{ width: 16, height: 16 }} />}
            </Userpic>
 
            {!infoIsHidden && (
              <div className={cn("entity-tab").elem("identifier").toClassName()}>
                ID {entity.pk ?? entity.id} {isUnsaved && "*"}
              </div>
            )}
 
            {displayGroundTruth && entity.ground_truth && (
              <IconStar className={cn("entity-tab").elem("ground-truth").toClassName()} />
            )}
 
            {entity.skipped && <IconBan className={cn("entity-tab").elem("skipped").toClassName()} />}
          </Space>
        </div>
      );
    },
  ),
);