Function ScriptPanel

client/src/components/scriptPanel/ScriptPanel.tsx:73–256

({
  currentScript,
  collections,
  dispatchCurrentScript,
  dispatchCollections,
  forceSetScriptResult,
}: ScriptPanelProps)

};

function ScriptPanel({
  currentScript,
  collections,
  dispatchCurrentScript,
  dispatchCollections,
  forceSetScriptResult,
}: ScriptPanelProps) {
  const { colorMode } = useColorMode();
  const toast = useToast();
  const [isRunning, setIsRunning] = useState(false);

  const envNames = useMemo(() => {
    const collection = findCollection(collections, currentScript.collectionId);
    if (!collection) return [];
    return Object.keys(collection.data?.envs ?? {});
  }, [collections, currentScript.collectionId]);

  const setName = useCallback(
    (name: string) => {
      dispatchCurrentScript({
        type: CurrentScriptActionType.PATCH_DATA,
        data: { name },
      });
    },
    [dispatchCurrentScript],
  );

  const setDescription = useCallback(
    (description: string) => {
      dispatchCurrentScript({
        type: CurrentScriptActionType.PATCH_DATA,
        data: { description },
      });
    },
    [dispatchCurrentScript],
  );

  const handleRunClick = useCallback(async () => {
    try {
      if (isRunning) return;
      setIsRunning(true);
      const envName = currentScript.data.selectedEnvName;
      const res = await api.runScript(currentScript, envName);
      if (res.status !== 200) throw new Error();
      const newResult = await res.json();
      dispatchCurrentScript({
        type: CurrentScriptActionType.PATCH_DATA,
        data: { results: [newResult, ...(currentScript.data.results ?? [])] },
      });
      dispatchCollections({
        type: CollectionsActionType.PATCH_SCRIPT_DATA,
        id: currentScript.id,
        data: { results: [newResult, ...(currentScript.data.results ?? [])] },
      });
      if (forceSetScriptResult.current) {
        forceSetScriptResult.current(newResult);
      }
      successToast('Run finished', toast);