diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json index 946c79864..fe7a4c557 100644 --- a/src/frontend/package-lock.json +++ b/src/frontend/package-lock.json @@ -143,10 +143,9 @@ } }, "node_modules/@babel/compat-data": { - "version": "7.22.6", + "version": "7.22.9", "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.22.6.tgz", "integrity": "sha512-29tfsWTq2Ftu7MXmimyC0C5FDZv5DYxOZkh3XD3+QW4V/BYuv/LyEsjj3c0hqedEaDt6DBfDvexMKU8YevdqFg==", - "version": "7.22.9", "license": "MIT", "engines": { "node": ">=6.9.0" @@ -2614,6 +2613,15 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/axios": { + "version": "0.14.0", + "resolved": "https://registry.npmjs.org/@types/axios/-/axios-0.14.0.tgz", + "integrity": "sha512-KqQnQbdYE54D7oa/UmYVMZKq7CO4l8DEENzOKc4aBRwxCXSlJXGz83flFx5L7AWrOQnmuN3kVsRdt+GZPPjiVQ==", + "deprecated": "This is a stub types definition for axios (https://github.com/mzabriskie/axios). axios provides its own type definitions, so you don't need @types/axios installed!", + "dependencies": { + "axios": "*" + } + }, "node_modules/@types/cacheable-request": { "version": "6.0.3", "dev": true, diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index 17d004d62..09dee5aa6 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -28,6 +28,7 @@ import { getRandomKeyByssmm, groupByFamily, } from "../../../../utils/utils"; +import { NodeDataType } from "../../../../types/flow"; export default function ParameterComponent({ left, @@ -43,7 +44,7 @@ export default function ParameterComponent({ optionalHandle = null, info = "", }: ParameterComponentType): JSX.Element { - const ref = useRef(null); + const ref = useRef(null); const refHtml = useRef(null); const refNumberComponents = useRef(0); const infoHtml = useRef(null); @@ -69,7 +70,7 @@ export default function ParameterComponent({ const { data: myData } = useContext(typesContext); - const handleOnNewValue = (newValue: any) => { + const handleOnNewValue = (newValue: string | string[] | boolean): void => { let newData = cloneDeep(data); newData.node.template[name].value = newValue; setData(newData); @@ -220,9 +221,9 @@ export default function ParameterComponent({ {left === true && type === "str" && - !data.node.template[name].options ? ( + !data.node?.template[name].options ? (
- {data.node.template[name].list ? ( + {data.node?.template[name].list ? ( - ) : data.node.template[name].multiline ? ( + ) : data.node?.template[name].multiline ? ( )} @@ -252,7 +253,7 @@ export default function ParameterComponent({
{ handleOnNewValue(t); }} @@ -263,13 +264,13 @@ export default function ParameterComponent({
) : left === true && type === "str" && - data.node.template[name].options ? ( + data.node?.template[name].options ? (
@@ -293,10 +294,10 @@ export default function ParameterComponent({
{ data.node.template[name].file_path = t; save(); @@ -307,7 +308,7 @@ export default function ParameterComponent({
@@ -320,7 +321,7 @@ export default function ParameterComponent({ }} nodeClass={data.node} disabled={disabled} - value={data.node.template[name].value ?? ""} + value={data.node?.template[name].value ?? ""} onChange={handleOnNewValue} />
diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index b58a68484..4009d2bbd 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -104,9 +104,9 @@ export default function GenericNode({ iconColor={`${nodeColors[types[data.type]]}`} />
- +
- {data.node.display_name} + {data.node?.display_name}
@@ -171,7 +171,7 @@ export default function GenericNode({
-
{data.node.description}
+
{data.node?.description}
<> {Object.keys(data.node.template) @@ -184,35 +184,35 @@ export default function GenericNode({ data={data} setData={setData} color={ - nodeColors[types[data.node.template[t].type]] ?? - nodeColors[data.node.template[t].type] ?? + nodeColors[types[data.node?.template[t].type]] ?? + nodeColors[data.node?.template[t].type] ?? nodeColors.unknown } title={ - data.node.template[t].display_name + data.node?.template[t].display_name ? data.node.template[t].display_name - : data.node.template[t].name + : data.node?.template[t].name ? toTitleCase(data.node.template[t].name) : toTitleCase(t) } - info={data.node.template[t].info} + info={data.node?.template[t].info} name={t} tooltipTitle={ - data.node.template[t].input_types?.join("\n") ?? - data.node.template[t].type + data.node?.template[t].input_types?.join("\n") ?? + data.node?.template[t].type } - required={data.node.template[t].required} + required={data.node?.template[t].required} id={ - (data.node.template[t].input_types?.join(";") ?? - data.node.template[t].type) + + (data.node?.template[t].input_types?.join(";") ?? + data.node?.template[t].type) + "|" + t + "|" + data.id } left={true} - type={data.node.template[t].type} - optionalHandle={data.node.template[t].input_types} + type={data.node?.template[t].type} + optionalHandle={data.node?.template[t].input_types} /> ) : ( <> @@ -232,13 +232,13 @@ export default function GenericNode({ setData={setData} color={nodeColors[types[data.type]] ?? nodeColors.unknown} title={ - data.node.output_types && data.node.output_types.length > 0 + data.node?.output_types && data.node.output_types.length > 0 ? data.node.output_types.join("|") : data.type } - tooltipTitle={data.node.base_classes.join("\n")} + tooltipTitle={data.node?.base_classes.join("\n")} id={[data.type, data.id, ...data.node.base_classes].join("|")} - type={data.node.base_classes.join("|")} + type={data.node?.base_classes.join("|")} left={false} /> diff --git a/src/frontend/src/components/CrashErrorComponent/index.tsx b/src/frontend/src/components/CrashErrorComponent/index.tsx index cd6a976be..64f9a2e49 100644 --- a/src/frontend/src/components/CrashErrorComponent/index.tsx +++ b/src/frontend/src/components/CrashErrorComponent/index.tsx @@ -2,6 +2,7 @@ export default function CrashErrorComponent({ error, resetErrorBoundary, }): JSX.Element { + console.log({error, resetErrorBoundary}) return (
diff --git a/src/frontend/src/components/EditFlowSettingsComponent/index.tsx b/src/frontend/src/components/EditFlowSettingsComponent/index.tsx index 4a813445c..d2b1592be 100644 --- a/src/frontend/src/components/EditFlowSettingsComponent/index.tsx +++ b/src/frontend/src/components/EditFlowSettingsComponent/index.tsx @@ -28,12 +28,12 @@ export const EditFlowSettings: React.FC = ({ }; const [desc, setDesc] = useState( - flows.find((f) => f.id === tabId).description + flows.find((f) => f.id === tabId)?.description ); const handleDescriptionChange = (event: ChangeEvent) => { flows.find((f) => f.id === tabId).description = event.target.value; - setDesc(flows.find((f) => f.id === tabId).description); + setDesc(flows.find((f) => f.id === tabId)?.description); setDescription(event.target.value); }; diff --git a/src/frontend/src/components/cardComponent/index.tsx b/src/frontend/src/components/cardComponent/index.tsx index 3a1388f53..1feaa4e3b 100644 --- a/src/frontend/src/components/cardComponent/index.tsx +++ b/src/frontend/src/components/cardComponent/index.tsx @@ -10,18 +10,14 @@ import { CardHeader, CardTitle, } from "../ui/card"; +import { cardComponentPropsType } from "../../types/components"; export const CardComponent = ({ flow, id, onDelete, button, -}: { - flow: FlowType; - id: string; - onDelete?: () => void; - button?: JSX.Element; -}): JSX.Element => { +}: cardComponentPropsType): JSX.Element => { const { removeFlow } = useContext(TabsContext); return ( diff --git a/src/frontend/src/components/codeTabsComponent/index.tsx b/src/frontend/src/components/codeTabsComponent/index.tsx index 1357e0c79..b01bc85fa 100644 --- a/src/frontend/src/components/codeTabsComponent/index.tsx +++ b/src/frontend/src/components/codeTabsComponent/index.tsx @@ -103,7 +103,7 @@ export default function CodeTabsComponent({ function openAccordions() { let accordionsToOpen = []; - tweaks.tweak.current.forEach((el) => { + tweaks?.tweak.current.forEach((el) => { Object.keys(el).forEach((key) => { if (Object.keys(el[key]).length > 0) { accordionsToOpen.push(key); @@ -193,9 +193,9 @@ export default function CodeTabsComponent({ : "overflow-hidden" )} > - {data.map((t: any, index) => ( + {data?.map((t: any, index) => (
- {tweaks.tweaksList.current.includes(t["data"]["id"]) && ( + {tweaks?.tweaksList.current.includes(t["data"]["id"]) && ( )} - {tweaks.tweaksList.current.length === 0 && ( + {tweaks?.tweaksList.current.length === 0 && ( <>
No tweaks are available for this flow. diff --git a/src/frontend/src/components/ui/rename-label.tsx b/src/frontend/src/components/ui/rename-label.tsx index e1cef4996..b8c4ed61a 100644 --- a/src/frontend/src/components/ui/rename-label.tsx +++ b/src/frontend/src/components/ui/rename-label.tsx @@ -23,7 +23,7 @@ export default function RenameLabel(props) { }); if (inputRef.current) { setTimeout(() => { - inputRef.current.focus(); + inputRef.current?.focus(); }, 100); } } diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx index 0ec6eb99c..cd31b6edd 100644 --- a/src/frontend/src/modals/EditNodeModal/index.tsx +++ b/src/frontend/src/modals/EditNodeModal/index.tsx @@ -53,7 +53,7 @@ const EditNodeModal = forwardRef( reactFlowInstance?.getEdges().some((e) => e.targetHandle === data.id) ?? false; - function changeAdvanced(n) { + function changeAdvanced(n: string): void { setMyData((old) => { let newData = cloneDeep(old); newData.node.template[n].advanced = !newData.node.template[n].advanced; @@ -61,7 +61,7 @@ const EditNodeModal = forwardRef( }); } - const handleOnNewValue = (newValue: any, name) => { + const handleOnNewValue = (newValue: string | string[] | boolean, name: string) => { setMyData((old) => { let newData = cloneDeep(old); newData.node.template[name].value = newValue; @@ -115,7 +115,7 @@ const EditNodeModal = forwardRef( .filter( (t) => t.charAt(0) !== "_" && - myData.node.template[t].show && + myData.node?.template[t].show && (myData.node.template[t].type === "str" || myData.node.template[t].type === "bool" || myData.node.template[t].type === "float" || @@ -127,12 +127,12 @@ const EditNodeModal = forwardRef( .map((n, i) => ( - {myData.node.template[n].name + {myData.node?.template[n].name ? myData.node.template[n].name - : myData.node.template[n].display_name} + : myData.node?.template[n].display_name} - {myData.node.template[n].type === "str" && + {myData.node?.template[n].type === "str" && !myData.node.template[n].options ? (
{myData.node.template[n].list ? ( @@ -177,7 +177,7 @@ const EditNodeModal = forwardRef( /> )}
- ) : myData.node.template[n].type === "bool" ? ( + ) : myData.node?.template[n].type === "bool" ? (
{" "}
- ) : myData.node.template[n].type === "float" ? ( + ) : myData.node?.template[n].type === "float" ? (
- ) : myData.node.template[n].type === "str" && + ) : myData.node?.template[n].type === "str" && myData.node.template[n].options ? (
- ) : myData.node.template[n].type === "int" ? ( + ) : myData.node?.template[n].type === "int" ? (
- ) : myData.node.template[n].type === "file" ? ( + ) : myData.node?.template[n].type === "file" ? (
- ) : myData.node.template[n].type === "prompt" ? ( + ) : myData.node?.template[n].type === "prompt" ? (
- ) : myData.node.template[n].type === "code" ? ( + ) : myData.node?.template[n].type === "code" ? (
- ) : myData.node.template[n].type === "Any" ? ( + ) : myData.node?.template[n].type === "Any" ? ( "-" ) : (
@@ -279,7 +279,7 @@ const EditNodeModal = forwardRef(
changeAdvanced(n)} disabled={disabled} size="small" diff --git a/src/frontend/src/modals/baseModal/index.tsx b/src/frontend/src/modals/baseModal/index.tsx index 71379cbfa..4b21d613e 100644 --- a/src/frontend/src/modals/baseModal/index.tsx +++ b/src/frontend/src/modals/baseModal/index.tsx @@ -9,7 +9,7 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; -import { headerConstType } from "../../types/components"; +import { modalHeaderType } from "../../types/components"; type ContentProps = { children: ReactNode }; type HeaderProps = { children: ReactNode; description: string }; @@ -23,10 +23,10 @@ const Trigger: React.FC = ({ children }) => { return <>{children}; }; -const Header: React.FC<{ children: ReactNode; description: string }> = ({ +const Header: React.FC<{ children: ReactNode; description: string | null }> = ({ children, description, -}: headerConstType): JSX.Element => { +}: modalHeaderType): JSX.Element => { return ( {children} diff --git a/src/frontend/src/modals/exportModal/index.tsx b/src/frontend/src/modals/exportModal/index.tsx index e07e9d144..9e9f79be3 100644 --- a/src/frontend/src/modals/exportModal/index.tsx +++ b/src/frontend/src/modals/exportModal/index.tsx @@ -12,9 +12,9 @@ const ExportModal = forwardRef((props: { children: ReactNode }, ref): JSX.Elemen const { flows, tabId, updateFlow, downloadFlow, saveFlow } = useContext(TabsContext); const [checked, setChecked] = useState(false); - const [name, setName] = useState(flows.find((f) => f.id === tabId).name); + const [name, setName] = useState(flows.find((f) => f.id === tabId)?.name); const [description, setDescription] = useState( - flows.find((f) => f.id === tabId).description + flows.find((f) => f.id === tabId)?.description ); const [open, setOpen] = useState(false); return ( diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx index 1464cd34e..644d7c4e5 100644 --- a/src/frontend/src/modals/formModal/index.tsx +++ b/src/frontend/src/modals/formModal/index.tsx @@ -46,7 +46,7 @@ export default function FormModal({ const handleKeys = formKeysData.handle_keys; const keyToUse = Object.keys(inputKeys).find( - (k) => !handleKeys.some((j) => j === k) && inputKeys[k] === "" + (k) => !handleKeys?.some((j) => j === k) && inputKeys[k] === "" ); return inputKeys[keyToUse]; @@ -311,7 +311,7 @@ export default function FormModal({ async function sendAll(data: sendAllProps): Promise { try { if (ws) { - ws.current.send(JSON.stringify(data)); + ws.current?.send(JSON.stringify(data)); } } catch (error) { setErrorData({ @@ -349,7 +349,7 @@ export default function FormModal({ tabsState[flow.id].formKeysData.template ); sendAll({ - ...reactFlowInstance.toObject(), + ...reactFlowInstance?.toObject(), inputs: inputs, chatHistory, name: flow.name, @@ -370,7 +370,7 @@ export default function FormModal({ } function clearChat(): void { setChatHistory([]); - ws.current.send(JSON.stringify({ clear_history: true })); + ws.current?.send(JSON.stringify({ clear_history: true })); if (lockChat) setLockChat(false); } @@ -451,7 +451,7 @@ export default function FormModal({ size="small" disabled={tabsState[ id.current - ].formKeysData.handle_keys.some((t) => t === i)} + ].formKeysData.handle_keys?.some((t) => t === i)} />
@@ -460,7 +460,7 @@ export default function FormModal({ keyValue={i} >
- {tabsState[id.current].formKeysData.handle_keys.some( + {tabsState[id.current].formKeysData.handle_keys?.some( (t) => t === i ) && (
@@ -489,7 +489,7 @@ export default function FormModal({
) )} - {tabsState[id.current].formKeysData.memory_keys.map((i, k) => ( + {tabsState[id.current].formKeysData.memory_keys?.map((i, k) => (
t === i)} + ].formKeysData.handle_keys?.some((t) => t === i)} />
@@ -521,7 +521,7 @@ export default function FormModal({ keyValue={i} >
- {tabsState[id.current].formKeysData.handle_keys.some( + {tabsState[id.current].formKeysData.handle_keys?.some( (t) => t === i ) && (
diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx index 1e665c65c..d569af09f 100644 --- a/src/frontend/src/modals/genericModal/index.tsx +++ b/src/frontend/src/modals/genericModal/index.tsx @@ -120,7 +120,7 @@ export default function GenericModal({ : "code-nohighlight"; } - function validatePrompt(closeModal: boolean) { + function validatePrompt(closeModal: boolean): void { postValidatePrompt(field_name, inputValue, nodeClass) .then((apiReturn) => { if (apiReturn.data) { diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index 474ea614b..a6d7a1c90 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -6,6 +6,7 @@ import ReactFlow, { Controls, Edge, EdgeChange, + Node, NodeChange, NodeDragHandler, OnEdgesDelete, @@ -78,7 +79,7 @@ export default function Page({ flow }: { flow: FlowType }): JSX.Element { lastCopiedSelection ) { event.preventDefault(); - let bounds = reactFlowWrapper.current.getBoundingClientRect(); + let bounds = reactFlowWrapper.current?.getBoundingClientRect(); paste(lastCopiedSelection, { x: position.x - bounds.left, y: position.y - bounds.top, @@ -185,10 +186,10 @@ export default function Page({ flow }: { flow: FlowType }): JSX.Element { ...params, style: { stroke: "#555" }, className: - (params.targetHandle.split("|")[0] === "Text" + (params.targetHandle?.split("|")[0] === "Text" ? "stroke-foreground " : "stroke-foreground ") + " stroke-connection", - animated: params.targetHandle.split("|")[0] === "Text", + animated: params.targetHandle?.split("|")[0] === "Text", }, eds ) @@ -234,7 +235,7 @@ export default function Page({ flow }: { flow: FlowType }): JSX.Element { // Get the current bounds of the ReactFlow wrapper element const reactflowBounds = - reactFlowWrapper.current.getBoundingClientRect(); + reactFlowWrapper.current?.getBoundingClientRect(); // Extract the data from the drag event and parse it as a JSON object let data: { type: string; node?: APIClassType } = JSON.parse( @@ -243,7 +244,7 @@ export default function Page({ flow }: { flow: FlowType }): JSX.Element { // If data type is not "chatInput" or if there are no "chatInputNode" nodes present in the ReactFlow instance, create a new node // Calculate the position where the node should be created - const position = reactFlowInstance.project({ + const position = reactFlowInstance?.project({ x: event.clientX - reactflowBounds.left, y: event.clientY - reactflowBounds.top, }); diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index 5ec627a49..032e61952 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -12,7 +12,7 @@ export default function NodeToolbarComponent({ data, setData, deleteNode }: node Object.keys(data.node.template).filter( (t) => t.charAt(0) !== "_" && - data.node.template[t].show && + data.node?.template[t].show && (data.node.template[t].type === "str" || data.node.template[t].type === "bool" || data.node.template[t].type === "float" || @@ -56,8 +56,8 @@ export default function NodeToolbarComponent({ data, setData, deleteNode }: node { x: 50, y: 10, - paneX: reactFlowInstance.getNode(data.id).position.x, - paneY: reactFlowInstance.getNode(data.id).position.y, + paneX: reactFlowInstance.getNode(data.id)?.position.x, + paneY: reactFlowInstance.getNode(data.id)?.position.y, } ); }} @@ -68,23 +68,23 @@ export default function NodeToolbarComponent({ data, setData, deleteNode }: node { - if (data.node.documentation === "") { + if (data.node?.documentation === "") { event.preventDefault(); } }} diff --git a/src/frontend/src/types/alerts/index.ts b/src/frontend/src/types/alerts/index.ts index 7033d99eb..1b671e145 100644 --- a/src/frontend/src/types/alerts/index.ts +++ b/src/frontend/src/types/alerts/index.ts @@ -1,12 +1,12 @@ export type ErrorAlertType = { title: string; - list: Array; + list: Array | undefined; id: string; removeAlert: (id: string) => void; }; export type NoticeAlertType = { title: string; - link: string; + link: string | undefined; id: string; removeAlert: (id: string) => void; }; diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index da02c43cc..b27c931a7 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -3,6 +3,7 @@ import { APIClassType, APITemplateType } from "../api"; import { FlowStyleType, FlowType, NodeDataType } from "../flow/index"; import { typesContextType } from "../typesContext"; import { ChatMessageType } from "../chat"; +import { ReactFlowJsonObject } from "reactflow"; export type InputComponentType = { value: string; @@ -16,7 +17,7 @@ export type InputComponentType = { export type ToggleComponentType = { enabled: boolean; setEnabled: (state: boolean) => void; - disabled: boolean; + disabled: boolean | undefined; size: "small" | "medium" | "large"; }; export type DropDownComponentType = { @@ -34,12 +35,12 @@ export type ParameterComponentType = { id: string; color: string; left: boolean; - type: string; + type: string | undefined; required?: boolean; name?: string; - tooltipTitle: string; + tooltipTitle: string | undefined; dataContext?: typesContextType; - optionalHandle?: Array; + optionalHandle?: Array | null; info?: string; }; export type InputListComponentType = { @@ -238,7 +239,7 @@ export type chatTriggerPropType = { }; export type headerFlowsType = { - data: object; + data: ReactFlowJsonObject; description: string; id: string; name: string; @@ -288,7 +289,7 @@ export type fileCardPropsType = { export type nodeToolbarPropsType = { data: NodeDataType; deleteNode: (idx: string) => void; - setData: (newState: {}) => void; + setData: (newState: NodeDataType) => void; }; export type parsedDataType = { @@ -309,16 +310,16 @@ export type iconsType = { [key: string]: React.ElementType; }; -export type headerConstType = { +export type modalHeaderType = { children: ReactNode; - description: string; + description: string | null; }; export type codeAreaModalPropsType = { setValue: (value: string) => void; value: string; - nodeClass: APIClassType; - setNodeClass: (Class: APIClassType) => void; + nodeClass: APIClassType | undefined; + setNodeClass: (Class: APIClassType) => void | undefined; children: ReactNode; }; @@ -361,3 +362,14 @@ export type FlowSettingsPropsType = { open: boolean; setOpen: (open: boolean) => void; }; + +export type groupDataType = { + [char: string]: string; +} + +export type cardComponentPropsType = { + flow: FlowType; + id: string; + onDelete?: () => void; + button?: JSX.Element; +}; diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts index c4bec22c9..8df806545 100644 --- a/src/frontend/src/utils/reactflowUtils.ts +++ b/src/frontend/src/utils/reactflowUtils.ts @@ -24,8 +24,8 @@ export function cleanEdges({ if (targetHandle) { const field = targetHandle.split("|")[1]; const id = - (targetNode.data.node.template[field]?.input_types?.join(";") ?? - targetNode.data.node.template[field]?.type) + + (targetNode.data.node?.template[field]?.input_types?.join(";") ?? + targetNode.data.node?.template[field]?.type) + "|" + field + "|" + @@ -38,7 +38,7 @@ export function cleanEdges({ const id = [ sourceNode.data.type, sourceNode.data.id, - ...sourceNode.data.node.base_classes, + ...sourceNode.data.node?.base_classes, ].join("|"); if (id !== sourceHandle) { newEdges = newEdges.filter((e) => e.id !== edge.id); @@ -55,19 +55,19 @@ export function isValidConnection( ) { if ( targetHandle - .split("|")[0] + ?.split("|")[0] .split(";") - .some((n) => n === sourceHandle.split("|")[0]) || + .some((n) => n === sourceHandle?.split("|")[0]) || sourceHandle - .split("|") + ?.split("|") .slice(2) .some((t) => targetHandle - .split("|")[0] + ?.split("|")[0] .split(";") .some((n) => n === t) ) || - targetHandle.split("|")[0] === "str" + targetHandle?.split("|")[0] === "str" ) { let targetNode = reactFlowInstance?.getNode(target)?.data?.node; if (!targetNode) { @@ -79,11 +79,11 @@ export function isValidConnection( return true; } } else if ( - (!targetNode.template[targetHandle.split("|")[1]].list && + (!targetNode.template[targetHandle?.split("|")[1]].list && !reactFlowInstance .getEdges() .find((e) => e.targetHandle === targetHandle)) || - targetNode.template[targetHandle.split("|")[1]].list + targetNode.template[targetHandle?.split("|")[1]].list ) { return true; } @@ -195,7 +195,7 @@ export function validateNode( .getEdges() .some( (e) => - e.targetHandle.split("|")[1] === t && + e.targetHandle?.split("|")[1] === t && e.targetHandle.split("|")[2] === n.id ) ? [ diff --git a/src/frontend/src/utils/utils.ts b/src/frontend/src/utils/utils.ts index efdae1c8c..cc35b31dd 100644 --- a/src/frontend/src/utils/utils.ts +++ b/src/frontend/src/utils/utils.ts @@ -3,13 +3,14 @@ import { twMerge } from "tailwind-merge"; import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "../flow_constants"; import { IVarHighlightType, + groupDataType, groupedObjType, tweakType, } from "../types/components"; import { FlowType } from "../types/flow"; import { TabsState } from "../types/tabs"; import { buildTweaks } from "./reactflowUtils"; -import { APIClassType } from "../types/api"; +import { APIClassType, APIObjectType, APITemplateType } from "../types/api"; export function classNames(...classes: Array): string { return classes.filter(Boolean).join(" "); @@ -93,7 +94,7 @@ export function checkUpperWords(str: string): string { export const isWrappedWithClass = (event: any, className: string | undefined) => event.target.closest(`.${className}`); -export function groupByFamily(data: APIClassType, baseClasses: string, left: boolean, type: string): groupedObjType[] { +export function groupByFamily(data: groupDataType, baseClasses: string, left: boolean, type: string): groupedObjType[] { let parentOutput: string; let arrOfParent: string[] = []; let arrOfType: { family: string; type: string; component: string }[] = []; @@ -198,7 +199,7 @@ export function groupByFamily(data: APIClassType, baseClasses: string, left: boo groupedArray.forEach((object, index, self) => { const findObj = arrOfLength.find((x) => x.type === object.family); - if (object.component.length === findObj.length) { + if (object.component.length === findObj?.length) { self[index]["type"] = ""; } else { self[index]["type"] = object.component.join(", "); @@ -209,7 +210,6 @@ export function groupByFamily(data: APIClassType, baseClasses: string, left: boo } export function buildInputs(tabsState: TabsState, id: string): string { - console.log(tabsState) return tabsState && tabsState[id] && tabsState[id].formKeysData && @@ -352,7 +352,6 @@ export function getCurlCode( tweak?: any[], tabsState?: TabsState ): string { - console.log(tweak) const flowId = flow.id; const tweaks = buildTweaks(flow); const inputs = buildInputs(tabsState, flow.id); diff --git a/src/frontend/tsconfig.json b/src/frontend/tsconfig.json index 1879137c5..c411ff4e7 100644 --- a/src/frontend/tsconfig.json +++ b/src/frontend/tsconfig.json @@ -6,7 +6,7 @@ "skipLibCheck": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, - "strict": true, + "strict": false, "forceConsistentCasingInFileNames": true, "noFallthroughCasesInSwitch": true, "module": "esnext",