All files / src/components/DynamicAlerts/create AddMetric.tsx

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 { useSelector } from "react-redux";
import AddSource from "../../Playbooks/task/AddSource";
import Details from "../../Playbooks/task/Details";
import { currentPlaybookSelector } from "../../../store/features/playbook/selectors";
import RunButton from "../../Buttons/RunButton";
import HandleOutput from "../../Playbooks/task/HandleOutput";
import SelectTaskType from "./SelectTaskType";
import { unsupportedConnctorTypeOptions } from "../../../utils/playbook/unsupportedConnctorTypeOptions";
import SelectConnectorOption from "../../Playbooks/task/source/SelectConnectorOption";
import AddMetricSource from "./AddMetricSource";
 
function AddMetric() {
  const currentPlaybook = useSelector(currentPlaybookSelector);
  const tasks = currentPlaybook?.ui_requirement?.tasks ?? [];
  const steps = currentPlaybook?.steps ?? [];
  Iif (tasks.length === 0 || steps.length === 0) return;
  Iif (steps[0].tasks.length === 0) return;
  const firstTask = steps[0].tasks[0];
 
  const currentTask = tasks.find((e) =>
    typeof firstTask === "string" ? firstTask === e.id : firstTask.id === e.id,
  );
 
  Iif (!currentTask?.id) return;
 
  return (
    <div className="flex flex-col gap-1 border p-2 rounded">
      <p className="font-bold text-violet-500 text-sm">Metric</p>
      <div className="flex w-full gap-4 justify-start">
        <div className="flex flex-col flex-[0.5]">
          <AddMetricSource id={currentTask.id} />
          {currentTask.source && (
            <>
              <Details
                id={currentTask.id}
                allowMultipleMetricSelection={false}
              />
              <div className="w-fit mt-2">
                <RunButton id={currentTask.id} />
              </div>
            </>
          )}
        </div>
        <div className="flex-[0.6] max-h-[400px] overflow-scroll">
          <HandleOutput id={currentTask.id} />
        </div>
      </div>
    </div>
  );
}
 
export default AddMetric;