diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx index 0088081ae..7335da19d 100644 --- a/src/frontend/src/App.tsx +++ b/src/frontend/src/App.tsx @@ -1,19 +1,20 @@ -import _ from "lodash"; -import { useContext, useEffect, useState } from "react"; -import { useLocation } from "react-router-dom"; import "reactflow/dist/style.css"; +import { useState, useEffect, useContext } from "react"; import "./App.css"; +import { useLocation } from "react-router-dom"; +import _ from "lodash"; -import { ErrorBoundary } from "react-error-boundary"; import ErrorAlert from "./alerts/error"; import NoticeAlert from "./alerts/notice"; import SuccessAlert from "./alerts/success"; -import CrashErrorComponent from "./components/CrashErrorComponent"; -import Header from "./components/headerComponent"; import { alertContext } from "./contexts/alertContext"; import { locationContext } from "./contexts/locationContext"; +import { ErrorBoundary } from "react-error-boundary"; +import CrashErrorComponent from "./components/CrashErrorComponent"; import { TabsContext } from "./contexts/tabsContext"; +import { getVersion } from "./controllers/API"; import Router from "./routes"; +import Header from "./components/headerComponent"; export default function App() { let { setCurrent, setShowSideBar, setIsStackedOpen } = diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index d8208e5f2..8e22eafac 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -1,30 +1,31 @@ -import { Info } from "lucide-react"; -import React, { useContext, useEffect, useRef, useState } from "react"; import { Handle, Position, useUpdateNodeInternals } from "reactflow"; -import ShadTooltip from "../../../../components/ShadTooltipComponent"; -import CodeAreaComponent from "../../../../components/codeAreaComponent"; -import Dropdown from "../../../../components/dropdownComponent"; -import FloatComponent from "../../../../components/floatComponent"; -import InputComponent from "../../../../components/inputComponent"; -import InputFileComponent from "../../../../components/inputFileComponent"; -import InputListComponent from "../../../../components/inputListComponent"; -import IntComponent from "../../../../components/intComponent"; -import PromptAreaComponent from "../../../../components/promptComponent"; -import TextAreaComponent from "../../../../components/textAreaComponent"; -import ToggleShadComponent from "../../../../components/toggleShadComponent"; -import { PopUpContext } from "../../../../contexts/popUpContext"; -import { TabsContext } from "../../../../contexts/tabsContext"; -import { typesContext } from "../../../../contexts/typesContext"; -import { ParameterComponentType } from "../../../../types/components"; import { classNames, getRandomKeyByssmm, groupByFamily, isValidConnection, - nodeColors, nodeIconsLucide, - nodeNames, } from "../../../../utils"; +import { useContext, useEffect, useRef, useState } from "react"; +import InputComponent from "../../../../components/inputComponent"; +import InputListComponent from "../../../../components/inputListComponent"; +import TextAreaComponent from "../../../../components/textAreaComponent"; +import { typesContext } from "../../../../contexts/typesContext"; +import { ParameterComponentType } from "../../../../types/components"; +import FloatComponent from "../../../../components/floatComponent"; +import Dropdown from "../../../../components/dropdownComponent"; +import CodeAreaComponent from "../../../../components/codeAreaComponent"; +import InputFileComponent from "../../../../components/inputFileComponent"; +import { TabsContext } from "../../../../contexts/tabsContext"; +import IntComponent from "../../../../components/intComponent"; +import PromptAreaComponent from "../../../../components/promptComponent"; +import { nodeNames } from "../../../../utils"; +import React from "react"; +import { nodeColors } from "../../../../utils"; +import ShadTooltip from "../../../../components/ShadTooltipComponent"; +import { PopUpContext } from "../../../../contexts/popUpContext"; +import ToggleShadComponent from "../../../../components/toggleShadComponent"; +import { Info } from "lucide-react"; export default function ParameterComponent({ left, diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index 197132e81..313be210c 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -1,15 +1,3 @@ -import { Zap } from "lucide-react"; -import { useContext, useEffect, useRef, useState } from "react"; -import { NodeToolbar } from "reactflow"; -import ShadTooltip from "../../components/ShadTooltipComponent"; -import Tooltip from "../../components/TooltipComponent"; -import { useSSE } from "../../contexts/SSEContext"; -import { alertContext } from "../../contexts/alertContext"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { typesContext } from "../../contexts/typesContext"; -import NodeModal from "../../modals/NodeModal"; -import NodeToolbarComponent from "../../pages/FlowPage/components/nodeToolbarComponent"; -import { NodeDataType } from "../../types/flow"; import { classNames, nodeColors, @@ -17,6 +5,18 @@ import { toTitleCase, } from "../../utils"; import ParameterComponent from "./components/parameterComponent"; +import { typesContext } from "../../contexts/typesContext"; +import { useContext, useState, useEffect, useRef } from "react"; +import { NodeDataType } from "../../types/flow"; +import { alertContext } from "../../contexts/alertContext"; +import { PopUpContext } from "../../contexts/popUpContext"; +import NodeModal from "../../modals/NodeModal"; +import Tooltip from "../../components/TooltipComponent"; +import { NodeToolbar } from "reactflow"; +import NodeToolbarComponent from "../../pages/FlowPage/components/nodeToolbarComponent"; +import ShadTooltip from "../../components/ShadTooltipComponent"; +import { useSSE } from "../../contexts/SSEContext"; +import { Zap } from "lucide-react"; export default function GenericNode({ data, diff --git a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx index 18475b039..857bf0fb4 100644 --- a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx @@ -1,8 +1,8 @@ -import { Transition } from "@headlessui/react"; -import { CheckCircle2, Info, X, XCircle } from "lucide-react"; -import { useState } from "react"; import { Link } from "react-router-dom"; +import { Transition } from "@headlessui/react"; +import { useState } from "react"; import { SingleAlertComponentType } from "../../../../types/alerts"; +import { X, CheckCircle2, Info, XCircle } from "lucide-react"; export default function SingleAlert({ dropItem, diff --git a/src/frontend/src/alerts/alertDropDown/index.tsx b/src/frontend/src/alerts/alertDropDown/index.tsx index cd1ed9137..ef703f624 100644 --- a/src/frontend/src/alerts/alertDropDown/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/index.tsx @@ -1,10 +1,10 @@ -import { Trash2, X } from "lucide-react"; -import { useContext, useRef } from "react"; +import { useContext, useEffect, useRef } from "react"; import { alertContext } from "../../contexts/alertContext"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { AlertDropdownType } from "../../types/alerts"; -import { useOnClickOutside } from "../hooks/useOnClickOutside"; import SingleAlert from "./components/singleAlertComponent"; +import { AlertDropdownType } from "../../types/alerts"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { useOnClickOutside } from "../hooks/useOnClickOutside"; +import { X, Trash2 } from "lucide-react"; export default function AlertDropdown({}: AlertDropdownType) { const { closePopUp } = useContext(PopUpContext); diff --git a/src/frontend/src/alerts/error/index.tsx b/src/frontend/src/alerts/error/index.tsx index ed395018e..d71980b7e 100644 --- a/src/frontend/src/alerts/error/index.tsx +++ b/src/frontend/src/alerts/error/index.tsx @@ -1,7 +1,7 @@ import { Transition } from "@headlessui/react"; -import { XCircle } from "lucide-react"; import { useEffect, useState } from "react"; import { ErrorAlertType } from "../../types/alerts"; +import { XCircle } from "lucide-react"; export default function ErrorAlert({ title, diff --git a/src/frontend/src/alerts/notice/index.tsx b/src/frontend/src/alerts/notice/index.tsx index c77a4bcd6..eeb00cd42 100644 --- a/src/frontend/src/alerts/notice/index.tsx +++ b/src/frontend/src/alerts/notice/index.tsx @@ -1,8 +1,8 @@ import { Transition } from "@headlessui/react"; -import { Info } from "lucide-react"; import { useEffect, useState } from "react"; import { Link } from "react-router-dom"; import { NoticeAlertType } from "../../types/alerts"; +import { Info } from "lucide-react"; export default function NoticeAlert({ title, diff --git a/src/frontend/src/alerts/success/index.tsx b/src/frontend/src/alerts/success/index.tsx index 60dba1e93..95eaa1ba4 100644 --- a/src/frontend/src/alerts/success/index.tsx +++ b/src/frontend/src/alerts/success/index.tsx @@ -1,7 +1,7 @@ import { Transition } from "@headlessui/react"; -import { CheckCircle2 } from "lucide-react"; import { useEffect, useState } from "react"; import { SuccessAlertType } from "../../types/alerts"; +import { CheckCircle2 } from "lucide-react"; export default function SuccessAlert({ title, diff --git a/src/frontend/src/components/AccordionComponent/index.tsx b/src/frontend/src/components/AccordionComponent/index.tsx index ceeb938a8..f03a2ad5f 100644 --- a/src/frontend/src/components/AccordionComponent/index.tsx +++ b/src/frontend/src/components/AccordionComponent/index.tsx @@ -1,11 +1,16 @@ -import { useState } from "react"; +import { ReactElement, useContext, useEffect, useRef, useState } from "react"; +import { + AccordionComponentType, + ProgressBarType, +} from "../../types/components"; +import { Progress } from "../../components/ui/progress"; +import { setInterval } from "timers/promises"; import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, } from "../../components/ui/accordion"; -import { AccordionComponentType } from "../../types/components"; export default function AccordionComponent({ trigger, diff --git a/src/frontend/src/components/EditFlowSettingsComponent/index.tsx b/src/frontend/src/components/EditFlowSettingsComponent/index.tsx index a0beb11f3..b51722ad8 100644 --- a/src/frontend/src/components/EditFlowSettingsComponent/index.tsx +++ b/src/frontend/src/components/EditFlowSettingsComponent/index.tsx @@ -1,7 +1,7 @@ -import React, { ChangeEvent, useState } from "react"; -import { Input } from "../../components/ui/input"; -import { Label } from "../../components/ui/label"; +import React, { useState, ChangeEvent } from "react"; import { Textarea } from "../../components/ui/textarea"; +import { Label } from "../../components/ui/label"; +import { Input } from "../../components/ui/input"; type InputProps = { name: string | null; diff --git a/src/frontend/src/components/ExtraSidebarComponent/index.tsx b/src/frontend/src/components/ExtraSidebarComponent/index.tsx index e307e5234..2386e29a8 100644 --- a/src/frontend/src/components/ExtraSidebarComponent/index.tsx +++ b/src/frontend/src/components/ExtraSidebarComponent/index.tsx @@ -1,8 +1,8 @@ import { Disclosure } from "@headlessui/react"; import { useContext } from "react"; import { Link } from "react-router-dom"; -import { locationContext } from "../../contexts/locationContext"; import { classNames } from "../../utils"; +import { locationContext } from "../../contexts/locationContext"; export default function ExtraSidebar() { const { diff --git a/src/frontend/src/components/LightTooltipComponent/index.tsx b/src/frontend/src/components/LightTooltipComponent/index.tsx index 08ea76266..4cdc912d0 100644 --- a/src/frontend/src/components/LightTooltipComponent/index.tsx +++ b/src/frontend/src/components/LightTooltipComponent/index.tsx @@ -1,5 +1,5 @@ -import Tooltip, { TooltipProps, tooltipClasses } from "@mui/material/Tooltip"; import { styled } from "@mui/material/styles"; +import Tooltip, { TooltipProps, tooltipClasses } from "@mui/material/Tooltip"; export const LightTooltip = styled(({ className, ...props }: TooltipProps) => ( diff --git a/src/frontend/src/components/LoadingSpinner/index.tsx b/src/frontend/src/components/LoadingSpinner/index.tsx index ea02a88d6..642df9e22 100644 --- a/src/frontend/src/components/LoadingSpinner/index.tsx +++ b/src/frontend/src/components/LoadingSpinner/index.tsx @@ -1,3 +1,6 @@ +import { useContext, useEffect, useRef, useState } from "react"; +import { RadialProgressType } from "../../types/components"; + export default function LoadingSpinner({}) { return <>; } diff --git a/src/frontend/src/components/RadialProgress/index.tsx b/src/frontend/src/components/RadialProgress/index.tsx index f277a9c80..b468b12e8 100644 --- a/src/frontend/src/components/RadialProgress/index.tsx +++ b/src/frontend/src/components/RadialProgress/index.tsx @@ -1,3 +1,4 @@ +import { useContext, useEffect, useRef, useState } from "react"; import { RadialProgressType } from "../../types/components"; export default function RadialProgressComponent({ diff --git a/src/frontend/src/components/ShadTooltipComponent/index.tsx b/src/frontend/src/components/ShadTooltipComponent/index.tsx index e8b4a6398..d643a4d08 100644 --- a/src/frontend/src/components/ShadTooltipComponent/index.tsx +++ b/src/frontend/src/components/ShadTooltipComponent/index.tsx @@ -1,4 +1,4 @@ -import { ShadToolTipType } from "../../types/components"; +import { RadialProgressType, ShadToolTipType } from "../../types/components"; import { Tooltip, TooltipContent, diff --git a/src/frontend/src/components/TooltipComponent/index.tsx b/src/frontend/src/components/TooltipComponent/index.tsx index 91fa006ec..0e571b1bc 100644 --- a/src/frontend/src/components/TooltipComponent/index.tsx +++ b/src/frontend/src/components/TooltipComponent/index.tsx @@ -1,5 +1,6 @@ -import { TooltipComponentType } from "../../types/components"; +import { ReactElement } from "react"; import { LightTooltip } from "../LightTooltipComponent"; +import { TooltipComponentType } from "../../types/components"; export default function Tooltip({ children, diff --git a/src/frontend/src/components/cardComponent/index.tsx b/src/frontend/src/components/cardComponent/index.tsx index 285aa91b7..276f0a7cd 100644 --- a/src/frontend/src/components/cardComponent/index.tsx +++ b/src/frontend/src/components/cardComponent/index.tsx @@ -1,15 +1,26 @@ -import { Trash2 } from "lucide-react"; +import { Trash2, ExternalLink } from "lucide-react"; import { useContext } from "react"; +import { Link } from "react-router-dom"; import { TabsContext } from "../../contexts/tabsContext"; import { FlowType } from "../../types/flow"; import { gradients } from "../../utils"; import { - Card, + CardTitle, CardDescription, CardFooter, + Card, CardHeader, - CardTitle, } from "../ui/card"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "../ui/dialog"; +import { Button } from "@mui/material"; export const CardComponent = ({ flow, diff --git a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx index 09ab90ff7..4d47e2e1c 100644 --- a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx +++ b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx @@ -1,16 +1,16 @@ +import { useContext, useState } from "react"; import { Transition } from "@headlessui/react"; import { Zap } from "lucide-react"; -import { useContext, useState } from "react"; +import { validateNodes } from "../../../utils"; +import { FlowType } from "../../../types/flow"; import Loading from "../../../components/ui/loading"; import { useSSE } from "../../../contexts/SSEContext"; -import { alertContext } from "../../../contexts/alertContext"; import { typesContext } from "../../../contexts/typesContext"; +import { alertContext } from "../../../contexts/alertContext"; import { postBuildInit } from "../../../controllers/API"; -import { FlowType } from "../../../types/flow"; -import { validateNodes } from "../../../utils"; -import { TabsContext } from "../../../contexts/tabsContext"; import RadialProgressComponent from "../../RadialProgress"; +import { TabsContext } from "../../../contexts/tabsContext"; export default function BuildTrigger({ open, diff --git a/src/frontend/src/components/chatComponent/chatTrigger/index.tsx b/src/frontend/src/components/chatComponent/chatTrigger/index.tsx index c0cd53550..2666e4e92 100644 --- a/src/frontend/src/components/chatComponent/chatTrigger/index.tsx +++ b/src/frontend/src/components/chatComponent/chatTrigger/index.tsx @@ -1,6 +1,7 @@ import { Transition } from "@headlessui/react"; import { MessagesSquare } from "lucide-react"; +import { alertContext } from "../../../contexts/alertContext"; import { useContext } from "react"; import { CHAT_CANNOT_OPEN_DESCRIPTION, @@ -8,7 +9,6 @@ import { FLOW_NOT_BUILT_DESCRIPTION, FLOW_NOT_BUILT_TITLE, } from "../../../constants"; -import { alertContext } from "../../../contexts/alertContext"; export default function ChatTrigger({ open, setOpen, isBuilt, canOpen }) { const { setErrorData } = useContext(alertContext); diff --git a/src/frontend/src/components/chatComponent/index.tsx b/src/frontend/src/components/chatComponent/index.tsx index 829dd5b13..9130be694 100644 --- a/src/frontend/src/components/chatComponent/index.tsx +++ b/src/frontend/src/components/chatComponent/index.tsx @@ -1,14 +1,14 @@ import { useContext, useEffect, useRef, useState } from "react"; import { useNodes } from "reactflow"; import { ChatType } from "../../types/chat"; -import BuildTrigger from "./buildTrigger"; import ChatTrigger from "./chatTrigger"; +import BuildTrigger from "./buildTrigger"; -import * as _ from "lodash"; -import { TabsContext } from "../../contexts/tabsContext"; import { getBuildStatus } from "../../controllers/API"; -import FormModal from "../../modals/formModal"; import { NodeType } from "../../types/flow"; +import FormModal from "../../modals/formModal"; +import { TabsContext } from "../../contexts/tabsContext"; +import * as _ from "lodash"; export default function Chat({ flow }: ChatType) { const [open, setOpen] = useState(false); diff --git a/src/frontend/src/components/codeAreaComponent/index.tsx b/src/frontend/src/components/codeAreaComponent/index.tsx index 07ceb0593..01a1ee9fe 100644 --- a/src/frontend/src/components/codeAreaComponent/index.tsx +++ b/src/frontend/src/components/codeAreaComponent/index.tsx @@ -1,6 +1,7 @@ import { useContext, useEffect, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import CodeAreaModal from "../../modals/codeAreaModal"; +import TextAreaModal from "../../modals/textAreaModal"; import { TextAreaComponentType } from "../../types/components"; import { ExternalLink } from "lucide-react"; diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx index 0461fa4bc..84c036ec4 100644 --- a/src/frontend/src/components/dropdownComponent/index.tsx +++ b/src/frontend/src/components/dropdownComponent/index.tsx @@ -1,9 +1,9 @@ import { Listbox, Transition } from "@headlessui/react"; -import { Check, ChevronsUpDown } from "lucide-react"; import { Fragment, useContext, useEffect, useState } from "react"; -import { PopUpContext } from "../../contexts/popUpContext"; import { DropDownComponentType } from "../../types/components"; import { classNames } from "../../utils"; +import { ChevronsUpDown, Check } from "lucide-react"; +import { PopUpContext } from "../../contexts/popUpContext"; export default function Dropdown({ value, diff --git a/src/frontend/src/components/floatComponent/index.tsx b/src/frontend/src/components/floatComponent/index.tsx index 548d608a3..1c72c7c45 100644 --- a/src/frontend/src/components/floatComponent/index.tsx +++ b/src/frontend/src/components/floatComponent/index.tsx @@ -1,7 +1,7 @@ import { useContext, useEffect, useState } from "react"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; import { FloatComponentType } from "../../types/components"; +import { TabsContext } from "../../contexts/tabsContext"; +import { PopUpContext } from "../../contexts/popUpContext"; export default function FloatComponent({ value, diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx index a1536f13d..41cb0bef9 100644 --- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx +++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx @@ -1,25 +1,27 @@ +import { useContext } from "react"; +import { TabsContext } from "../../../../contexts/tabsContext"; +import { PopUpContext } from "../../../../contexts/popUpContext"; import { + Plus, ChevronDown, ChevronLeft, - Plus, + Undo, Redo, Settings2, - Undo, } from "lucide-react"; -import { useContext } from "react"; -import { PopUpContext } from "../../../../contexts/popUpContext"; -import { TabsContext } from "../../../../contexts/tabsContext"; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, + DropdownMenuTrigger, + DropdownMenuRadioGroup, + DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, - DropdownMenuTrigger, } from "../../../ui/dropdown-menu"; -import { Link, useNavigate } from "react-router-dom"; import { alertContext } from "../../../../contexts/alertContext"; +import { Link, useNavigate } from "react-router-dom"; import { undoRedoContext } from "../../../../contexts/undoRedoContext"; import FlowSettingsModal from "../../../../modals/flowSettingsModal"; import { Button } from "../../../ui/button"; diff --git a/src/frontend/src/components/headerComponent/index.tsx b/src/frontend/src/components/headerComponent/index.tsx index 895f01d79..e03f53518 100644 --- a/src/frontend/src/components/headerComponent/index.tsx +++ b/src/frontend/src/components/headerComponent/index.tsx @@ -1,18 +1,19 @@ -import { Bell, Home, MoonIcon, SunIcon, Users2 } from "lucide-react"; +import { Home, MoonIcon, SunIcon, Users2 } from "lucide-react"; import { useContext, useEffect, useState } from "react"; import { FaDiscord, FaGithub, FaTwitter } from "react-icons/fa"; -import { Link, useLocation, useParams } from "react-router-dom"; +import { Button } from "../ui/button"; +import { TabsContext } from "../../contexts/tabsContext"; import AlertDropdown from "../../alerts/alertDropDown"; -import { USER_PROJECTS_HEADER } from "../../constants"; import { alertContext } from "../../contexts/alertContext"; import { darkContext } from "../../contexts/darkContext"; import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; import { typesContext } from "../../contexts/typesContext"; -import { getRepoStars } from "../../controllers/API"; -import { Button } from "../ui/button"; -import { Separator } from "../ui/separator"; import MenuBar from "./components/menuBar"; +import { Link, useLocation, useParams } from "react-router-dom"; +import { USER_PROJECTS_HEADER } from "../../constants"; +import { getRepoStars } from "../../controllers/API"; +import { Separator } from "../ui/separator"; +import { Bell } from "lucide-react"; export default function Header() { const { flows, addFlow, tabId } = useContext(TabsContext); diff --git a/src/frontend/src/components/inputComponent/index.tsx b/src/frontend/src/components/inputComponent/index.tsx index 4d6045caf..b5894fe6e 100644 --- a/src/frontend/src/components/inputComponent/index.tsx +++ b/src/frontend/src/components/inputComponent/index.tsx @@ -1,8 +1,8 @@ import { useContext, useEffect, useState } from "react"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; import { InputComponentType } from "../../types/components"; import { classNames } from "../../utils"; +import { TabsContext } from "../../contexts/tabsContext"; +import { PopUpContext } from "../../contexts/popUpContext"; export default function InputComponent({ value, diff --git a/src/frontend/src/components/inputFileComponent/index.tsx b/src/frontend/src/components/inputFileComponent/index.tsx index 59b25a0a7..505515bf5 100644 --- a/src/frontend/src/components/inputFileComponent/index.tsx +++ b/src/frontend/src/components/inputFileComponent/index.tsx @@ -1,9 +1,9 @@ -import { FileSearch2 } from "lucide-react"; import { useContext, useEffect, useState } from "react"; import { alertContext } from "../../contexts/alertContext"; -import { TabsContext } from "../../contexts/tabsContext"; -import { uploadFile } from "../../controllers/API"; import { FileComponentType } from "../../types/components"; +import { TabsContext } from "../../contexts/tabsContext"; +import { FileSearch2 } from "lucide-react"; +import { uploadFile } from "../../controllers/API"; export default function InputFileComponent({ value, diff --git a/src/frontend/src/components/inputListComponent/index.tsx b/src/frontend/src/components/inputListComponent/index.tsx index d165d58a2..7dd6d79c6 100644 --- a/src/frontend/src/components/inputListComponent/index.tsx +++ b/src/frontend/src/components/inputListComponent/index.tsx @@ -1,8 +1,9 @@ import { useContext, useEffect, useState } from "react"; import { InputListComponentType } from "../../types/components"; +import { TabsContext } from "../../contexts/tabsContext"; import _ from "lodash"; -import { Plus, X } from "lucide-react"; +import { X, Plus } from "lucide-react"; import { PopUpContext } from "../../contexts/popUpContext"; export default function InputListComponent({ diff --git a/src/frontend/src/components/intComponent/index.tsx b/src/frontend/src/components/intComponent/index.tsx index 2428d03ee..473febd91 100644 --- a/src/frontend/src/components/intComponent/index.tsx +++ b/src/frontend/src/components/intComponent/index.tsx @@ -1,7 +1,8 @@ import { useContext, useEffect, useState } from "react"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; import { FloatComponentType } from "../../types/components"; +import { TabsContext } from "../../contexts/tabsContext"; +import { classNames } from "../../utils"; +import { PopUpContext } from "../../contexts/popUpContext"; export default function IntComponent({ value, diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx index 7385518c8..7e90f323c 100644 --- a/src/frontend/src/components/promptComponent/index.tsx +++ b/src/frontend/src/components/promptComponent/index.tsx @@ -1,13 +1,13 @@ import { useContext, useEffect, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; -import GenericModal from "../../modals/genericModal"; import { TextAreaComponentType } from "../../types/components"; +import GenericModal from "../../modals/genericModal"; import { TypeModal } from "../../utils"; -import * as _ from "lodash"; import { ExternalLink } from "lucide-react"; -import { typesContext } from "../../contexts/typesContext"; import { postValidatePrompt } from "../../controllers/API"; +import { typesContext } from "../../contexts/typesContext"; +import * as _ from "lodash"; export default function PromptAreaComponent({ field_name, diff --git a/src/frontend/src/components/textAreaComponent/index.tsx b/src/frontend/src/components/textAreaComponent/index.tsx index a50969cfb..6b41cbe40 100644 --- a/src/frontend/src/components/textAreaComponent/index.tsx +++ b/src/frontend/src/components/textAreaComponent/index.tsx @@ -1,8 +1,8 @@ import { useContext, useEffect, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; -import GenericModal from "../../modals/genericModal"; import { TextAreaComponentType } from "../../types/components"; -import { TypeModal } from "../../utils"; +import GenericModal from "../../modals/genericModal"; +import { TypeModal, classNames } from "../../utils"; import { ExternalLink } from "lucide-react"; diff --git a/src/frontend/src/components/toggleComponent/index.tsx b/src/frontend/src/components/toggleComponent/index.tsx index 81a2b2d8b..c7b72a025 100644 --- a/src/frontend/src/components/toggleComponent/index.tsx +++ b/src/frontend/src/components/toggleComponent/index.tsx @@ -1,7 +1,7 @@ import { Switch } from "@headlessui/react"; +import { classNames } from "../../utils"; import { useEffect } from "react"; import { ToggleComponentType } from "../../types/components"; -import { classNames } from "../../utils"; export default function ToggleComponent({ enabled, diff --git a/src/frontend/src/components/toggleShadComponent/index.tsx b/src/frontend/src/components/toggleShadComponent/index.tsx index c06d42430..9b73ee07d 100644 --- a/src/frontend/src/components/toggleShadComponent/index.tsx +++ b/src/frontend/src/components/toggleShadComponent/index.tsx @@ -1,3 +1,4 @@ +import { useEffect } from "react"; import { ToggleComponentType } from "../../types/components"; import { Switch } from "../ui/switch"; diff --git a/src/frontend/src/components/ui/accordion.tsx b/src/frontend/src/components/ui/accordion.tsx index 4b5a12384..5e3e76f33 100644 --- a/src/frontend/src/components/ui/accordion.tsx +++ b/src/frontend/src/components/ui/accordion.tsx @@ -1,8 +1,8 @@ "use client"; +import * as React from "react"; import * as AccordionPrimitive from "@radix-ui/react-accordion"; import { ChevronDownIcon } from "@radix-ui/react-icons"; -import * as React from "react"; import { cn } from "../../utils"; const Accordion = AccordionPrimitive.Root; diff --git a/src/frontend/src/components/ui/badge.tsx b/src/frontend/src/components/ui/badge.tsx index 5464f382e..36c44ac4d 100644 --- a/src/frontend/src/components/ui/badge.tsx +++ b/src/frontend/src/components/ui/badge.tsx @@ -1,5 +1,5 @@ -import { cva, type VariantProps } from "class-variance-authority"; import * as React from "react"; +import { cva, type VariantProps } from "class-variance-authority"; import { cn } from "../../utils"; const badgeVariants = cva( diff --git a/src/frontend/src/components/ui/button.tsx b/src/frontend/src/components/ui/button.tsx index 170494927..648ce43c9 100644 --- a/src/frontend/src/components/ui/button.tsx +++ b/src/frontend/src/components/ui/button.tsx @@ -1,6 +1,6 @@ +import * as React from "react"; import { Slot } from "@radix-ui/react-slot"; import { cva, type VariantProps } from "class-variance-authority"; -import * as React from "react"; import { cn } from "../../utils"; const buttonVariants = cva( diff --git a/src/frontend/src/components/ui/checkbox.tsx b/src/frontend/src/components/ui/checkbox.tsx index 18332b073..4e4905bb9 100644 --- a/src/frontend/src/components/ui/checkbox.tsx +++ b/src/frontend/src/components/ui/checkbox.tsx @@ -1,8 +1,8 @@ "use client"; +import * as React from "react"; import * as CheckboxPrimitive from "@radix-ui/react-checkbox"; import { Check } from "lucide-react"; -import * as React from "react"; import { cn } from "../../utils"; const Checkbox = React.forwardRef< diff --git a/src/frontend/src/components/ui/dialog.tsx b/src/frontend/src/components/ui/dialog.tsx index 2ad709f48..a02379087 100644 --- a/src/frontend/src/components/ui/dialog.tsx +++ b/src/frontend/src/components/ui/dialog.tsx @@ -1,6 +1,6 @@ +import * as React from "react"; import * as DialogPrimitive from "@radix-ui/react-dialog"; import { X } from "lucide-react"; -import * as React from "react"; import { cn } from "../../utils"; const Dialog = DialogPrimitive.Root; diff --git a/src/frontend/src/components/ui/dropdown-menu.tsx b/src/frontend/src/components/ui/dropdown-menu.tsx index 0e5468e6e..ee62abc4a 100644 --- a/src/frontend/src/components/ui/dropdown-menu.tsx +++ b/src/frontend/src/components/ui/dropdown-menu.tsx @@ -1,8 +1,8 @@ "use client"; +import * as React from "react"; import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"; import { Check, ChevronRight, Circle } from "lucide-react"; -import * as React from "react"; import { cn } from "../../utils"; const DropdownMenu = DropdownMenuPrimitive.Root; diff --git a/src/frontend/src/components/ui/label.tsx b/src/frontend/src/components/ui/label.tsx index 57fbc9d8a..ab5129253 100644 --- a/src/frontend/src/components/ui/label.tsx +++ b/src/frontend/src/components/ui/label.tsx @@ -1,8 +1,8 @@ "use client"; +import * as React from "react"; import * as LabelPrimitive from "@radix-ui/react-label"; import { cva, type VariantProps } from "class-variance-authority"; -import * as React from "react"; import { cn } from "../../utils"; const labelVariants = cva( diff --git a/src/frontend/src/components/ui/menubar.tsx b/src/frontend/src/components/ui/menubar.tsx index 0a3362ca6..2eb3a61f4 100644 --- a/src/frontend/src/components/ui/menubar.tsx +++ b/src/frontend/src/components/ui/menubar.tsx @@ -1,8 +1,8 @@ "use client"; +import * as React from "react"; import * as MenubarPrimitive from "@radix-ui/react-menubar"; import { Check, ChevronRight, Circle } from "lucide-react"; -import * as React from "react"; import { cn } from "../../utils"; diff --git a/src/frontend/src/components/ui/progress.tsx b/src/frontend/src/components/ui/progress.tsx index a08efeb52..69d1f86fb 100644 --- a/src/frontend/src/components/ui/progress.tsx +++ b/src/frontend/src/components/ui/progress.tsx @@ -1,7 +1,7 @@ "use client"; -import * as ProgressPrimitive from "@radix-ui/react-progress"; import * as React from "react"; +import * as ProgressPrimitive from "@radix-ui/react-progress"; import { cn } from "../../utils"; const Progress = React.forwardRef< diff --git a/src/frontend/src/components/ui/rename-label.tsx b/src/frontend/src/components/ui/rename-label.tsx index e5fef11bf..e703020f5 100644 --- a/src/frontend/src/components/ui/rename-label.tsx +++ b/src/frontend/src/components/ui/rename-label.tsx @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState } from "react"; +import { useState, useEffect, useRef } from "react"; import { cn } from "../../utils"; export default function RenameLabel(props) { diff --git a/src/frontend/src/components/ui/separator.tsx b/src/frontend/src/components/ui/separator.tsx index a770af987..84a16676d 100644 --- a/src/frontend/src/components/ui/separator.tsx +++ b/src/frontend/src/components/ui/separator.tsx @@ -1,7 +1,7 @@ "use client"; -import * as SeparatorPrimitive from "@radix-ui/react-separator"; import * as React from "react"; +import * as SeparatorPrimitive from "@radix-ui/react-separator"; import { cn } from "../../utils"; const Separator = React.forwardRef< diff --git a/src/frontend/src/components/ui/switch.tsx b/src/frontend/src/components/ui/switch.tsx index 8ec7c3c80..8f473a0eb 100644 --- a/src/frontend/src/components/ui/switch.tsx +++ b/src/frontend/src/components/ui/switch.tsx @@ -1,7 +1,7 @@ "use client"; -import * as SwitchPrimitives from "@radix-ui/react-switch"; import * as React from "react"; +import * as SwitchPrimitives from "@radix-ui/react-switch"; import { cn } from "../../utils"; const Switch = React.forwardRef< diff --git a/src/frontend/src/components/ui/tabs.tsx b/src/frontend/src/components/ui/tabs.tsx index 8c382e35e..39864abed 100644 --- a/src/frontend/src/components/ui/tabs.tsx +++ b/src/frontend/src/components/ui/tabs.tsx @@ -1,7 +1,7 @@ "use client"; -import * as TabsPrimitive from "@radix-ui/react-tabs"; import * as React from "react"; +import * as TabsPrimitive from "@radix-ui/react-tabs"; import { cn } from "../../utils"; const Tabs = TabsPrimitive.Root; diff --git a/src/frontend/src/components/ui/tooltip.tsx b/src/frontend/src/components/ui/tooltip.tsx index dc847052e..b2ec0f701 100644 --- a/src/frontend/src/components/ui/tooltip.tsx +++ b/src/frontend/src/components/ui/tooltip.tsx @@ -1,7 +1,7 @@ "use client"; -import * as TooltipPrimitive from "@radix-ui/react-tooltip"; import * as React from "react"; +import * as TooltipPrimitive from "@radix-ui/react-tooltip"; import { cn } from "../../utils"; const TooltipProvider = TooltipPrimitive.Provider; diff --git a/src/frontend/src/constants.tsx b/src/frontend/src/constants.tsx index bb54427f9..c823abc1d 100644 --- a/src/frontend/src/constants.tsx +++ b/src/frontend/src/constants.tsx @@ -1,9 +1,10 @@ // src/constants.tsx -import { MessageSquare } from "lucide-react"; +import { MessageSquareDashed } from "lucide-react"; import { FlowType } from "./types/flow"; import { TabsState } from "./types/tabs"; import { buildInputs, buildTweaks } from "./utils"; +import { MessageSquare } from "lucide-react"; /** * The base text for subtitle of Export Dialog (Toolbar) diff --git a/src/frontend/src/contexts/SSEContext.tsx b/src/frontend/src/contexts/SSEContext.tsx index 9db32310b..83b1d4c89 100644 --- a/src/frontend/src/contexts/SSEContext.tsx +++ b/src/frontend/src/contexts/SSEContext.tsx @@ -1,4 +1,10 @@ -import { createContext, useCallback, useContext, useState } from "react"; +import { + createContext, + useContext, + useState, + useEffect, + useCallback, +} from "react"; const initialValue = { updateSSEData: ({}) => {}, diff --git a/src/frontend/src/contexts/index.tsx b/src/frontend/src/contexts/index.tsx index 13771673c..750df65d2 100644 --- a/src/frontend/src/contexts/index.tsx +++ b/src/frontend/src/contexts/index.tsx @@ -1,13 +1,13 @@ import { ReactNode } from "react"; -import { ReactFlowProvider } from "reactflow"; -import { SSEProvider } from "./SSEContext"; import { AlertProvider } from "./alertContext"; import { DarkProvider } from "./darkContext"; import { LocationProvider } from "./locationContext"; import PopUpProvider from "./popUpContext"; import { TabsProvider } from "./tabsContext"; import { TypesProvider } from "./typesContext"; +import { ReactFlowProvider } from "reactflow"; import { UndoRedoProvider } from "./undoRedoContext"; +import { SSEProvider } from "./SSEContext"; export default function ContextWrapper({ children }: { children: ReactNode }) { //element to wrap all context diff --git a/src/frontend/src/contexts/popUpContext.tsx b/src/frontend/src/contexts/popUpContext.tsx index 8da50278c..d46f51f00 100644 --- a/src/frontend/src/contexts/popUpContext.tsx +++ b/src/frontend/src/contexts/popUpContext.tsx @@ -1,4 +1,5 @@ -import React, { createContext, useState } from "react"; +import { createContext } from "react"; +import React, { useState } from "react"; // context to set JSX element on the DOM export const PopUpContext = createContext({ diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx index 001152c9c..8105819a0 100644 --- a/src/frontend/src/contexts/tabsContext.tsx +++ b/src/frontend/src/contexts/tabsContext.tsx @@ -1,33 +1,33 @@ -import _ from "lodash"; import { - ReactNode, createContext, - useContext, useEffect, - useRef, useState, + useRef, + ReactNode, + useContext, } from "react"; -import { addEdge } from "reactflow"; -import ShortUniqueId from "short-unique-id"; -import { - deleteFlowFromDatabase, - downloadFlowsFromDatabase, - readFlowsFromDatabase, - saveFlowToDatabase, - updateFlowInDatabase, - uploadFlowsToDatabase, -} from "../controllers/API"; -import { APIClassType, APITemplateType } from "../types/api"; import { FlowType, NodeType } from "../types/flow"; import { TabsContextType, TabsState } from "../types/tabs"; import { - getRandomDescription, - getRandomName, updateIds, updateTemplate, + getRandomDescription, + getRandomName, } from "../utils"; import { alertContext } from "./alertContext"; import { typesContext } from "./typesContext"; +import { APIClassType, APITemplateType } from "../types/api"; +import ShortUniqueId from "short-unique-id"; +import { addEdge } from "reactflow"; +import { + readFlowsFromDatabase, + deleteFlowFromDatabase, + saveFlowToDatabase, + downloadFlowsFromDatabase, + uploadFlowsToDatabase, + updateFlowInDatabase, +} from "../controllers/API"; +import _ from "lodash"; const uid = new ShortUniqueId({ length: 5 }); diff --git a/src/frontend/src/contexts/typesContext.tsx b/src/frontend/src/contexts/typesContext.tsx index ff4cc1c29..3179e582e 100644 --- a/src/frontend/src/contexts/typesContext.tsx +++ b/src/frontend/src/contexts/typesContext.tsx @@ -1,8 +1,8 @@ import { createContext, ReactNode, useEffect, useState } from "react"; import { Node } from "reactflow"; +import { typesContextType } from "../types/typesContext"; import { getAll } from "../controllers/API"; import { APIKindType } from "../types/api"; -import { typesContextType } from "../types/typesContext"; //context to share types adn functions from nodes to flow diff --git a/src/frontend/src/contexts/undoRedoContext.tsx b/src/frontend/src/contexts/undoRedoContext.tsx index 3df201082..b0f8ca6b9 100644 --- a/src/frontend/src/contexts/undoRedoContext.tsx +++ b/src/frontend/src/contexts/undoRedoContext.tsx @@ -1,4 +1,3 @@ -import { cloneDeep } from "lodash"; import { createContext, useCallback, @@ -7,6 +6,7 @@ import { useState, } from "react"; import { Edge, Node, useReactFlow } from "reactflow"; +import { cloneDeep } from "lodash"; import { TabsContext } from "./tabsContext"; type undoRedoContextType = { diff --git a/src/frontend/src/controllers/API/index.ts b/src/frontend/src/controllers/API/index.ts index 2d6f951f0..72204ee68 100644 --- a/src/frontend/src/controllers/API/index.ts +++ b/src/frontend/src/controllers/API/index.ts @@ -1,15 +1,15 @@ -import axios, { AxiosResponse } from "axios"; -import { ReactFlowJsonObject } from "reactflow"; -import { APIObjectType, sendAllProps } from "../../types/api/index"; -import { FlowStyleType, FlowType } from "../../types/flow"; import { - APIClassType, BuildStatusTypeAPI, - InitTypeAPI, - PromptTypeAPI, - UploadFileTypeAPI, errorsTypeAPI, + InitTypeAPI, + UploadFileTypeAPI, + APIClassType, + PromptTypeAPI, } from "./../../types/api/index"; +import { APIObjectType, sendAllProps } from "../../types/api/index"; +import axios, { AxiosResponse } from "axios"; +import { FlowStyleType, FlowType } from "../../types/flow"; +import { ReactFlowJsonObject } from "reactflow"; /** * Fetches all objects from the API endpoint. diff --git a/src/frontend/src/index.tsx b/src/frontend/src/index.tsx index 794fcbf32..088db15a8 100644 --- a/src/frontend/src/index.tsx +++ b/src/frontend/src/index.tsx @@ -1,8 +1,9 @@ +import React from "react"; import ReactDOM from "react-dom/client"; -import { BrowserRouter } from "react-router-dom"; import App from "./App"; -import ContextWrapper from "./contexts"; import reportWebVitals from "./reportWebVitals"; +import { BrowserRouter } from "react-router-dom"; +import ContextWrapper from "./contexts"; import "./index.css"; diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index 3dc9c3f0d..99fd03941 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -1,15 +1,42 @@ -import "ace-builds/src-noconflict/ext-language_tools"; +import { useContext, useEffect, useRef, useState } from "react"; +import { PopUpContext } from "../../contexts/popUpContext"; import "ace-builds/src-noconflict/mode-python"; import "ace-builds/src-noconflict/theme-github"; import "ace-builds/src-noconflict/theme-twilight"; -import { useContext, useEffect, useRef, useState } from "react"; -import { PopUpContext } from "../../contexts/popUpContext"; +import "ace-builds/src-noconflict/ext-language_tools"; // import "ace-builds/webpack-resolver"; -import { Check, Clipboard, Code2 } from "lucide-react"; +import { darkContext } from "../../contexts/darkContext"; import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; import { oneDark } from "react-syntax-highlighter/dist/cjs/styles/prism"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "../../components/ui/dialog"; +import { FlowType } from "../../types/flow/index"; +import { getCurlCode, getPythonApiCode, getPythonCode } from "../../constants"; +import { EXPORT_CODE_DIALOG } from "../../constants"; +import { + Tabs, + TabsContent, + TabsList, + TabsTrigger, +} from "../../components/ui/tabs"; +import { Check, Clipboard, Code2 } from "lucide-react"; +import { + Table, + TableBody, + TableCaption, + TableCell, + TableHead, + TableHeader, + TableRow, +} from "../../components/ui/table"; +import { buildTweaks, classNames, limitScrollFieldsModal } from "../../utils"; import AccordionComponent from "../../components/AccordionComponent"; -import ShadTooltip from "../../components/ShadTooltipComponent"; import CodeAreaComponent from "../../components/codeAreaComponent"; import Dropdown from "../../components/dropdownComponent"; import FloatComponent from "../../components/floatComponent"; @@ -20,38 +47,9 @@ import IntComponent from "../../components/intComponent"; import PromptAreaComponent from "../../components/promptComponent"; import TextAreaComponent from "../../components/textAreaComponent"; import ToggleShadComponent from "../../components/toggleShadComponent"; -import { - Dialog, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle, - DialogTrigger, -} from "../../components/ui/dialog"; -import { - Table, - TableBody, - TableCell, - TableHead, - TableHeader, - TableRow, -} from "../../components/ui/table"; -import { - Tabs, - TabsContent, - TabsList, - TabsTrigger, -} from "../../components/ui/tabs"; -import { - EXPORT_CODE_DIALOG, - getCurlCode, - getPythonApiCode, - getPythonCode, -} from "../../constants"; -import { darkContext } from "../../contexts/darkContext"; +import ShadTooltip from "../../components/ShadTooltipComponent"; +import { cloneDeep, filter } from "lodash"; import { TabsContext } from "../../contexts/tabsContext"; -import { FlowType } from "../../types/flow/index"; -import { buildTweaks, classNames } from "../../utils"; export default function ApiModal({ flow }: { flow: FlowType }) { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx index 4a86fb9c6..b0bd8ce4d 100644 --- a/src/frontend/src/modals/EditNodeModal/index.tsx +++ b/src/frontend/src/modals/EditNodeModal/index.tsx @@ -1,17 +1,26 @@ -import { Variable } from "lucide-react"; import { useContext, useEffect, useRef, useState } from "react"; -import CodeAreaComponent from "../../components/codeAreaComponent"; -import Dropdown from "../../components/dropdownComponent"; -import FloatComponent from "../../components/floatComponent"; -import InputComponent from "../../components/inputComponent"; -import InputFileComponent from "../../components/inputFileComponent"; -import InputListComponent from "../../components/inputListComponent"; -import IntComponent from "../../components/intComponent"; -import PromptAreaComponent from "../../components/promptComponent"; -import TextAreaComponent from "../../components/textAreaComponent"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { NodeDataType } from "../../types/flow"; +import { classNames, limitScrollFieldsModal } from "../../utils"; +import { typesContext } from "../../contexts/typesContext"; +import { + Table, + TableBody, + TableCell, + TableHead, + TableHeader, + TableRow, +} from "../../components/ui/table"; import ToggleShadComponent from "../../components/toggleShadComponent"; -import { Badge } from "../../components/ui/badge"; -import { Button } from "../../components/ui/button"; +import InputListComponent from "../../components/inputListComponent"; +import TextAreaComponent from "../../components/textAreaComponent"; +import InputComponent from "../../components/inputComponent"; +import FloatComponent from "../../components/floatComponent"; +import Dropdown from "../../components/dropdownComponent"; +import IntComponent from "../../components/intComponent"; +import InputFileComponent from "../../components/inputFileComponent"; +import PromptAreaComponent from "../../components/promptComponent"; +import CodeAreaComponent from "../../components/codeAreaComponent"; import { Dialog, DialogContent, @@ -21,18 +30,9 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; -import { - Table, - TableBody, - TableCell, - TableHead, - TableHeader, - TableRow, -} from "../../components/ui/table"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { typesContext } from "../../contexts/typesContext"; -import { NodeDataType } from "../../types/flow"; -import { classNames, limitScrollFieldsModal } from "../../utils"; +import { Button } from "../../components/ui/button"; +import { Badge } from "../../components/ui/badge"; +import { Variable } from "lucide-react"; export default function EditNodeModal({ data }: { data: NodeDataType }) { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/NodeModal/components/ModalField/index.tsx b/src/frontend/src/modals/NodeModal/components/ModalField/index.tsx index 3208b989b..70344a996 100644 --- a/src/frontend/src/modals/NodeModal/components/ModalField/index.tsx +++ b/src/frontend/src/modals/NodeModal/components/ModalField/index.tsx @@ -1,14 +1,14 @@ import { useState } from "react"; -import CodeAreaComponent from "../../../../components/codeAreaComponent"; -import Dropdown from "../../../../components/dropdownComponent"; -import FloatComponent from "../../../../components/floatComponent"; -import InputComponent from "../../../../components/inputComponent"; -import InputFileComponent from "../../../../components/inputFileComponent"; import InputListComponent from "../../../../components/inputListComponent"; -import IntComponent from "../../../../components/intComponent"; -import PromptAreaComponent from "../../../../components/promptComponent"; +import Dropdown from "../../../../components/dropdownComponent"; import TextAreaComponent from "../../../../components/textAreaComponent"; +import InputComponent from "../../../../components/inputComponent"; import ToggleComponent from "../../../../components/toggleComponent"; +import FloatComponent from "../../../../components/floatComponent"; +import IntComponent from "../../../../components/intComponent"; +import InputFileComponent from "../../../../components/inputFileComponent"; +import PromptAreaComponent from "../../../../components/promptComponent"; +import CodeAreaComponent from "../../../../components/codeAreaComponent"; import { classNames } from "../../../../utils"; export default function ModalField({ diff --git a/src/frontend/src/modals/NodeModal/index.tsx b/src/frontend/src/modals/NodeModal/index.tsx index c61af4ff4..41ca699a9 100644 --- a/src/frontend/src/modals/NodeModal/index.tsx +++ b/src/frontend/src/modals/NodeModal/index.tsx @@ -1,8 +1,6 @@ import { Dialog, Transition } from "@headlessui/react"; -import { X } from "lucide-react"; import { Fragment, useContext, useRef, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; -import { typesContext } from "../../contexts/typesContext"; import { NodeDataType } from "../../types/flow"; import { classNames, @@ -11,7 +9,9 @@ import { nodeIconsLucide, toTitleCase, } from "../../utils"; +import { typesContext } from "../../contexts/typesContext"; import ModalField from "./components/ModalField"; +import { X } from "lucide-react"; export default function NodeModal({ data }: { data: NodeDataType }) { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/chatModal/chatMessage/index.tsx b/src/frontend/src/modals/chatModal/chatMessage/index.tsx index 5e130015a..6b1aecca2 100644 --- a/src/frontend/src/modals/chatModal/chatMessage/index.tsx +++ b/src/frontend/src/modals/chatModal/chatMessage/index.tsx @@ -1,17 +1,17 @@ -import Convert from "ansi-to-html"; -import DOMPurify from "dompurify"; -import { MessageCircle, User2 } from "lucide-react"; import { useEffect, useRef, useState } from "react"; +import { ChatMessageType } from "../../../types/chat"; +import { classNames } from "../../../utils"; +import AiIcon from "../../../assets/Gooey Ring-5s-271px.svg"; +import AiIconStill from "../../../assets/froze-flow.png"; +import FileCard from "../fileComponent"; import ReactMarkdown from "react-markdown"; import rehypeMathjax from "rehype-mathjax"; import remarkGfm from "remark-gfm"; import remarkMath from "remark-math"; -import AiIcon from "../../../assets/Gooey Ring-5s-271px.svg"; -import AiIconStill from "../../../assets/froze-flow.png"; -import { ChatMessageType } from "../../../types/chat"; -import { classNames } from "../../../utils"; -import FileCard from "../fileComponent"; import { CodeBlock } from "./codeBlock"; +import Convert from "ansi-to-html"; +import { User2, MessageCircle } from "lucide-react"; +import DOMPurify from "dompurify"; export default function ChatMessage({ chat, lockChat, diff --git a/src/frontend/src/modals/chatModal/index.tsx b/src/frontend/src/modals/chatModal/index.tsx index 5cbc2d17b..8cae31d8c 100644 --- a/src/frontend/src/modals/chatModal/index.tsx +++ b/src/frontend/src/modals/chatModal/index.tsx @@ -1,14 +1,14 @@ import { Dialog, Transition } from "@headlessui/react"; -import { Eraser, MessagesSquare, X } from "lucide-react"; import { Fragment, useContext, useEffect, useRef, useState } from "react"; +import { FlowType } from "../../types/flow"; import { alertContext } from "../../contexts/alertContext"; +import { validateNodes } from "../../utils"; import { typesContext } from "../../contexts/typesContext"; +import ChatMessage from "./chatMessage"; +import { X, MessagesSquare, Eraser } from "lucide-react"; import { sendAllProps } from "../../types/api"; import { ChatMessageType } from "../../types/chat"; -import { FlowType } from "../../types/flow"; -import { validateNodes } from "../../utils"; import ChatInput from "./chatInput"; -import ChatMessage from "./chatMessage"; import _ from "lodash"; import { getHealth } from "../../controllers/API"; diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index b05c1b0d3..8c2ebae86 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -1,13 +1,14 @@ -import "ace-builds/src-noconflict/ext-language_tools"; +import { useContext, useRef, useState } from "react"; +import { PopUpContext } from "../../contexts/popUpContext"; +import AceEditor from "react-ace"; import "ace-builds/src-noconflict/mode-python"; import "ace-builds/src-noconflict/theme-github"; import "ace-builds/src-noconflict/theme-twilight"; -import { useContext, useRef, useState } from "react"; -import AceEditor from "react-ace"; -import { PopUpContext } from "../../contexts/popUpContext"; +import "ace-builds/src-noconflict/ext-language_tools"; // import "ace-builds/webpack-resolver"; -import { TerminalSquare } from "lucide-react"; -import { Button } from "../../components/ui/button"; +import { darkContext } from "../../contexts/darkContext"; +import { postValidateCode } from "../../controllers/API"; +import { alertContext } from "../../contexts/alertContext"; import { Dialog, DialogContent, @@ -17,10 +18,9 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; +import { Button } from "../../components/ui/button"; import { CODE_PROMPT_DIALOG_SUBTITLE } from "../../constants"; -import { alertContext } from "../../contexts/alertContext"; -import { darkContext } from "../../contexts/darkContext"; -import { postValidateCode } from "../../controllers/API"; +import { TerminalSquare } from "lucide-react"; import { APIClassType } from "../../types/api"; export default function CodeAreaModal({ diff --git a/src/frontend/src/modals/exportModal/index.tsx b/src/frontend/src/modals/exportModal/index.tsx index f4a66c7b9..bef5b9244 100644 --- a/src/frontend/src/modals/exportModal/index.tsx +++ b/src/frontend/src/modals/exportModal/index.tsx @@ -1,8 +1,8 @@ -import { Download } from "lucide-react"; import { useContext, useRef, useState } from "react"; -import EditFlowSettings from "../../components/EditFlowSettingsComponent"; -import { Button } from "../../components/ui/button"; -import { Checkbox } from "../../components/ui/checkbox"; +import { alertContext } from "../../contexts/alertContext"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { TabsContext } from "../../contexts/tabsContext"; +import { removeApiKeys } from "../../utils"; import { Dialog, DialogContent, @@ -12,11 +12,11 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; +import { Button } from "../../components/ui/button"; +import { Checkbox } from "../../components/ui/checkbox"; 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"; +import { Download } from "lucide-react"; +import EditFlowSettings from "../../components/EditFlowSettingsComponent"; export default function ExportModal() { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/flowSettingsModal/index.tsx b/src/frontend/src/modals/flowSettingsModal/index.tsx index 44f82e331..ce9e474b8 100644 --- a/src/frontend/src/modals/flowSettingsModal/index.tsx +++ b/src/frontend/src/modals/flowSettingsModal/index.tsx @@ -1,7 +1,7 @@ -import { Settings2 } from "lucide-react"; import { useContext, useRef, useState } from "react"; -import EditFlowSettings from "../../components/EditFlowSettingsComponent"; -import { Button } from "../../components/ui/button"; +import { alertContext } from "../../contexts/alertContext"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { TabsContext } from "../../contexts/tabsContext"; import { Dialog, DialogContent, @@ -11,10 +11,11 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; +import { Button } from "../../components/ui/button"; import { SETTINGS_DIALOG_SUBTITLE } from "../../constants"; -import { alertContext } from "../../contexts/alertContext"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; +import EditFlowSettings from "../../components/EditFlowSettingsComponent"; +import { Settings2 } from "lucide-react"; +import { updateFlowInDatabase } from "../../controllers/API"; export default function FlowSettingsModal() { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/formModal/chatInput/index.tsx b/src/frontend/src/modals/formModal/chatInput/index.tsx index 3b31b0d42..f5eeed885 100644 --- a/src/frontend/src/modals/formModal/chatInput/index.tsx +++ b/src/frontend/src/modals/formModal/chatInput/index.tsx @@ -1,6 +1,7 @@ -import { Lock, LucideSend } from "lucide-react"; -import { useEffect } from "react"; import { classNames } from "../../../utils"; +import { useContext, useEffect, useRef, useState } from "react"; +import { TabsContext } from "../../../contexts/tabsContext"; +import { Eraser, Lock, LucideSend } from "lucide-react"; export default function ChatInput({ lockChat, diff --git a/src/frontend/src/modals/formModal/chatMessage/index.tsx b/src/frontend/src/modals/formModal/chatMessage/index.tsx index af3388596..19cb40d4d 100644 --- a/src/frontend/src/modals/formModal/chatMessage/index.tsx +++ b/src/frontend/src/modals/formModal/chatMessage/index.tsx @@ -1,17 +1,32 @@ -import Convert from "ansi-to-html"; -import { ChevronDown } from "lucide-react"; -import { useState } from "react"; +import { useEffect, useRef, useState } from "react"; +import { ChatMessageType } from "../../../types/chat"; +import { classNames } from "../../../utils"; +import AiIcon from "../../../assets/Gooey Ring-5s-271px.svg"; +import AiIconStill from "../../../assets/froze-flow.png"; +import Robot from "../../../assets/robot.png"; +import MaleTechnology from "../../../assets/male-technologist.png"; +import FileCard from "../fileComponent"; import ReactMarkdown from "react-markdown"; import rehypeMathjax from "rehype-mathjax"; import remarkGfm from "remark-gfm"; import remarkMath from "remark-math"; -import MaleTechnology from "../../../assets/male-technologist.png"; -import Robot from "../../../assets/robot.png"; -import { THOUGHTS_ICON } from "../../../constants"; -import { ChatMessageType } from "../../../types/chat"; -import { classNames } from "../../../utils"; -import FileCard from "../fileComponent"; import { CodeBlock } from "./codeBlock"; +import Convert from "ansi-to-html"; +import { + User2, + MessageSquare, + ChevronDown, + MessageCircle, + MessageSquareDashed, +} from "lucide-react"; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "../../../components/ui/accordion"; +import { Badge } from "../../../components/ui/badge"; +import { THOUGHTS_ICON } from "../../../constants"; export default function ChatMessage({ chat, diff --git a/src/frontend/src/modals/formModal/fileComponent/index.tsx b/src/frontend/src/modals/formModal/fileComponent/index.tsx index 6ede4e136..74f6155b7 100644 --- a/src/frontend/src/modals/formModal/fileComponent/index.tsx +++ b/src/frontend/src/modals/formModal/fileComponent/index.tsx @@ -1,6 +1,6 @@ import * as base64js from "base64-js"; -import { DownloadCloud, File } from "lucide-react"; import { useState } from "react"; +import { DownloadCloud, File } from "lucide-react"; export default function FileCard({ fileName, content, fileType }) { const handleDownload = () => { diff --git a/src/frontend/src/modals/formModal/index.tsx b/src/frontend/src/modals/formModal/index.tsx index 0168708ec..a6633265b 100644 --- a/src/frontend/src/modals/formModal/index.tsx +++ b/src/frontend/src/modals/formModal/index.tsx @@ -1,23 +1,15 @@ -import { Eraser, TerminalSquare, Variable } from "lucide-react"; import { useContext, useEffect, useRef, useState } from "react"; +import { FlowType } from "../../types/flow"; import { alertContext } from "../../contexts/alertContext"; +import { classNames, validateNodes } from "../../utils"; import { typesContext } from "../../contexts/typesContext"; +import ChatMessage from "./chatMessage"; +import { TerminalSquare, MessageSquare, Variable, Eraser } from "lucide-react"; import { sendAllProps } from "../../types/api"; import { ChatMessageType } from "../../types/chat"; -import { FlowType } from "../../types/flow"; -import { classNames, validateNodes } from "../../utils"; import ChatInput from "./chatInput"; -import ChatMessage from "./chatMessage"; import _ from "lodash"; -import ToggleShadComponent from "../../components/toggleShadComponent"; -import { - Accordion, - AccordionContent, - AccordionItem, - AccordionTrigger, -} from "../../components/ui/accordion"; -import { Badge } from "../../components/ui/badge"; import { Dialog, DialogContent, @@ -26,9 +18,17 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; -import { Textarea } from "../../components/ui/textarea"; import { CHAT_FORM_DIALOG_SUBTITLE, THOUGHTS_ICON } from "../../constants"; import { TabsContext } from "../../contexts/tabsContext"; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "../../components/ui/accordion"; +import { Textarea } from "../../components/ui/textarea"; +import { Badge } from "../../components/ui/badge"; +import ToggleShadComponent from "../../components/toggleShadComponent"; export default function FormModal({ flow, diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx index 9632b8bc8..aa3c99774 100644 --- a/src/frontend/src/modals/genericModal/index.tsx +++ b/src/frontend/src/modals/genericModal/index.tsx @@ -1,9 +1,8 @@ -import DOMPurify from "dompurify"; -import { FileText, Variable } from "lucide-react"; -import { useContext, useEffect, useRef, useState } from "react"; -import ShadTooltip from "../../components/ShadTooltipComponent"; -import { Badge } from "../../components/ui/badge"; -import { Button } from "../../components/ui/button"; +import { useContext, useRef, useState, useEffect } from "react"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { darkContext } from "../../contexts/darkContext"; +import { postValidatePrompt } from "../../controllers/API"; +import { alertContext } from "../../contexts/alertContext"; import { Dialog, DialogContent, @@ -13,16 +12,14 @@ import { DialogTitle, DialogTrigger, } from "../../components/ui/dialog"; +import { Button } from "../../components/ui/button"; import { Textarea } from "../../components/ui/textarea"; import { HIGHLIGH_CSS, PROMPT_DIALOG_SUBTITLE, TEXT_DIALOG_SUBTITLE, } from "../../constants"; -import { alertContext } from "../../contexts/alertContext"; -import { darkContext } from "../../contexts/darkContext"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { postValidatePrompt } from "../../controllers/API"; +import { FileText } from "lucide-react"; import { APIClassType } from "../../types/api"; import { INVALID_CHARACTERS, @@ -32,6 +29,10 @@ import { regexHighlight, varHighlightHTML, } from "../../utils"; +import { Badge } from "../../components/ui/badge"; +import ShadTooltip from "../../components/ShadTooltipComponent"; +import DOMPurify from "dompurify"; +import { Variable } from "lucide-react"; export default function GenericModal({ field_name = "", @@ -237,40 +238,40 @@ export default function GenericModal({ {type == TypeModal.PROMPT && ( <> -
-
- - - Input Variables:{" "} - {wordsHighlight && wordsHighlight.length == 0 ? "-" : ""} - +
+
+ + + Input Variables:{" "} + {wordsHighlight && wordsHighlight.length == 0 ? "-" : ""} + - {wordsHighlight.map((word, index) => ( - ( + + - -
- - {word.replace(/[{}]/g, "").length > 59 - ? word.replace(/[{}]/g, "").slice(0, 56) + "..." - : word.replace(/[{}]/g, "")} - -
- - - ))} -
+
+ + {word.replace(/[{}]/g, "").length > 59 + ? word.replace(/[{}]/g, "").slice(0, 56) + "..." + : word.replace(/[{}]/g, "")} + +
+ + + ))}
- +
+ )} diff --git a/src/frontend/src/modals/importModal/buttonBox/index.tsx b/src/frontend/src/modals/importModal/buttonBox/index.tsx index a1116a8d4..ffe79abaa 100644 --- a/src/frontend/src/modals/importModal/buttonBox/index.tsx +++ b/src/frontend/src/modals/importModal/buttonBox/index.tsx @@ -1,4 +1,4 @@ -import { ReactNode } from "react"; +import React, { ReactNode } from "react"; import { classNames } from "../../../utils"; export default function ButtonBox({ diff --git a/src/frontend/src/modals/importModal/index.tsx b/src/frontend/src/modals/importModal/index.tsx index 4302fd9d8..600192d4c 100644 --- a/src/frontend/src/modals/importModal/index.tsx +++ b/src/frontend/src/modals/importModal/index.tsx @@ -1,11 +1,18 @@ import { - ArrowLeftIcon, - ArrowUpTrayIcon, - ComputerDesktopIcon, DocumentDuplicateIcon, + ComputerDesktopIcon, + ArrowUpTrayIcon, + ArrowLeftIcon, } from "@heroicons/react/24/outline"; import { useContext, useRef, useState } from "react"; +import { PopUpContext } from "../../contexts/popUpContext"; +import { TabsContext } from "../../contexts/tabsContext"; +import ButtonBox from "./buttonBox"; +import { getExamples } from "../../controllers/API"; +import { alertContext } from "../../contexts/alertContext"; import LoadingComponent from "../../components/loadingComponent"; +import { FlowType } from "../../types/flow"; +import { classNames } from "../../utils"; import { Dialog, DialogContent, @@ -16,13 +23,6 @@ import { DialogTrigger, } from "../../components/ui/dialog"; import { IMPORT_DIALOG_SUBTITLE } from "../../constants"; -import { alertContext } from "../../contexts/alertContext"; -import { PopUpContext } from "../../contexts/popUpContext"; -import { TabsContext } from "../../contexts/tabsContext"; -import { getExamples } from "../../controllers/API"; -import { FlowType } from "../../types/flow"; -import { classNames } from "../../utils"; -import ButtonBox from "./buttonBox"; export default function ImportModal() { const [open, setOpen] = useState(true); diff --git a/src/frontend/src/modals/promptModal/index.tsx b/src/frontend/src/modals/promptModal/index.tsx index 54fd46528..1f575ded9 100644 --- a/src/frontend/src/modals/promptModal/index.tsx +++ b/src/frontend/src/modals/promptModal/index.tsx @@ -1,10 +1,10 @@ import { Dialog, Transition } from "@headlessui/react"; -import { DocumentTextIcon, XMarkIcon } from "@heroicons/react/24/outline"; +import { XMarkIcon, DocumentTextIcon } from "@heroicons/react/24/outline"; import { Fragment, useContext, useRef, useState } from "react"; -import { alertContext } from "../../contexts/alertContext"; -import { darkContext } from "../../contexts/darkContext"; import { PopUpContext } from "../../contexts/popUpContext"; +import { darkContext } from "../../contexts/darkContext"; import { checkPrompt } from "../../controllers/API"; +import { alertContext } from "../../contexts/alertContext"; export default function PromptAreaModal({ value, setValue, diff --git a/src/frontend/src/modals/textAreaModal/index.tsx b/src/frontend/src/modals/textAreaModal/index.tsx index 83186bbea..6064b3955 100644 --- a/src/frontend/src/modals/textAreaModal/index.tsx +++ b/src/frontend/src/modals/textAreaModal/index.tsx @@ -1,7 +1,7 @@ import { Dialog, Transition } from "@headlessui/react"; import { - ClipboardDocumentListIcon, XMarkIcon, + ClipboardDocumentListIcon, } from "@heroicons/react/24/outline"; import { Fragment, useContext, useRef, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; diff --git a/src/frontend/src/pages/CommunityPage/index.tsx b/src/frontend/src/pages/CommunityPage/index.tsx index 6d09999cc..b5e197f2c 100644 --- a/src/frontend/src/pages/CommunityPage/index.tsx +++ b/src/frontend/src/pages/CommunityPage/index.tsx @@ -1,13 +1,13 @@ -import { GitFork, GithubIcon, Users2 } from "lucide-react"; import { useContext, useEffect, useState } from "react"; -import { Button } from "../../components/ui/button"; -import { alertContext } from "../../contexts/alertContext"; +import { GithubIcon, Users2, GitFork } from "lucide-react"; import { TabsContext } from "../../contexts/tabsContext"; +import { alertContext } from "../../contexts/alertContext"; +import { Button } from "../../components/ui/button"; -import { useNavigate } from "react-router-dom"; -import { CardComponent } from "../../components/cardComponent"; import { getExamples } from "../../controllers/API"; import { FlowType } from "../../types/flow"; +import { CardComponent } from "../../components/cardComponent"; +import { useNavigate } from "react-router-dom"; export default function CommunityPage() { const { flows, setTabId, downloadFlows, uploadFlows, addFlow } = useContext(TabsContext); diff --git a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx index d49a099a5..2f3b1d4ff 100644 --- a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx @@ -1,6 +1,6 @@ import { Disclosure } from "@headlessui/react"; -import { ChevronRight } from "lucide-react"; import { DisclosureComponentType } from "../../../../types/components"; +import { ChevronRight } from "lucide-react"; export default function DisclosureComponent({ button: { title, Icon, buttons = [] }, diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index 51c84580e..48a3f94ff 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -1,21 +1,21 @@ -import _ from "lodash"; -import { useCallback, useContext, useEffect, useRef, useState } from "react"; +import _, { set } from "lodash"; +import { useContext, useRef, useState, useEffect, useCallback } from "react"; import ReactFlow, { - Background, - Connection, - Controls, - Edge, - EdgeChange, - NodeChange, - NodeDragHandler, - OnEdgesDelete, OnSelectionChangeParams, - SelectionDragHandler, - addEdge, - updateEdge, - useEdgesState, useNodesState, + useEdgesState, useReactFlow, + EdgeChange, + Connection, + addEdge, + NodeDragHandler, + SelectionDragHandler, + OnEdgesDelete, + Edge, + updateEdge, + Background, + Controls, + NodeChange, } from "reactflow"; import GenericNode from "../../../../CustomNodes/GenericNode"; import Chat from "../../../../components/chatComponent"; @@ -23,12 +23,12 @@ import { alertContext } from "../../../../contexts/alertContext"; import { locationContext } from "../../../../contexts/locationContext"; import { TabsContext } from "../../../../contexts/tabsContext"; import { typesContext } from "../../../../contexts/typesContext"; -import { undoRedoContext } from "../../../../contexts/undoRedoContext"; import { APIClassType } from "../../../../types/api"; import { FlowType, NodeType } from "../../../../types/flow"; import { isValidConnection } from "../../../../utils"; import ConnectionLineComponent from "../ConnectionLineComponent"; import ExtraSidebar from "../extraSidebarComponent"; +import { undoRedoContext } from "../../../../contexts/undoRedoContext"; const nodeTypes = { genericNode: GenericNode, diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx index 4a77975d4..591bdf2d6 100644 --- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx @@ -1,21 +1,22 @@ -import { Code2, FileDown, FileUp, Menu, Save, Search } from "lucide-react"; -import { useContext, useState } from "react"; -import ShadTooltip from "../../../../components/ShadTooltipComponent"; -import { Separator } from "../../../../components/ui/separator"; -import { alertContext } from "../../../../contexts/alertContext"; -import { PopUpContext } from "../../../../contexts/popUpContext"; -import { TabsContext } from "../../../../contexts/tabsContext"; -import { typesContext } from "../../../../contexts/typesContext"; -import ApiModal from "../../../../modals/ApiModal"; -import ExportModal from "../../../../modals/exportModal"; -import { APIClassType, APIObjectType } from "../../../../types/api"; +import DisclosureComponent from "../DisclosureComponent"; import { classNames, nodeColors, nodeIconsLucide, nodeNames, } from "../../../../utils"; -import DisclosureComponent from "../DisclosureComponent"; +import { useContext, useState } from "react"; +import { typesContext } from "../../../../contexts/typesContext"; +import { APIClassType, APIObjectType } from "../../../../types/api"; +import ShadTooltip from "../../../../components/ShadTooltipComponent"; +import { Code2, FileDown, FileUp, Save, Search } from "lucide-react"; +import { PopUpContext } from "../../../../contexts/popUpContext"; +import ExportModal from "../../../../modals/exportModal"; +import ApiModal from "../../../../modals/ApiModal"; +import { TabsContext } from "../../../../contexts/tabsContext"; +import { alertContext } from "../../../../contexts/alertContext"; +import { Separator } from "../../../../components/ui/separator"; +import { Menu } from "lucide-react"; export default function ExtraSidebar() { const { data } = useContext(typesContext); diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index 0183dcb16..0087d3759 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -1,10 +1,10 @@ -import { Copy, FileText, Settings2, Trash2 } from "lucide-react"; import { useContext, useState } from "react"; -import { useReactFlow } from "reactflow"; -import ShadTooltip from "../../../../components/ShadTooltipComponent"; -import { TabsContext } from "../../../../contexts/tabsContext"; -import EditNodeModal from "../../../../modals/EditNodeModal"; +import { Settings2, Copy, Trash2, FileText } from "lucide-react"; import { classNames } from "../../../../utils"; +import { TabsContext } from "../../../../contexts/tabsContext"; +import { useReactFlow } from "reactflow"; +import EditNodeModal from "../../../../modals/EditNodeModal"; +import ShadTooltip from "../../../../components/ShadTooltipComponent"; const NodeToolbarComponent = (props) => { const [nodeLength, setNodeLength] = useState( diff --git a/src/frontend/src/pages/FlowPage/index.tsx b/src/frontend/src/pages/FlowPage/index.tsx index f9b170197..a13fabd98 100644 --- a/src/frontend/src/pages/FlowPage/index.tsx +++ b/src/frontend/src/pages/FlowPage/index.tsx @@ -1,8 +1,8 @@ import { useContext, useEffect, useState } from "react"; -import { useParams } from "react-router-dom"; -import { TabsContext } from "../../contexts/tabsContext"; -import { getVersion } from "../../controllers/API"; import Page from "./components/PageComponent"; +import { TabsContext } from "../../contexts/tabsContext"; +import { useParams } from "react-router-dom"; +import { getVersion } from "../../controllers/API"; export default function FlowPage() { const { flows, tabId, setTabId } = useContext(TabsContext); diff --git a/src/frontend/src/pages/MainPage/index.tsx b/src/frontend/src/pages/MainPage/index.tsx index e2871a313..99df6a8a8 100644 --- a/src/frontend/src/pages/MainPage/index.tsx +++ b/src/frontend/src/pages/MainPage/index.tsx @@ -1,10 +1,10 @@ -import { Download, ExternalLink, Home, Plus, Upload } from "lucide-react"; import { useContext, useEffect } from "react"; +import { Download, Upload, Plus, Home, ExternalLink } from "lucide-react"; +import { TabsContext } from "../../contexts/tabsContext"; +import { Button } from "../../components/ui/button"; import { Link, useNavigate } from "react-router-dom"; import { CardComponent } from "../../components/cardComponent"; -import { Button } from "../../components/ui/button"; import { USER_PROJECTS_HEADER } from "../../constants"; -import { TabsContext } from "../../contexts/tabsContext"; export default function HomePage() { const { flows, setTabId, downloadFlows, uploadFlows, addFlow, removeFlow } = useContext(TabsContext); diff --git a/src/frontend/src/routes.tsx b/src/frontend/src/routes.tsx index 21b73f70b..a208b121a 100644 --- a/src/frontend/src/routes.tsx +++ b/src/frontend/src/routes.tsx @@ -1,7 +1,7 @@ import { Route, Routes } from "react-router-dom"; -import CommunityPage from "./pages/CommunityPage"; -import FlowPage from "./pages/FlowPage"; import HomePage from "./pages/MainPage"; +import FlowPage from "./pages/FlowPage"; +import CommunityPage from "./pages/CommunityPage"; const Router = () => { return ( diff --git a/src/frontend/src/types/api/index.ts b/src/frontend/src/types/api/index.ts index eaf862f29..505aae044 100644 --- a/src/frontend/src/types/api/index.ts +++ b/src/frontend/src/types/api/index.ts @@ -1,4 +1,4 @@ -import { Edge, Node, Viewport } from "reactflow"; +import { Node, Edge, Viewport } from "reactflow"; //kind and class are just representative names to represent the actual structure of the object received by the API export type APIObjectType = { kind: APIKindType; [key: string]: APIKindType }; diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 40998fe46..984652b9a 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -1,7 +1,7 @@ import { ReactElement, ReactNode } from "react"; -import { APIClassType } from "../api"; import { NodeDataType } from "../flow/index"; import { typesContextType } from "../typesContext"; +import { APIClassType } from "../api"; export type InputComponentType = { value: string; disabled?: boolean; diff --git a/src/frontend/src/types/flow/index.ts b/src/frontend/src/types/flow/index.ts index ccf9933ee..b1f86392b 100644 --- a/src/frontend/src/types/flow/index.ts +++ b/src/frontend/src/types/flow/index.ts @@ -1,5 +1,6 @@ -import { ReactFlowJsonObject, XYPosition } from "reactflow"; +import { ChatMessageType } from "./../chat/index"; import { APIClassType } from "../api/index"; +import { ReactFlowJsonObject, XYPosition } from "reactflow"; export type FlowType = { name: string; diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts index 7fb0cacb1..f74f0d584 100644 --- a/src/frontend/src/utils.ts +++ b/src/frontend/src/utils.ts @@ -1,9 +1,34 @@ -import clsx, { ClassValue } from "clsx"; +import { Connection, Edge, Node, ReactFlowInstance } from "reactflow"; +import { FlowType, NodeType } from "./types/flow"; +import { APITemplateType } from "./types/api"; import _ from "lodash"; +import { ChromaIcon } from "./icons/ChromaIcon"; +import { AnthropicIcon } from "./icons/Anthropic"; +import { AirbyteIcon } from "./icons/Airbyte"; +import { BingIcon } from "./icons/Bing"; +import { CohereIcon } from "./icons/Cohere"; +import { EvernoteIcon } from "./icons/Evernote"; +import { FBIcon } from "./icons/FacebookMessenger"; +import { GitBookIcon } from "./icons/GitBook"; +import { GoogleIcon } from "./icons/Google"; +import { HackerNewsIcon } from "./icons/hackerNews"; +import { HugginFaceIcon } from "./icons/HuggingFace"; +import { IFixIcon } from "./icons/IFixIt"; +import { MetaIcon } from "./icons/Meta"; +import { MidjourneyIcon } from "./icons/Midjorney"; +import { NotionIcon } from "./icons/Notion"; +import { OpenAiIcon } from "./icons/OpenAi"; +import { QDrantIcon } from "./icons/QDrant"; +import { SearxIcon } from "./icons/Searx"; +import { SlackIcon } from "./icons/Slack"; +import { PineconeIcon } from "./icons/Pinecone"; +import clsx, { ClassValue } from "clsx"; +import { twMerge } from "tailwind-merge"; +import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "./flow_constants"; +import { ComponentType, SVGProps } from "react"; import { Compass, Cpu, - FileSearch, Fingerprint, Gift, Hammer, @@ -16,40 +41,15 @@ import { Paperclip, Rocket, Scissors, + FileSearch, TerminalSquare, Wand2, Wrench, } from "lucide-react"; -import { ComponentType, SVGProps } from "react"; -import { Connection, Edge, Node, ReactFlowInstance } from "reactflow"; -import { twMerge } from "tailwind-merge"; -import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "./flow_constants"; -import { AirbyteIcon } from "./icons/Airbyte"; -import { AnthropicIcon } from "./icons/Anthropic"; -import { BingIcon } from "./icons/Bing"; -import { ChromaIcon } from "./icons/ChromaIcon"; -import { CohereIcon } from "./icons/Cohere"; -import { EvernoteIcon } from "./icons/Evernote"; -import { FBIcon } from "./icons/FacebookMessenger"; -import { GitBookIcon } from "./icons/GitBook"; -import { GoogleIcon } from "./icons/Google"; -import { HugginFaceIcon } from "./icons/HuggingFace"; -import { IFixIcon } from "./icons/IFixIt"; -import { MetaIcon } from "./icons/Meta"; -import { MidjourneyIcon } from "./icons/Midjorney"; -import { MongoDBIcon } from "./icons/MongoDB"; -import { NotionIcon } from "./icons/Notion"; -import { OpenAiIcon } from "./icons/OpenAi"; -import { PineconeIcon } from "./icons/Pinecone"; -import { QDrantIcon } from "./icons/QDrant"; -import { SearxIcon } from "./icons/Searx"; -import { SlackIcon } from "./icons/Slack"; -import { VertexAIIcon } from "./icons/VertexAI"; -import { HackerNewsIcon } from "./icons/hackerNews"; import { SupabaseIcon } from "./icons/supabase"; -import { APITemplateType } from "./types/api"; +import { MongoDBIcon } from "./icons/MongoDB"; +import { VertexAIIcon } from "./icons/VertexAI"; import { IVarHighlightType } from "./types/components"; -import { FlowType, NodeType } from "./types/flow"; export function classNames(...classes: Array) { return classes.filter(Boolean).join(" "); diff --git a/src/frontend/vite.config.ts b/src/frontend/vite.config.ts index f051c2eee..860c690ea 100644 --- a/src/frontend/vite.config.ts +++ b/src/frontend/vite.config.ts @@ -1,5 +1,5 @@ -import react from "@vitejs/plugin-react-swc"; import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react-swc"; import svgr from "vite-plugin-svgr"; const apiRoutes = ["^/api/v1/", "/health"];