formatting code

src/frontend/src/modals/ApiModal/index.tsx

@@ -20,14 +20,7 @@ import IntComponent from "../../components/intComponent";
 import PromptAreaComponent from "../../components/promptComponent";
 import TextAreaComponent from "../../components/textAreaComponent";
 import ToggleShadComponent from "../../components/toggleShadComponent";
-import {
+import { DialogTitle } from "../../components/ui/dialog";
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "../../components/ui/dialog";
 import {
   Table,
   TableBody,
@@ -54,7 +47,13 @@ import { FlowType } from "../../types/flow/index";
 import { buildTweaks, classNames } from "../../utils";
 import BaseModal from "../baseModal";
 
-export default function ApiModal({ flow, children }: { flow: FlowType; children: ReactNode }) {
+export default function ApiModal({
+  flow,
+  children,
+}: {
+  flow: FlowType;
+  children: ReactNode;
+}) {
   const [open, setOpen] = useState(true);
   const { dark } = useContext(darkContext);
   const { closePopUp, closeEdit, setCloseEdit } = useContext(PopUpContext);
@@ -266,13 +265,9 @@ export default function ApiModal({ flow, children }: { flow: FlowType; children:
   }
 
   return (
-
     <BaseModal>
-    <BaseModal.Trigger>
+      <BaseModal.Trigger>{children}</BaseModal.Trigger>
-      {children}
-    </BaseModal.Trigger>
       <BaseModal.Header description={EXPORT_CODE_DIALOG}>
-
         <DialogTitle className="flex items-center">
           <span className="pr-2">Code</span>
           <Code2
@@ -283,7 +278,6 @@ export default function ApiModal({ flow, children }: { flow: FlowType; children:
         </DialogTitle>
       </BaseModal.Header>
       <BaseModal.Content>
-
         <Tabs
           value={activeTab}
           className="api-modal-tabs"
@@ -733,9 +727,6 @@ export default function ApiModal({ flow, children }: { flow: FlowType; children:
           ))}
         </Tabs>
       </BaseModal.Content>
-
-
     </BaseModal>
-
   );
 }

src/frontend/src/modals/EditNodeModal/index.tsx

@@ -28,7 +28,13 @@ import { NodeDataType } from "../../types/flow";
 import { classNames, limitScrollFieldsModal } from "../../utils";
 import BaseModal from "../baseModal";
 
-export default function EditNodeModal({ data, children }: { data: NodeDataType; children: ReactNode }) {
+export default function EditNodeModal({
+  data,
+  children,
+}: {
+  data: NodeDataType;
+  children: ReactNode;
+}) {
   const [modalOpen, setModalOpen] = useState(false);
 
   const [nodeLength, setNodeLength] = useState(
@@ -59,7 +65,6 @@ export default function EditNodeModal({ data, children }: { data: NodeDataType;
     closePopUp();
   }
 
-
   function changeAdvanced(node) {
     Object.keys(data.node.template).map((n, i) => {
       if (n === node.name) {
@@ -84,12 +89,9 @@ export default function EditNodeModal({ data, children }: { data: NodeDataType;
     });
   };
 
-  
   return (
     <BaseModal size="large-h-full" open={modalOpen} setOpen={setModalOpen}>
-      <BaseModal.Trigger>
+      <BaseModal.Trigger>{children}</BaseModal.Trigger>
-        {children}
-      </BaseModal.Trigger>
       <BaseModal.Header description={data.node?.description}>
         <DialogTitle className="flex items-center">
           <span className="pr-2">{data.type}</span>

src/frontend/src/modals/exportModal/index.tsx

@@ -1,11 +1,10 @@
 import { Download } from "lucide-react";
-import { ReactNode, useContext, useRef, useState } from "react";
+import { ReactNode, useContext, useState } from "react";
 import EditFlowSettings from "../../components/EditFlowSettingsComponent";
 import { Button } from "../../components/ui/button";
 import { Checkbox } from "../../components/ui/checkbox";
 import { DialogTitle } from "../../components/ui/dialog";
 import { EXPORT_DIALOG_SUBTITLE } from "../../constants";
-import { alertContext } from "../../contexts/alertContext";
 import { PopUpContext } from "../../contexts/popUpContext";
 import { TabsContext } from "../../contexts/tabsContext";
 import { removeApiKeys } from "../../utils";
@@ -22,11 +21,8 @@ export default function ExportModal({children} : {children: ReactNode}) {
   );
   return (
     <BaseModal size="smaller">
-        <BaseModal.Trigger>
+      <BaseModal.Trigger>{children}</BaseModal.Trigger>
-          {children}
-        </BaseModal.Trigger>
       <BaseModal.Header description={EXPORT_DIALOG_SUBTITLE}>
-
         <DialogTitle className="flex items-center">
           <span className="pr-2">Export</span>
           <Download

src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -77,27 +77,20 @@ export default function ExtraSidebar() {
 
         <ShadTooltip content="Export" side="top">
           <ExportModal>
-        <button
+            <button className={classNames("extra-side-bar-buttons")}>
-            className={classNames("extra-side-bar-buttons")}
-          >
               <FileDown
                 strokeWidth={1.5}
                 className="side-bar-button-size"
               ></FileDown>
             </button>
-
           </ExportModal>
-
         </ShadTooltip>
         <ShadTooltip content="Code" side="top">
           <ApiModal flow={flows.find((f) => f.id === tabId)}>
-        <button
+            <button className={classNames("extra-side-bar-buttons")}>
-            className={classNames("extra-side-bar-buttons")}
-          >
               <Code2 strokeWidth={1.5} className="side-bar-button-size"></Code2>
             </button>
           </ApiModal>
-
         </ShadTooltip>
 
         <ShadTooltip content="Save" side="top">

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

@@ -96,7 +96,6 @@ const NodeToolbarComponent = (props) => {
 
           <ShadTooltip content="Edit" side="top">
             <EditNodeModal data={props.data}>
-
               <button
                 className={classNames(
                   "relative -ml-px inline-flex items-center rounded-r-md bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset  ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
@@ -107,9 +106,7 @@ const NodeToolbarComponent = (props) => {
               >
                 <Settings2 className="h-4 w-4 "></Settings2>
               </button>
-            
             </EditNodeModal>
-
           </ShadTooltip>
 
           {/*