formatting code

This commit is contained in:
Cristhian Zanforlin Lousa 2023-07-13 18:08:36 -03:00
commit 7dcc6f2b8c
5 changed files with 59 additions and 80 deletions

View file

@ -20,14 +20,7 @@ import IntComponent from "../../components/intComponent";
import PromptAreaComponent from "../../components/promptComponent"; import PromptAreaComponent from "../../components/promptComponent";
import TextAreaComponent from "../../components/textAreaComponent"; import TextAreaComponent from "../../components/textAreaComponent";
import ToggleShadComponent from "../../components/toggleShadComponent"; import ToggleShadComponent from "../../components/toggleShadComponent";
import { import { DialogTitle } from "../../components/ui/dialog";
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "../../components/ui/dialog";
import { import {
Table, Table,
TableBody, TableBody,
@ -54,7 +47,13 @@ import { FlowType } from "../../types/flow/index";
import { buildTweaks, classNames } from "../../utils"; import { buildTweaks, classNames } from "../../utils";
import BaseModal from "../baseModal"; 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 [open, setOpen] = useState(true);
const { dark } = useContext(darkContext); const { dark } = useContext(darkContext);
const { closePopUp, closeEdit, setCloseEdit } = useContext(PopUpContext); const { closePopUp, closeEdit, setCloseEdit } = useContext(PopUpContext);
@ -266,25 +265,20 @@ export default function ApiModal({ flow, children }: { flow: FlowType; children:
} }
return ( return (
<BaseModal> <BaseModal>
<BaseModal.Trigger> <BaseModal.Trigger>{children}</BaseModal.Trigger>
{children} <BaseModal.Header description={EXPORT_CODE_DIALOG}>
</BaseModal.Trigger> <DialogTitle className="flex items-center">
<BaseModal.Header description={EXPORT_CODE_DIALOG}> <span className="pr-2">Code</span>
<Code2
<DialogTitle className="flex items-center"> strokeWidth={1.5}
<span className="pr-2">Code</span> className="h-6 w-6 pl-1 text-primary "
<Code2 aria-hidden="true"
strokeWidth={1.5} />
className="h-6 w-6 pl-1 text-primary " </DialogTitle>
aria-hidden="true" </BaseModal.Header>
/> <BaseModal.Content>
</DialogTitle> <Tabs
</BaseModal.Header>
<BaseModal.Content>
<Tabs
value={activeTab} value={activeTab}
className="api-modal-tabs" className="api-modal-tabs"
onValueChange={(value) => { onValueChange={(value) => {
@ -732,10 +726,7 @@ export default function ApiModal({ flow, children }: { flow: FlowType; children:
</TabsContent> </TabsContent>
))} ))}
</Tabs> </Tabs>
</BaseModal.Content> </BaseModal.Content>
</BaseModal>
</BaseModal>
); );
} }

View file

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

View file

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

View file

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

View file

@ -95,21 +95,18 @@ const NodeToolbarComponent = (props) => {
</ShadTooltip> </ShadTooltip>
<ShadTooltip content="Edit" side="top"> <ShadTooltip content="Edit" side="top">
<EditNodeModal data={props.data} > <EditNodeModal data={props.data}>
<button
<button className={classNames(
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" +
"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" + (nodeLength == 0
(nodeLength == 0 ? " text-muted-foreground"
? " text-muted-foreground" : " text-foreground")
: " text-foreground") )}
)} >
> <Settings2 className="h-4 w-4 "></Settings2>
<Settings2 className="h-4 w-4 "></Settings2> </button>
</button> </EditNodeModal>
</EditNodeModal>
</ShadTooltip> </ShadTooltip>
{/* {/*