formatting code
This commit is contained in:
parent
2f469ca964
commit
7dcc6f2b8c
5 changed files with 59 additions and 80 deletions
|
|
@ -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>
|
|
||||||
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
|
|
|
||||||
|
|
@ -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">
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
||||||
{/*
|
{/*
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue