All files / src/components/script ScriptEventChildren.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
54
55
56
57
58
59
60
61
62
63
64
65
66
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import AddButton from "components/script/AddButton";
import ScriptEditorEvent from "components/script/ScriptEditorEvent";
import React, { useRef } from "react";
import { ScriptEditorChildren } from "ui/scripting/ScriptEvents";
import useOnScreen from "ui/hooks/use-on-screen";
import { useScriptEventTitle } from "components/script/hooks/useScriptEventTitle";
import { ScriptEventNormalized } from "shared/lib/entities/entitiesTypes";
 
interface ScriptEventChildrenProps {
  nestLevel: number;
  label: string;
  entityId: string;
  parentId: string;
  parentKey: string;
  scriptEvent?: ScriptEventNormalized;
}
 
export const ScriptEventChildren = ({
  nestLevel,
  label,
  entityId,
  parentId,
  parentKey,
  scriptEvent,
}: ScriptEventChildrenProps) => {
  const ref = useRef<HTMLDivElement>(null);
  const isVisible = useOnScreen(ref);
  const eventLabel = useScriptEventTitle(
    scriptEvent?.command ?? "",
    scriptEvent?.args ?? {},
    isVisible
  );
  const title = `${label}${eventLabel && label ? " : " : ""}${eventLabel}`;
  const children = scriptEvent?.children?.[parentKey] || [];
 
  return (
    <ScriptEditorChildren
      ref={ref}
      label={title}
      shortLabel={label}
      title={title}
      nestLevel={nestLevel}
    >
      {children.map((child, childIndex) => (
        <ScriptEditorEvent
          key={`${child}_${childIndex}`}
          id={child}
          index={childIndex}
          nestLevel={nestLevel + 1}
          parentType="scriptEvent"
          parentId={parentId}
          parentKey={parentKey}
          entityId={entityId}
        />
      ))}
      <AddButton
        parentType="scriptEvent"
        parentId={parentId}
        parentKey={parentKey}
        nestLevel={nestLevel}
        conditional={true}
      />
    </ScriptEditorChildren>
  );
};