diff --git a/src/frontend/src/components/genericIconComponent/index.tsx b/src/frontend/src/components/genericIconComponent/index.tsx index c875224fe..5c462add8 100644 --- a/src/frontend/src/components/genericIconComponent/index.tsx +++ b/src/frontend/src/components/genericIconComponent/index.tsx @@ -1,8 +1,15 @@ -import { IconComponentProps, SvgIconProps } from "../../types/components"; -import { svgIcons } from "../../utils"; +import { IconComponentProps, IconProps } from "../../types/components"; +import { nodeIconsLucide, svgIcons } from "../../utils"; -export function IconFromSvg({ name }: SvgIconProps): JSX.Element { - const TargetSvg = svgIcons[name] +export function IconFromLucide({ name }: IconProps): JSX.Element { + const TargetIcon = nodeIconsLucide[name]; + return ( + + ); +} + +export function IconFromSvg({ name }: IconProps): JSX.Element { + const TargetSvg = svgIcons[name]; return ( ); @@ -12,5 +19,9 @@ export default function IconComponent({ method, name }: IconComponentProps): JSX switch (method) { case 'SVG': return + case 'LUCIDE': + return + default: + return } } diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 3b0416a6d..9acf69714 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -162,7 +162,7 @@ export interface IVarHighlightType { name: string; } -export type SvgIconProps = { +export type IconProps = { name: string; } diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts index 5c441bce2..b7e3895ed 100644 --- a/src/frontend/src/utils.ts +++ b/src/frontend/src/utils.ts @@ -96,7 +96,7 @@ export const svgIcons = { Airbyte: SvgAirbyte, Anthropic: SvgAnthropicBox, Bing: SvgBing, - ChromaIcon: SvgChroma, + Chroma: SvgChroma, Cohere: SvgCohere, Evernote: SvgEvernoteIcon, FacebookMessenger: SvgFacebookMessengerLogo2020, @@ -215,161 +215,57 @@ export const nodeNames: { [char: string]: string } = { unknown: "Unknown", }; -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: HuggingFaceIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - HuggingFaceEmbeddings: HuggingFaceIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - IFixitLoader: IFixIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - Meta: MetaIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - Midjorney: MidjourneyIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - MongoDBAtlasVectorSearch: MongoDBIcon 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> - >, - Pinecone: PineconeIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - Qdrant: QDrantIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - Searx: SearxIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - SlackDirectoryLoader: SlackIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - SupabaseVectorStore: SupabaseIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - VertexAI: VertexAIIcon as React.ForwardRefExoticComponent< - ComponentType> - >, - ChatVertexAI: VertexAIIcon 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> - >, - output_parsers: Compass as React.ForwardRefExoticComponent< - ComponentType> - >, - retrievers: FileSearch as React.ForwardRefExoticComponent< - ComponentType> - >, - unknown: HelpCircle as React.ForwardRefExoticComponent< - ComponentType> - >, +export const nodeIconsLucide = { + Chroma: ChromaIcon, + AirbyteJSONLoader: AirbyteIcon, + Anthropic: AnthropicIcon, + ChatAnthropic: AnthropicIcon, + BingSearchAPIWrapper: BingIcon, + BingSearchRun: BingIcon, + Cohere: CohereIcon, + CohereEmbeddings: CohereIcon, + EverNoteLoader: EvernoteIcon, + FacebookChatLoader: FBIcon, + GitbookLoader: GitBookIcon, + GoogleSearchAPIWrapper: GoogleIcon, + GoogleSearchResults: GoogleIcon, + GoogleSearchRun: GoogleIcon, + HNLoader: HackerNewsIcon, + HuggingFaceHub: HuggingFaceIcon, + HuggingFaceEmbeddings: HuggingFaceIcon, + IFixitLoader: IFixIcon, + Meta: MetaIcon, + Midjorney: MidjourneyIcon, + MongoDBAtlasVectorSearch: MongoDBIcon, + NotionDirectoryLoader: NotionIcon, + ChatOpenAI: OpenAiIcon, + OpenAI: OpenAiIcon, + OpenAIEmbeddings: OpenAiIcon, + Pinecone: PineconeIcon, + Qdrant: QDrantIcon, + Searx: SearxIcon, + SlackDirectoryLoader: SlackIcon, + SupabaseVectorStore: SupabaseIcon, + VertexAI: VertexAIIcon, + ChatVertexAI: VertexAIIcon, + agents: Rocket, + chains: Link, + memories: Cpu, + llms: Lightbulb, + prompts: TerminalSquare, + tools: Wrench, + advanced: Laptop2, + chat: MessageCircle, + embeddings: Fingerprint, + documentloaders: Paperclip, + vectorstores: Layers, + toolkits: Hammer, + textsplitters: Scissors, + wrappers: Gift, + utilities: Wand2, + output_parsers: Compass, + retrievers: FileSearch, + unknown: HelpCircle, }; export const gradients = [