From e7852bcd1afac6d0a1339a8ba1efa897f0dfba68 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Thu, 22 Jun 2023 15:32:49 -0300 Subject: [PATCH 1/9] =?UTF-8?q?=F0=9F=8E=A8=20style(parameterComponent):?= =?UTF-8?q?=20change=20nodeIcons=20import=20to=20nodeIconsLucide=20to=20ma?= =?UTF-8?q?tch=20the=20new=20icon=20library=20=F0=9F=8E=A8=20style(Generic?= =?UTF-8?q?Node):=20change=20nodeIcons=20import=20to=20nodeIconsLucide=20t?= =?UTF-8?q?o=20match=20the=20new=20icon=20library=20=F0=9F=8E=A8=20style(N?= =?UTF-8?q?odeModal):=20change=20Icon=20type=20to=20any=20to=20fix=20type?= =?UTF-8?q?=20error=20=F0=9F=8E=A8=20style(chatInput):=20remove=20unnecess?= =?UTF-8?q?ary=20array=20brackets=20=F0=9F=8E=A8=20style(DisclosureCompone?= =?UTF-8?q?nt):=20change=20Icon=20size=20to=2022=20to=20match=20the=20new?= =?UTF-8?q?=20icon=20library=20=F0=9F=8E=A8=20style(extraSidebarComponent)?= =?UTF-8?q?:=20change=20nodeIcons=20import=20to=20nodeIconsLucide=20to=20m?= =?UTF-8?q?atch=20the=20new=20icon=20library=20and=20add=20Search=20icon?= =?UTF-8?q?=20=F0=9F=8E=A8=20style(components/index):=20add=20SVGProps=20t?= =?UTF-8?q?o=20import=20and=20change=20Icon=20type=20to=20any=20to=20fix?= =?UTF-8?q?=20type=20error?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ✨ feat(utils.ts): add support for Lucide icons to be used in the app to improve UI and UX. --- .../components/parameterComponent/index.tsx | 7 +- .../src/CustomNodes/GenericNode/index.tsx | 11 +- src/frontend/src/modals/NodeModal/index.tsx | 2 +- .../src/modals/chatModal/chatInput/index.tsx | 5 +- .../components/DisclosureComponent/index.tsx | 2 +- .../extraSidebarComponent/index.tsx | 8 +- src/frontend/src/types/components/index.ts | 10 +- src/frontend/src/utils.ts | 157 ++++++++++++++++++ 8 files changed, 185 insertions(+), 17 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index 65f946ba2..27090bd3a 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -3,6 +3,7 @@ import { classNames, groupByFamily, isValidConnection, + nodeIconsLucide, } from "../../../../utils"; import { useContext, useEffect, useRef, useState } from "react"; import InputComponent from "../../../../components/inputComponent"; @@ -17,7 +18,7 @@ import InputFileComponent from "../../../../components/inputFileComponent"; import { TabsContext } from "../../../../contexts/tabsContext"; import IntComponent from "../../../../components/intComponent"; import PromptAreaComponent from "../../../../components/promptComponent"; -import { nodeNames, nodeIcons } from "../../../../utils"; +import { nodeNames } from "../../../../utils"; import React from "react"; import { nodeColors } from "../../../../utils"; import ShadTooltip from "../../../../components/ShadTooltipComponent"; @@ -88,12 +89,12 @@ export default function ParameterComponent({ )} >
- {React.createElement(nodeIcons[item.family])} + {React.createElement(nodeIconsLucide[item.family])}
{nodeNames[item.family] ?? ""}{" "} diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index fb1ed5f59..eda6dee41 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -1,4 +1,9 @@ -import { classNames, nodeColors, nodeIcons, toTitleCase } from "../../utils"; +import { + classNames, + nodeColors, + nodeIconsLucide, + toTitleCase, +} from "../../utils"; import ParameterComponent from "./components/parameterComponent"; import { typesContext } from "../../contexts/typesContext"; import { useContext, useState, useEffect, useRef } from "react"; @@ -12,6 +17,7 @@ import NodeToolbarComponent from "../../pages/FlowPage/components/nodeToolbarCom import ShadTooltip from "../../components/ShadTooltipComponent"; import { useSSE } from "../../contexts/SSEContext"; +import { ReactElement } from "react-markdown/lib/react-markdown"; export default function GenericNode({ data, @@ -26,7 +32,8 @@ export default function GenericNode({ const { closePopUp, openPopUp } = useContext(PopUpContext); - const Icon = nodeIcons[data.type] || nodeIcons[types[data.type]]; + const Icon: any = + nodeIconsLucide[data.type] || nodeIconsLucide[types[data.type]]; const [validationStatus, setValidationStatus] = useState(null); // State for outline color const { sseData, isBuilding } = useSSE(); diff --git a/src/frontend/src/modals/NodeModal/index.tsx b/src/frontend/src/modals/NodeModal/index.tsx index 6ceba62bf..e28457859 100644 --- a/src/frontend/src/modals/NodeModal/index.tsx +++ b/src/frontend/src/modals/NodeModal/index.tsx @@ -27,7 +27,7 @@ export default function NodeModal({ data }: { data: NodeDataType }) { }, 300); } } - const Icon = nodeIcons[types[data.type]]; + const Icon: any = nodeIcons[types[data.type]]; return ( { if (inputRef.current) { diff --git a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx index 7b80e1cff..7f25d1fe1 100644 --- a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx @@ -14,7 +14,7 @@ export default function DisclosureComponent({
- + {title} diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx index 2aab4d0e3..5748d548f 100644 --- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx @@ -3,7 +3,7 @@ import DisclosureComponent from "../DisclosureComponent"; import { classNames, nodeColors, - nodeIcons, + nodeIconsLucide, nodeNames, } from "../../../../utils"; import { useContext, useState } from "react"; @@ -11,7 +11,7 @@ import { typesContext } from "../../../../contexts/typesContext"; import { APIClassType, APIObjectType } from "../../../../types/api"; import { MagnifyingGlassIcon } from "@heroicons/react/24/outline"; import ShadTooltip from "../../../../components/ShadTooltipComponent"; -import { Code2, FileDown, FileUp, Save } from "lucide-react"; +import { Code2, FileDown, FileUp, Save, Search } from "lucide-react"; import { PopUpContext } from "../../../../contexts/popUpContext"; import ExportModal from "../../../../modals/exportModal"; import ApiModal from "../../../../modals/ApiModal"; @@ -135,7 +135,7 @@ export default function ExtraSidebar() { }} />
- +
@@ -149,7 +149,7 @@ export default function ExtraSidebar() { key={i} button={{ title: nodeNames[d] ?? nodeNames.unknown, - Icon: nodeIcons[d] ?? nodeIcons.unknown, + Icon: nodeIconsLucide[d] ?? nodeIconsLucide.unknown, }} >
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 11f8aec07..630526193 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -1,4 +1,10 @@ -import { ForwardRefExoticComponent, ReactElement, ReactNode } from "react"; +import { + ComponentType, + ForwardRefExoticComponent, + ReactElement, + ReactNode, + SVGProps, +} from "react"; import { NodeDataType } from "../flow/index"; import { typesContextType } from "../typesContext"; export type InputComponentType = { @@ -65,7 +71,7 @@ export type DisclosureComponentType = { openDisc: boolean; button: { title: string; - Icon: ForwardRefExoticComponent>; + Icon: any; buttons?: { Icon: ReactElement; title: string; diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts index c09c64b2b..0b853974c 100644 --- a/src/frontend/src/utils.ts +++ b/src/frontend/src/utils.ts @@ -42,6 +42,27 @@ import { SlackIcon } from "./icons/Slack"; import clsx, { ClassValue } from "clsx"; import { twMerge } from "tailwind-merge"; import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "./constants"; +import { ComponentType, SVGProps } from "react"; +import { + Boxes, + Cpu, + Fingerprint, + Gift, + Hammer, + HelpCircle, + Laptop2, + Layers, + LayoutDashboard, + Lightbulb, + Link, + MessageCircle, + Paperclip, + Rocket, + Scissors, + TerminalSquare, + Wand2, + Wrench, +} from "lucide-react"; export function classNames(...classes: Array) { return classes.filter(Boolean).join(" "); @@ -198,6 +219,142 @@ export const nodeIcons: { unknown: QuestionMarkCircleIcon, }; +export const nodeIconsLucide: { + [char: string]: React.ForwardRefExoticComponent< + ComponentType> + >; +} = { + Chroma: ChromaIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + AirbyteJSONLoader: AirbyteIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Anthropic: AnthropicIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + ChatAnthropic: AnthropicIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + BingSearchAPIWrapper: BingIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + BingSearchRun: BingIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Cohere: CohereIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + CohereEmbeddings: CohereIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + EverNoteLoader: EvernoteIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + FacebookChatLoader: FBIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + GitbookLoader: GitBookIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + GoogleSearchAPIWrapper: GoogleIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + GoogleSearchResults: GoogleIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + GoogleSearchRun: GoogleIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + HNLoader: HackerNewsIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + HuggingFaceHub: HugginFaceIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + HuggingFaceEmbeddings: HugginFaceIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + IFixitLoader: IFixIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Meta: MetaIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Midjorney: MidjorneyIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + NotionDirectoryLoader: NotionIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + ChatOpenAI: OpenAiIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + OpenAI: OpenAiIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + OpenAIEmbeddings: OpenAiIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Qdrant: QDrantIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + Searx: SearxIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + SlackDirectoryLoader: SlackIcon as React.ForwardRefExoticComponent< + ComponentType> + >, + agents: Rocket as React.ForwardRefExoticComponent< + ComponentType> + >, + chains: Link as React.ForwardRefExoticComponent< + ComponentType> + >, + memories: Cpu as React.ForwardRefExoticComponent< + ComponentType> + >, + llms: Lightbulb as React.ForwardRefExoticComponent< + ComponentType> + >, + prompts: TerminalSquare as React.ForwardRefExoticComponent< + ComponentType> + >, + tools: Wrench as React.ForwardRefExoticComponent< + ComponentType> + >, + advanced: Laptop2 as React.ForwardRefExoticComponent< + ComponentType> + >, + chat: MessageCircle as React.ForwardRefExoticComponent< + ComponentType> + >, + embeddings: Fingerprint as React.ForwardRefExoticComponent< + ComponentType> + >, + documentloaders: Paperclip as React.ForwardRefExoticComponent< + ComponentType> + >, + vectorstores: Layers as React.ForwardRefExoticComponent< + ComponentType> + >, + toolkits: Hammer as React.ForwardRefExoticComponent< + ComponentType> + >, + textsplitters: Scissors as React.ForwardRefExoticComponent< + ComponentType> + >, + wrappers: Gift as React.ForwardRefExoticComponent< + ComponentType> + >, + utilities: Wand2 as React.ForwardRefExoticComponent< + ComponentType> + >, + unknown: HelpCircle as React.ForwardRefExoticComponent< + ComponentType> + >, +}; + export const gradients = [ "bg-gradient-to-br from-gray-800 via-rose-700 to-violet-900", "bg-gradient-to-br from-green-200 via-green-300 to-blue-500", From fe0aa91ed063a32da66a08b7f6de75978aed1d1b Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Thu, 22 Jun 2023 16:37:06 -0300 Subject: [PATCH 2/9] chore(GenericNode/index.tsx): import additional types from react to improve type safety --- src/frontend/src/CustomNodes/GenericNode/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index eda6dee41..6252e3772 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -6,7 +6,7 @@ import { } from "../../utils"; import ParameterComponent from "./components/parameterComponent"; import { typesContext } from "../../contexts/typesContext"; -import { useContext, useState, useEffect, useRef } from "react"; +import { useContext, useState, useEffect, useRef, ForwardRefExoticComponent, ComponentType, SVGProps, ReactNode } from "react"; import { NodeDataType } from "../../types/flow"; import { alertContext } from "../../contexts/alertContext"; import { PopUpContext } from "../../contexts/popUpContext"; @@ -31,7 +31,7 @@ export default function GenericNode({ const { types, deleteNode } = useContext(typesContext); const { closePopUp, openPopUp } = useContext(PopUpContext); - + // any to avoid type conflict const Icon: any = nodeIconsLucide[data.type] || nodeIconsLucide[types[data.type]]; const [validationStatus, setValidationStatus] = useState(null); From 9236ee21c8ca695fc9bfc19be9cc79843417d8d0 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Thu, 22 Jun 2023 16:40:59 -0300 Subject: [PATCH 3/9] =?UTF-8?q?=F0=9F=94=A8=20refactor(NodeModal):=20add?= =?UTF-8?q?=20type=20any=20to=20Icon=20variable=20to=20avoid=20type=20conf?= =?UTF-8?q?lict?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/src/modals/NodeModal/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/frontend/src/modals/NodeModal/index.tsx b/src/frontend/src/modals/NodeModal/index.tsx index e28457859..27255fd84 100644 --- a/src/frontend/src/modals/NodeModal/index.tsx +++ b/src/frontend/src/modals/NodeModal/index.tsx @@ -27,6 +27,7 @@ export default function NodeModal({ data }: { data: NodeDataType }) { }, 300); } } + // any to avoid type conflict const Icon: any = nodeIcons[types[data.type]]; return ( From 6ac10679a4bc37e85cd3f8a3acc05ee23b28bb75 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Thu, 22 Jun 2023 19:35:00 -0300 Subject: [PATCH 4/9] =?UTF-8?q?=F0=9F=8E=A8=20style(DisclosureComponent):?= =?UTF-8?q?=20replace=20ChevronRightIcon=20with=20ChevronRight=20from=20lu?= =?UTF-8?q?cide-react=20to=20improve=20consistency=20with=20other=20icons?= =?UTF-8?q?=20=F0=9F=8E=A8=20style(extraSidebarComponent):=20remove=20unus?= =?UTF-8?q?ed=20import=20of=20MagnifyingGlassIcon=20from=20heroicons-react?= =?UTF-8?q?/outline=20to=20improve=20code=20readability?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/FlowPage/components/DisclosureComponent/index.tsx | 3 ++- .../pages/FlowPage/components/extraSidebarComponent/index.tsx | 1 - 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx index 7f25d1fe1..3582a416b 100644 --- a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx @@ -1,6 +1,7 @@ import { ChevronRightIcon } from "@heroicons/react/24/solid"; import { Disclosure } from "@headlessui/react"; import { DisclosureComponentType } from "../../../../types/components"; +import { ChevronRight } from "lucide-react"; export default function DisclosureComponent({ button: { title, Icon, buttons = [] }, @@ -26,7 +27,7 @@ export default function DisclosureComponent({ ))}
- Date: Thu, 22 Jun 2023 22:43:21 -0300 Subject: [PATCH 5/9] =?UTF-8?q?=F0=9F=8E=A8=20style(frontend):=20replace?= =?UTF-8?q?=20heroicons=20with=20lucide-react=20icons=20for=20consistency?= =?UTF-8?q?=20and=20smaller=20bundle=20size=20=F0=9F=90=9B=20fix(chatMessa?= =?UTF-8?q?ge):=20replace=20ChatBubbleOvalLeftEllipsisIcon=20with=20Messag?= =?UTF-8?q?eCircle=20icon=20for=20consistency=20and=20better=20semantics?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 🎨 style(frontend): replace heroicons with lucide-react icons for consistency and better performance πŸ› fix(ApiModal): replace CodeBracketSquareIcon with Code2 icon for better semantics and consistency 🎨 style(frontend): replace heroicons with lucide-react icons for consistency and better design 🎨 style(genericModal/index.tsx): replace DocumentTextIcon with FileText icon from lucide-react library 🎨 style(importModal/buttonBox/index.tsx): remove unused imports 🎨 style(DisclosureComponent/index.tsx): replace ChevronRightIcon with ChevronRight icon from lucide-react library 🎨 style(extraSidebarComponent/index.tsx): replace Bars2Icon with Menu icon from lucide-react library πŸ”₯ chore(entities/index.ts): remove unused HomeIcon import from heroicons-react library --- .../components/singleAlertComponent/index.tsx | 41 +++++++++---------- .../src/alerts/alertDropDown/index.tsx | 8 ++-- src/frontend/src/alerts/error/index.tsx | 11 ++--- src/frontend/src/alerts/notice/index.tsx | 11 ++--- src/frontend/src/alerts/success/index.tsx | 13 +++--- .../ExtraSidebarComponent/index.tsx | 1 - .../chatComponent/chatMessage/index.tsx | 9 ++-- .../components/codeAreaComponent/index.tsx | 4 +- .../components/dropdownComponent/index.tsx | 24 ++++++----- .../components/menuBar/index.tsx | 8 ++++ .../src/components/headerComponent/index.tsx | 3 +- .../components/inputFileComponent/index.tsx | 4 +- .../components/inputListComponent/index.tsx | 7 ++-- .../src/components/promptComponent/index.tsx | 4 +- .../components/textAreaComponent/index.tsx | 5 ++- src/frontend/src/modals/ApiModal/index.tsx | 10 ++--- .../src/modals/EditNodeModal/index.tsx | 6 +-- src/frontend/src/modals/NodeModal/index.tsx | 4 +- .../src/modals/chatModal/chatInput/index.tsx | 15 +++---- .../modals/chatModal/chatMessage/index.tsx | 9 ++-- .../modals/chatModal/fileComponent/index.tsx | 8 ++-- src/frontend/src/modals/chatModal/index.tsx | 6 +-- .../src/modals/codeAreaModal/index.tsx | 9 ++-- src/frontend/src/modals/exportModal/index.tsx | 1 - .../src/modals/genericModal/index.tsx | 9 ++-- .../modals/importModal/buttonBox/index.tsx | 4 +- .../components/DisclosureComponent/index.tsx | 1 - .../extraSidebarComponent/index.tsx | 5 +-- src/frontend/src/types/entities/index.ts | 2 - 29 files changed, 124 insertions(+), 118 deletions(-) diff --git a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx index ad505e23e..99a869b53 100644 --- a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx @@ -1,13 +1,9 @@ -import { - XCircleIcon, - XMarkIcon, - InformationCircleIcon, - CheckCircleIcon, -} from "@heroicons/react/24/outline"; + 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, @@ -34,10 +30,11 @@ export default function SingleAlert({ key={dropItem.id} >
-

@@ -70,7 +67,7 @@ export default function SingleAlert({ className="inline-flex rounded-md bg-red-50 dark:bg-transparent p-1.5 text-red-500 dark:text-red-50" > Dismiss -

@@ -81,10 +78,11 @@ export default function SingleAlert({ key={dropItem.id} >
-

@@ -116,7 +114,7 @@ export default function SingleAlert({ className="inline-flex rounded-md bg-blue-50 dark:bg-transparent p-1.5 text-blue-500 dark:text-blue-50" > Dismiss -

@@ -127,10 +125,11 @@ export default function SingleAlert({ key={dropItem.id} >
-

@@ -150,7 +149,7 @@ export default function SingleAlert({ className="inline-flex rounded-md bg-green-50 dark:bg-transparent p-1.5 text-green-500 dark:text-green-50" > Dismiss -

diff --git a/src/frontend/src/alerts/alertDropDown/index.tsx b/src/frontend/src/alerts/alertDropDown/index.tsx index edd3bb23f..cb35b80cc 100644 --- a/src/frontend/src/alerts/alertDropDown/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/index.tsx @@ -1,11 +1,11 @@ import { useContext, useEffect, useRef } from "react"; import { alertContext } from "../../contexts/alertContext"; -import { XMarkIcon } from "@heroicons/react/24/solid"; -import { TrashIcon } from "@heroicons/react/24/outline"; 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); const componentRef = useRef(null); @@ -36,13 +36,13 @@ export default function AlertDropdown({}: AlertDropdownType) { setTimeout(clearNotificationList, 100); }} > - + diff --git a/src/frontend/src/alerts/error/index.tsx b/src/frontend/src/alerts/error/index.tsx index bcabe764f..56ae7634e 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 { XCircleIcon, XMarkIcon } from "@heroicons/react/24/outline"; import { useEffect, useState } from "react"; import { ErrorAlertType } from "../../types/alerts"; +import { XCircle } from "lucide-react"; export default function ErrorAlert({ title, @@ -43,10 +43,11 @@ export default function ErrorAlert({ >
-

diff --git a/src/frontend/src/alerts/notice/index.tsx b/src/frontend/src/alerts/notice/index.tsx index 81dce8ca0..47e26f51d 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 { InformationCircleIcon, XMarkIcon } from "@heroicons/react/24/outline"; 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, @@ -40,10 +40,11 @@ export default function NoticeAlert({ >
-

{title}

diff --git a/src/frontend/src/alerts/success/index.tsx b/src/frontend/src/alerts/success/index.tsx index d915adfcd..899f70f68 100644 --- a/src/frontend/src/alerts/success/index.tsx +++ b/src/frontend/src/alerts/success/index.tsx @@ -1,7 +1,8 @@ import { Transition } from "@headlessui/react"; -import { CheckCircleIcon, XMarkIcon } from "@heroicons/react/24/outline"; import { useEffect, useState } from "react"; import { SuccessAlertType } from "../../types/alerts"; +import { CheckCircle2 } from "lucide-react"; + export default function SuccessAlert({ title, @@ -38,10 +39,12 @@ export default function SuccessAlert({ >
-

diff --git a/src/frontend/src/components/ExtraSidebarComponent/index.tsx b/src/frontend/src/components/ExtraSidebarComponent/index.tsx index e03db68c8..b6fbf94b2 100644 --- a/src/frontend/src/components/ExtraSidebarComponent/index.tsx +++ b/src/frontend/src/components/ExtraSidebarComponent/index.tsx @@ -1,5 +1,4 @@ import { Disclosure } from "@headlessui/react"; -import { ChevronLeftIcon } from "@heroicons/react/24/outline"; import { useContext, useState } from "react"; import { Link } from "react-router-dom"; import { classNames } from "../../utils"; diff --git a/src/frontend/src/components/chatComponent/chatMessage/index.tsx b/src/frontend/src/components/chatComponent/chatMessage/index.tsx index 8ca2e56e3..ca67908c0 100644 --- a/src/frontend/src/components/chatComponent/chatMessage/index.tsx +++ b/src/frontend/src/components/chatComponent/chatMessage/index.tsx @@ -1,13 +1,10 @@ -import { - ChatBubbleLeftEllipsisIcon, - ChatBubbleOvalLeftEllipsisIcon, - PlusSmallIcon, -} from "@heroicons/react/24/outline"; + import { useState } from "react"; import { ChatMessageType } from "../../../types/chat"; import { nodeColors } from "../../../utils"; import Convert from "ansi-to-html"; const convert = new Convert({ newline: true }); +import { MessageCircle } from "lucide-react"; export default function ChatMessage({ chat }: { chat: ChatMessageType }) { const [hidden, setHidden] = useState(true); @@ -24,7 +21,7 @@ export default function ChatMessage({ chat }: { chat: ChatMessageType }) { onClick={() => setHidden((prev) => !prev)} className="absolute top-2 right-2 cursor-pointer" > - +

)} {chat.thought && chat.thought !== "" && !hidden && ( diff --git a/src/frontend/src/components/codeAreaComponent/index.tsx b/src/frontend/src/components/codeAreaComponent/index.tsx index 399ab40b2..7fe01ceb1 100644 --- a/src/frontend/src/components/codeAreaComponent/index.tsx +++ b/src/frontend/src/components/codeAreaComponent/index.tsx @@ -1,10 +1,10 @@ -import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; 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 { INPUT_STYLE } from "../../constants"; +import { ExternalLink } from "lucide-react"; export default function CodeAreaComponent({ value, @@ -69,7 +69,7 @@ export default function CodeAreaComponent({ }} > {!editNode && ( - + )}
diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx index 0f4942198..54049fd82 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 { ChevronUpDownIcon, CheckIcon } from "@heroicons/react/24/outline"; import { Fragment, useState } from "react"; import { DropDownComponentType } from "../../types/components"; import { classNames } from "../../utils"; import { INPUT_STYLE } from "../../constants"; +import { ChevronsUpDown, Check } from "lucide-react"; export default function Dropdown({ value, @@ -43,10 +43,11 @@ export default function Dropdown({ "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2" } > -
diff --git a/src/frontend/src/components/inputFileComponent/index.tsx b/src/frontend/src/components/inputFileComponent/index.tsx index 9f801138f..cb922a35e 100644 --- a/src/frontend/src/components/inputFileComponent/index.tsx +++ b/src/frontend/src/components/inputFileComponent/index.tsx @@ -1,8 +1,8 @@ -import { DocumentMagnifyingGlassIcon } from "@heroicons/react/24/outline"; import { useContext, useEffect, useState } from "react"; import { alertContext } from "../../contexts/alertContext"; import { FileComponentType } from "../../types/components"; import { INPUT_STYLE } from "../../constants"; +import { FileSearch2 } from "lucide-react"; export default function InputFileComponent({ value, @@ -89,7 +89,7 @@ export default function InputFileComponent({

diff --git a/src/frontend/src/components/inputListComponent/index.tsx b/src/frontend/src/components/inputListComponent/index.tsx index 4bb82147f..80a6de417 100644 --- a/src/frontend/src/components/inputListComponent/index.tsx +++ b/src/frontend/src/components/inputListComponent/index.tsx @@ -1,10 +1,11 @@ -import { PlusIcon, XMarkIcon } from "@heroicons/react/24/outline"; import { useContext, useEffect, useState } from "react"; import { InputListComponentType } from "../../types/components"; import { TabsContext } from "../../contexts/tabsContext"; import _ from "lodash"; import { INPUT_STYLE } from "../../constants"; +import { X, Plus } from "lucide-react"; + export default function InputListComponent({ value, onChange, @@ -59,7 +60,7 @@ export default function InputListComponent({ onChange(inputList); }} > - + ) : ( )}
diff --git a/src/frontend/src/components/promptComponent/index.tsx b/src/frontend/src/components/promptComponent/index.tsx index 7713da8e6..ef6bae94d 100644 --- a/src/frontend/src/components/promptComponent/index.tsx +++ b/src/frontend/src/components/promptComponent/index.tsx @@ -1,10 +1,10 @@ -import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { useContext, useEffect, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import { TextAreaComponentType } from "../../types/components"; import GenericModal from "../../modals/genericModal"; import { TypeModal } from "../../utils"; import { INPUT_STYLE } from "../../constants"; +import { ExternalLink } from "lucide-react"; export default function PromptAreaComponent({ value, @@ -74,7 +74,7 @@ export default function PromptAreaComponent({ }} > {!editNode && ( - + )} diff --git a/src/frontend/src/components/textAreaComponent/index.tsx b/src/frontend/src/components/textAreaComponent/index.tsx index 4c0412994..4b4cd1582 100644 --- a/src/frontend/src/components/textAreaComponent/index.tsx +++ b/src/frontend/src/components/textAreaComponent/index.tsx @@ -1,10 +1,11 @@ -import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { useContext, useEffect, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import { TextAreaComponentType } from "../../types/components"; import GenericModal from "../../modals/genericModal"; import { TypeModal } from "../../utils"; import { INPUT_STYLE } from "../../constants"; +import { ExternalLink } from "lucide-react"; + export default function TextAreaComponent({ value, onChange, @@ -76,7 +77,7 @@ export default function TextAreaComponent({ }} > {!editNode && ( - + )} diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index c3b821ac9..2d4bdad4e 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -1,4 +1,3 @@ -import { CodeBracketSquareIcon } from "@heroicons/react/24/outline"; import { useContext, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import "ace-builds/src-noconflict/mode-python"; @@ -26,7 +25,7 @@ import { TabsList, TabsTrigger, } from "../../components/ui/tabs"; -import { Check, Clipboard } from "lucide-react"; +import { Check, Clipboard, Code2 } from "lucide-react"; export default function ApiModal({ flow }: { flow: FlowType }) { const [open, setOpen] = useState(true); @@ -88,10 +87,11 @@ export default function ApiModal({ flow }: { flow: FlowType }) { Code - {EXPORT_CODE_DIALOG} diff --git a/src/frontend/src/modals/EditNodeModal/index.tsx b/src/frontend/src/modals/EditNodeModal/index.tsx index 1a270f46e..d0412d9cd 100644 --- a/src/frontend/src/modals/EditNodeModal/index.tsx +++ b/src/frontend/src/modals/EditNodeModal/index.tsx @@ -12,7 +12,6 @@ import { TableRow, } from "../../components/ui/table"; import ToggleShadComponent from "../../components/toggleShadComponent"; -import { VariableIcon } from "@heroicons/react/24/outline"; import InputListComponent from "../../components/inputListComponent"; import TextAreaComponent from "../../components/textAreaComponent"; import InputComponent from "../../components/inputComponent"; @@ -33,6 +32,7 @@ import { } from "../../components/ui/dialog"; 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); @@ -90,9 +90,7 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) { {data.node?.description}
- -   - + Parameters diff --git a/src/frontend/src/modals/NodeModal/index.tsx b/src/frontend/src/modals/NodeModal/index.tsx index 27255fd84..2065b1720 100644 --- a/src/frontend/src/modals/NodeModal/index.tsx +++ b/src/frontend/src/modals/NodeModal/index.tsx @@ -1,5 +1,4 @@ import { Dialog, Transition } from "@headlessui/react"; -import { XMarkIcon } from "@heroicons/react/24/outline"; import { Fragment, useContext, useRef, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import { NodeDataType } from "../../types/flow"; @@ -13,6 +12,7 @@ import { } 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); @@ -70,7 +70,7 @@ export default function NodeModal({ data }: { data: NodeDataType }) { }} > Close -
diff --git a/src/frontend/src/modals/chatModal/chatInput/index.tsx b/src/frontend/src/modals/chatModal/chatInput/index.tsx index a6598bc67..e43114ff1 100644 --- a/src/frontend/src/modals/chatModal/chatInput/index.tsx +++ b/src/frontend/src/modals/chatModal/chatInput/index.tsx @@ -1,8 +1,9 @@ -import { LockClosedIcon, PaperAirplaneIcon } from "@heroicons/react/24/outline"; import { classNames } from "../../../utils"; import { useContext, useEffect, useRef, useState } from "react"; import { TabsContext } from "../../../contexts/tabsContext"; import { INPUT_STYLE } from "../../../constants"; +import { Lock, Send } from "lucide-react"; + export default function ChatInput({ lockChat, chatValue, @@ -60,14 +61,14 @@ export default function ChatInput({
diff --git a/src/frontend/src/modals/chatModal/chatMessage/index.tsx b/src/frontend/src/modals/chatModal/chatMessage/index.tsx index 318edc376..de8953a6e 100644 --- a/src/frontend/src/modals/chatModal/chatMessage/index.tsx +++ b/src/frontend/src/modals/chatModal/chatMessage/index.tsx @@ -1,10 +1,8 @@ -import { ChatBubbleOvalLeftEllipsisIcon } from "@heroicons/react/24/outline"; 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 { UserIcon } from "@heroicons/react/24/solid"; import FileCard from "../fileComponent"; import ReactMarkdown from "react-markdown"; import rehypeMathjax from "rehype-mathjax"; @@ -12,6 +10,7 @@ import remarkGfm from "remark-gfm"; import remarkMath from "remark-math"; import { CodeBlock } from "./codeBlock"; import Convert from "ansi-to-html"; +import { User2, MessageCircle } from "lucide-react"; export default function ChatMessage({ chat, @@ -62,7 +61,7 @@ export default function ChatMessage({
)} {chat.isSend && ( - + )}
{!chat.isSend ? ( @@ -73,7 +72,9 @@ export default function ChatMessage({ onClick={() => setHidden((prev) => !prev)} className="absolute -top-1 -left-2 cursor-pointer" > - + )} {chat.thought && chat.thought !== "" && !hidden && ( diff --git a/src/frontend/src/modals/chatModal/fileComponent/index.tsx b/src/frontend/src/modals/chatModal/fileComponent/index.tsx index 2b5d97ae9..1c152b5fd 100644 --- a/src/frontend/src/modals/chatModal/fileComponent/index.tsx +++ b/src/frontend/src/modals/chatModal/fileComponent/index.tsx @@ -1,6 +1,6 @@ -import { CloudArrowDownIcon, DocumentIcon } from "@heroicons/react/24/outline"; import * as base64js from "base64-js"; import { useState } from "react"; +import { DownloadCloud, File } from "lucide-react"; export default function FileCard({ fileName, content, fileType }) { const handleDownload = () => { @@ -43,7 +43,7 @@ export default function FileCard({ fileName, content, fileType }) { className="text-gray-500 py-1 px-2 dark:bg-gray-700 dark:text-gray-300" onClick={handleDownload} > - + )} @@ -65,14 +65,14 @@ export default function FileCard({ fileName, content, fileType }) { className="w-8 h-8" /> ) : ( - + )}
{" "}
{fileName}
{fileType}
- + ); diff --git a/src/frontend/src/modals/chatModal/index.tsx b/src/frontend/src/modals/chatModal/index.tsx index bf87e4100..98b0e4b2d 100644 --- a/src/frontend/src/modals/chatModal/index.tsx +++ b/src/frontend/src/modals/chatModal/index.tsx @@ -1,13 +1,11 @@ import { Dialog, Transition } from "@headlessui/react"; -import { ChatBubbleOvalLeftEllipsisIcon } from "@heroicons/react/24/outline"; 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 { Eraser } from "lucide-react"; -import { X } from "lucide-react"; +import { X, MessagesSquare, Eraser } from "lucide-react"; import { sendAllProps } from "../../types/api"; import { ChatMessageType } from "../../types/chat"; import ChatInput from "./chatInput"; @@ -387,7 +385,7 @@ export default function ChatModal({ Start a conversation and click the agent’s thoughts{" "} - + {" "} to inspect the chaining process. diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index 9f8815f4b..7c8c6f135 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -1,4 +1,3 @@ -import { XMarkIcon, CommandLineIcon } from "@heroicons/react/24/outline"; import { Fragment, useContext, useRef, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import AceEditor from "react-ace"; @@ -22,6 +21,7 @@ import { } from "../../components/ui/dialog"; import { Button } from "../../components/ui/button"; import { CODE_PROMPT_DIALOG_SUBTITLE } from "../../constants"; +import { TerminalSquare } from "lucide-react"; export default function CodeAreaModal({ value, @@ -51,10 +51,11 @@ export default function CodeAreaModal({ Edit Code - {CODE_PROMPT_DIALOG_SUBTITLE} diff --git a/src/frontend/src/modals/exportModal/index.tsx b/src/frontend/src/modals/exportModal/index.tsx index 30567b4f1..df5925817 100644 --- a/src/frontend/src/modals/exportModal/index.tsx +++ b/src/frontend/src/modals/exportModal/index.tsx @@ -1,4 +1,3 @@ -import { ArrowDownTrayIcon } from "@heroicons/react/24/outline"; import { useContext, useRef, useState } from "react"; import { alertContext } from "../../contexts/alertContext"; import { PopUpContext } from "../../contexts/popUpContext"; diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx index d241e7c04..f12f21b27 100644 --- a/src/frontend/src/modals/genericModal/index.tsx +++ b/src/frontend/src/modals/genericModal/index.tsx @@ -1,4 +1,3 @@ -import { XMarkIcon, DocumentTextIcon } from "@heroicons/react/24/outline"; import { Fragment, useContext, useRef, useState } from "react"; import { PopUpContext } from "../../contexts/popUpContext"; import { darkContext } from "../../contexts/darkContext"; @@ -17,6 +16,7 @@ import { import { Button } from "../../components/ui/button"; import { Textarea } from "../../components/ui/textarea"; import { PROMPT_DIALOG_SUBTITLE, TEXT_DIALOG_SUBTITLE } from "../../constants"; +import { FileText } from "lucide-react"; export default function GenericModal({ value, @@ -54,10 +54,11 @@ export default function GenericModal({ {myModalTitle} - {(() => { diff --git a/src/frontend/src/modals/importModal/buttonBox/index.tsx b/src/frontend/src/modals/importModal/buttonBox/index.tsx index 2c408a120..5b7a42b48 100644 --- a/src/frontend/src/modals/importModal/buttonBox/index.tsx +++ b/src/frontend/src/modals/importModal/buttonBox/index.tsx @@ -1,7 +1,5 @@ -import React, { ReactNode, useEffect, useRef, useState } from "react"; -import { DocumentDuplicateIcon } from "@heroicons/react/solid"; +import React, { ReactNode } from "react"; import { classNames } from "../../../utils"; -import Tooltip from "../../../components/TooltipComponent"; export default function ButtonBox({ onClick, diff --git a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx index 3582a416b..915e22476 100644 --- a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx @@ -1,4 +1,3 @@ -import { ChevronRightIcon } from "@heroicons/react/24/solid"; import { Disclosure } from "@headlessui/react"; import { DisclosureComponentType } from "../../../../types/components"; import { ChevronRight } from "lucide-react"; diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx index 46a48197c..b144ae77e 100644 --- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx @@ -1,4 +1,3 @@ -import { Bars2Icon } from "@heroicons/react/24/outline"; import DisclosureComponent from "../DisclosureComponent"; import { classNames, @@ -16,9 +15,9 @@ import ExportModal from "../../../../modals/exportModal"; import ApiModal from "../../../../modals/ApiModal"; import { TabsContext } from "../../../../contexts/tabsContext"; import { alertContext } from "../../../../contexts/alertContext"; -import { updateFlowInDatabase } from "../../../../controllers/API"; import { INPUT_STYLE } from "../../../../constants"; import { Separator } from "../../../../components/ui/separator"; +import { Menu } from "lucide-react"; export default function ExtraSidebar() { const { data } = useContext(typesContext); @@ -186,7 +185,7 @@ export default function ExtraSidebar() { {t} - + diff --git a/src/frontend/src/types/entities/index.ts b/src/frontend/src/types/entities/index.ts index 3c0877579..3730492ce 100644 --- a/src/frontend/src/types/entities/index.ts +++ b/src/frontend/src/types/entities/index.ts @@ -1,5 +1,3 @@ -import { HomeIcon } from "@heroicons/react/24/outline"; - export type sidebarNavigationItemType = { name: string; href: string; From 198b2c6c75f50fe5435a6e30b8782244f45b641d Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Thu, 22 Jun 2023 22:47:37 -0300 Subject: [PATCH 6/9] =?UTF-8?q?=F0=9F=90=9B=20fix(chatMessage):=20remove?= =?UTF-8?q?=20unnecessary=20text-sm=20class=20from=20message=20sender=20na?= =?UTF-8?q?me=20to=20improve=20readability?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/src/modals/chatModal/chatMessage/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/src/modals/chatModal/chatMessage/index.tsx b/src/frontend/src/modals/chatModal/chatMessage/index.tsx index de8953a6e..bb404aa6a 100644 --- a/src/frontend/src/modals/chatModal/chatMessage/index.tsx +++ b/src/frontend/src/modals/chatModal/chatMessage/index.tsx @@ -153,7 +153,7 @@ export default function ChatMessage({ ) : (
-
+
Date: Thu, 22 Jun 2023 22:49:42 -0300 Subject: [PATCH 7/9] =?UTF-8?q?=F0=9F=94=A7=20chore(frontend):=20fix=20for?= =?UTF-8?q?matting=20issues=20in=20multiple=20files=20=F0=9F=9A=80=20feat(?= =?UTF-8?q?frontend):=20add=20hover=20effect=20to=20file=20search=20icon?= =?UTF-8?q?=20in=20InputFileComponent=20=F0=9F=9A=80=20feat(frontend):=20a?= =?UTF-8?q?dd=20support=20for=20dark=20mode=20in=20alert=20icons=20?= =?UTF-8?q?=F0=9F=9A=80=20feat(frontend):=20add=20support=20for=20dark=20m?= =?UTF-8?q?ode=20in=20dropdown=20chevron=20icon=20=F0=9F=9A=80=20feat(fron?= =?UTF-8?q?tend):=20add=20support=20for=20dark=20mode=20in=20success=20ale?= =?UTF-8?q?rt=20icon=20=F0=9F=9A=80=20feat(frontend):=20add=20support=20fo?= =?UTF-8?q?r=20dark=20mode=20in=20notice=20alert=20icon=20=F0=9F=9A=80=20f?= =?UTF-8?q?eat(frontend):=20add=20support=20for=20dark=20mode=20in=20error?= =?UTF-8?q?=20alert=20icon=20=F0=9F=9A=80=20feat(frontend):=20add=20suppor?= =?UTF-8?q?t=20for=20process.env.PORT=20environment=20variable=20to=20be?= =?UTF-8?q?=20able=20to=20run=20app=20on=20a=20configurable=20port=20?= =?UTF-8?q?=F0=9F=9A=80=20feat(frontend):=20add=20parameter=20types=20to?= =?UTF-8?q?=20GenericNode=20component=20=F0=9F=9A=80=20feat(frontend):=20a?= =?UTF-8?q?dd=20hover=20effect=20to=20external=20link=20icon=20in=20CodeAr?= =?UTF-8?q?eaComponent=20=F0=9F=9A=80=20feat(frontend):=20add=20hover=20ef?= =?UTF-8?q?fect=20to=20plus=20icon=20in=20MenuBar=20component=20?= =?UTF-8?q?=F0=9F=9A=80=20feat(frontend):=20add=20hover=20effect=20to=20se?= =?UTF-8?q?ttings=20icon=20in=20MenuBar=20component=20=F0=9F=9A=80=20feat(?= =?UTF-8?q?frontend):=20add=20hover=20effect=20to=20undo=20icon=20in=20Men?= =?UTF-8?q?uBar=20component=20=F0=9F=9A=80=20feat(frontend):=20add=20hover?= =?UTF-8?q?=20effect=20to=20redo=20icon=20in=20MenuBar=20component?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 🎨 style(inputListComponent): add space before self-closing tag to improve readability 🎨 style(promptComponent): add space before self-closing tag to improve readability 🎨 style(ApiModal): fix indentation to improve readability 🎨 style(chatInput): add space before self-closing tag to improve readability 🎨 style(chatMessage): remove unnecessary line breaks to improve readability 🎨 style(fileComponent): add space before self-closing tag to improve readability 🎨 style(chatModal): remove unnecessary line breaks to improve readability 🎨 style(codeAreaModal): fix indentation to improve readability 🎨 style(genericModal): fix indentation to improve readability 🎨 style(DisclosureComponent): add space before self-closing tag to improve readability 🎨 style(extraSidebarComponent): fix indentation to improve readability --- .../src/CustomNodes/GenericNode/index.tsx | 11 +++++++- .../components/singleAlertComponent/index.tsx | 28 ++++++++----------- .../src/alerts/alertDropDown/index.tsx | 4 +-- src/frontend/src/alerts/error/index.tsx | 9 +++--- src/frontend/src/alerts/notice/index.tsx | 9 +++--- src/frontend/src/alerts/success/index.tsx | 11 +++----- .../chatComponent/chatMessage/index.tsx | 1 - .../components/codeAreaComponent/index.tsx | 2 +- .../components/dropdownComponent/index.tsx | 22 +++++++-------- .../components/menuBar/index.tsx | 12 +++----- .../components/inputFileComponent/index.tsx | 4 +-- .../components/inputListComponent/index.tsx | 2 +- .../src/components/promptComponent/index.tsx | 2 +- src/frontend/src/modals/ApiModal/index.tsx | 7 ++--- .../src/modals/chatModal/chatInput/index.tsx | 12 ++++---- .../modals/chatModal/chatMessage/index.tsx | 4 +-- .../modals/chatModal/fileComponent/index.tsx | 4 +-- src/frontend/src/modals/chatModal/index.tsx | 2 +- .../src/modals/codeAreaModal/index.tsx | 5 ++-- .../src/modals/genericModal/index.tsx | 5 ++-- .../components/DisclosureComponent/index.tsx | 2 +- .../extraSidebarComponent/index.tsx | 4 +-- 22 files changed, 74 insertions(+), 88 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index 6252e3772..b507b0cf3 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -6,7 +6,16 @@ import { } from "../../utils"; import ParameterComponent from "./components/parameterComponent"; import { typesContext } from "../../contexts/typesContext"; -import { useContext, useState, useEffect, useRef, ForwardRefExoticComponent, ComponentType, SVGProps, ReactNode } from "react"; +import { + useContext, + useState, + useEffect, + useRef, + ForwardRefExoticComponent, + ComponentType, + SVGProps, + ReactNode, +} from "react"; import { NodeDataType } from "../../types/flow"; import { alertContext } from "../../contexts/alertContext"; import { PopUpContext } from "../../contexts/popUpContext"; diff --git a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx index 99a869b53..0eaf0cf5a 100644 --- a/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/components/singleAlertComponent/index.tsx @@ -1,4 +1,3 @@ - import { Link } from "react-router-dom"; import { Transition } from "@headlessui/react"; import { useState } from "react"; @@ -30,11 +29,10 @@ export default function SingleAlert({ key={dropItem.id} >
-

@@ -78,11 +76,10 @@ export default function SingleAlert({ key={dropItem.id} >
-

@@ -125,11 +122,10 @@ export default function SingleAlert({ key={dropItem.id} >

-

diff --git a/src/frontend/src/alerts/alertDropDown/index.tsx b/src/frontend/src/alerts/alertDropDown/index.tsx index cb35b80cc..78d9c8553 100644 --- a/src/frontend/src/alerts/alertDropDown/index.tsx +++ b/src/frontend/src/alerts/alertDropDown/index.tsx @@ -4,7 +4,7 @@ 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"; +import { X, Trash2 } from "lucide-react"; export default function AlertDropdown({}: AlertDropdownType) { const { closePopUp } = useContext(PopUpContext); @@ -36,7 +36,7 @@ export default function AlertDropdown({}: AlertDropdownType) { setTimeout(clearNotificationList, 100); }} > - +

diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx index 54049fd82..3334735a2 100644 --- a/src/frontend/src/components/dropdownComponent/index.tsx +++ b/src/frontend/src/components/dropdownComponent/index.tsx @@ -43,11 +43,10 @@ export default function Dropdown({ "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2" } > -

diff --git a/src/frontend/src/components/inputListComponent/index.tsx b/src/frontend/src/components/inputListComponent/index.tsx index 80a6de417..951d7a7ed 100644 --- a/src/frontend/src/components/inputListComponent/index.tsx +++ b/src/frontend/src/components/inputListComponent/index.tsx @@ -60,7 +60,7 @@ export default function InputListComponent({ onChange(inputList); }} > - + ) : (
diff --git a/src/frontend/src/modals/ApiModal/index.tsx b/src/frontend/src/modals/ApiModal/index.tsx index 2d4bdad4e..17c90548f 100644 --- a/src/frontend/src/modals/ApiModal/index.tsx +++ b/src/frontend/src/modals/ApiModal/index.tsx @@ -87,11 +87,10 @@ export default function ApiModal({ flow }: { flow: FlowType }) { Code - {EXPORT_CODE_DIALOG} diff --git a/src/frontend/src/modals/chatModal/chatInput/index.tsx b/src/frontend/src/modals/chatModal/chatInput/index.tsx index e43114ff1..69d382748 100644 --- a/src/frontend/src/modals/chatModal/chatInput/index.tsx +++ b/src/frontend/src/modals/chatModal/chatInput/index.tsx @@ -61,14 +61,14 @@ export default function ChatInput({
diff --git a/src/frontend/src/modals/chatModal/chatMessage/index.tsx b/src/frontend/src/modals/chatModal/chatMessage/index.tsx index bb404aa6a..3d4ce0b44 100644 --- a/src/frontend/src/modals/chatModal/chatMessage/index.tsx +++ b/src/frontend/src/modals/chatModal/chatMessage/index.tsx @@ -72,9 +72,7 @@ export default function ChatMessage({ onClick={() => setHidden((prev) => !prev)} className="absolute -top-1 -left-2 cursor-pointer" > - +
)} {chat.thought && chat.thought !== "" && !hidden && ( diff --git a/src/frontend/src/modals/chatModal/fileComponent/index.tsx b/src/frontend/src/modals/chatModal/fileComponent/index.tsx index 1c152b5fd..0807cd80c 100644 --- a/src/frontend/src/modals/chatModal/fileComponent/index.tsx +++ b/src/frontend/src/modals/chatModal/fileComponent/index.tsx @@ -43,7 +43,7 @@ export default function FileCard({ fileName, content, fileType }) { className="text-gray-500 py-1 px-2 dark:bg-gray-700 dark:text-gray-300" onClick={handleDownload} > - +
)} @@ -72,7 +72,7 @@ export default function FileCard({ fileName, content, fileType }) {
{fileName}
{fileType}
- + ); diff --git a/src/frontend/src/modals/chatModal/index.tsx b/src/frontend/src/modals/chatModal/index.tsx index 98b0e4b2d..6b1744857 100644 --- a/src/frontend/src/modals/chatModal/index.tsx +++ b/src/frontend/src/modals/chatModal/index.tsx @@ -385,7 +385,7 @@ export default function ChatModal({ Start a conversation and click the agent’s thoughts{" "} - + {" "} to inspect the chaining process. diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index 7c8c6f135..f6e4b8e1c 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -52,10 +52,9 @@ export default function CodeAreaModal({ Edit Code {CODE_PROMPT_DIALOG_SUBTITLE} diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx index f12f21b27..6f89e24a6 100644 --- a/src/frontend/src/modals/genericModal/index.tsx +++ b/src/frontend/src/modals/genericModal/index.tsx @@ -55,10 +55,9 @@ export default function GenericModal({ {myModalTitle} {(() => { diff --git a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx index 915e22476..6d9f485e8 100644 --- a/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx @@ -26,7 +26,7 @@ export default function DisclosureComponent({ ))}
- {t} - +
From 3b20a40af87b5af03360e633bb1efd51222c28ec Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Fri, 23 Jun 2023 18:08:16 -0300 Subject: [PATCH 8/9] Formatting code --- src/frontend/src/CustomNodes/GenericNode/index.tsx | 9 +++++++-- src/frontend/src/components/dropdownComponent/index.tsx | 6 +++--- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index e2d254121..1668b1d4e 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -104,8 +104,13 @@ export default function GenericNode({ }} />
- -
{data.node.display_name}
+ +
+ {data.node.display_name} +
diff --git a/src/frontend/src/components/dropdownComponent/index.tsx b/src/frontend/src/components/dropdownComponent/index.tsx index d32506bdc..522078629 100644 --- a/src/frontend/src/components/dropdownComponent/index.tsx +++ b/src/frontend/src/components/dropdownComponent/index.tsx @@ -15,9 +15,9 @@ export default function Dropdown({ let [internalValue, setInternalValue] = useState( value === "" || !value ? "Choose an option" : value ); - useEffect(()=>{ - setInternalValue(value === "" || !value ? "Choose an option" : value) - },[value]) + useEffect(() => { + setInternalValue(value === "" || !value ? "Choose an option" : value); + }, [value]); return ( <> From f0476e20df1afe75f9b823270220b9ee5eaa5377 Mon Sep 17 00:00:00 2001 From: Cristhian Zanforlin Lousa Date: Fri, 23 Jun 2023 18:30:35 -0300 Subject: [PATCH 9/9] =?UTF-8?q?=F0=9F=8E=A8=20style(inputFileComponent):?= =?UTF-8?q?=20reduce=20size=20of=20FileSearch2=20icon=20to=20improve=20UI?= =?UTF-8?q?=20aesthetics?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/src/components/inputFileComponent/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/src/components/inputFileComponent/index.tsx b/src/frontend/src/components/inputFileComponent/index.tsx index 488f2befb..7b0325156 100644 --- a/src/frontend/src/components/inputFileComponent/index.tsx +++ b/src/frontend/src/components/inputFileComponent/index.tsx @@ -114,7 +114,7 @@ export default function InputFileComponent({