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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
import { useCallback, useMemo, useState } from "react";
import { useUpdatePageTitle, createTitleFromSegments } from "@humansignal/core";
import { useAPI } from "../../providers/ApiProvider";
import { useProject } from "../../providers/ProjectProvider";
import { FF_UNSAVED_CHANGES, isFF } from "../../utils/feature-flags";
import { isEmptyString } from "../../utils/helpers";
import { ConfigPage } from "../CreateProject/Config/Config";
 
export const LabelingSettings = () => {
  const { project, fetchProject, updateProject } = useProject();
  const [config, setConfig] = useState("");
  const [essentialDataChanged, setEssentialDataChanged] = useState(false);
  const hasChanges = isFF(FF_UNSAVED_CHANGES) && config !== project.label_config;
  const api = useAPI();
 
  useUpdatePageTitle(createTitleFromSegments([project?.title, "标注界面设置"]));
 
  const saveConfig = useCallback(
    isFF(FF_UNSAVED_CHANGES)
      ? async () => {
        const res = await updateProject({
          label_config: config,
        });
 
        if (res?.$meta?.ok) {
          // Backend can prettify the config, so we need to update it to have relevant hasChanges value
          setConfig(res.label_config);
          return true;
        }
 
        //error handling
        return res.response;
      }
      : async () => {
        const res = await api.callApi("updateProjectRaw", {
          params: {
            pk: project.id,
          },
          body: {
            label_config: config,
          },
        });
 
        if (res.ok) {
          return true;
        }
 
        const error = await res.json();
 
        fetchProject();
        return error;
      },
    [project, config],
  );
 
  const projectAlreadySetUp = useMemo(() => {
    if (project.label_config) {
      const hasConfig = !isEmptyString(project.label_config);
      const configIsEmpty = project.label_config.replace(/\s/g, "") === "<View></View>";
      const hasTasks = project.task_number > 0;
 
      console.log({ hasConfig, configIsEmpty, hasTasks, project });
      return hasConfig && !configIsEmpty && hasTasks;
    }
    return false;
  }, [project]);
 
  const onSave = useCallback(async () => {
    return saveConfig();
  }, [essentialDataChanged, saveConfig]);
 
  const onUpdate = useCallback((config) => {
    setConfig(config);
    fetchProject();
  });
 
  const onValidate = useCallback((validation) => {
    setEssentialDataChanged(validation.config_essential_data_has_changed);
  }, []);
 
  if (!project.id) return null;
 
  return (
    <ConfigPage
      config={project.label_config}
      project={project}
      onUpdate={onUpdate}
      onSaveClick={onSave}
      onValidate={onValidate}
      hasChanges={hasChanges}
    />
  );
};
 
LabelingSettings.title = "标注界面";
LabelingSettings.path = "/labeling";