diff --git a/frontend/control-center/src/actions/streams/index.ts b/frontend/control-center/src/actions/streams/index.ts index 2813ef3e8d..20f6e4d350 100644 --- a/frontend/control-center/src/actions/streams/index.ts +++ b/frontend/control-center/src/actions/streams/index.ts @@ -70,7 +70,6 @@ export const getTopicInfo = (topicName: string) => async (dispatch: Dispatch async (dispatch: Dispatch) => { return getData('schemas.list').then(response => { - console.log(response); dispatch(setTopicSchemasAction(response)); return Promise.resolve(true); }); diff --git a/frontend/control-center/src/components/ChannelAvatar/index.tsx b/frontend/control-center/src/components/ChannelAvatar/index.tsx index 6894e2c241..5e2c45464c 100644 --- a/frontend/control-center/src/components/ChannelAvatar/index.tsx +++ b/frontend/control-center/src/components/ChannelAvatar/index.tsx @@ -23,11 +23,15 @@ import {ReactComponent as MetaAvatar} from 'assets/images/icons/meta.svg'; import {ReactComponent as OpenaiAvatar} from 'assets/images/icons/openai.svg'; import {ReactComponent as PineconeAvatar} from 'assets/images/icons/pinecone.svg'; import {ReactComponent as ChromaAvatar} from 'assets/images/icons/chroma.svg'; -import {ReactComponent as MosaicAvatar} from 'assets/images/icons/mosaic.svg'; import {ReactComponent as WeaviateAvatar} from 'assets/images/icons/weaviate.svg'; import {ReactComponent as GmailAvatar} from 'assets/images/icons/gmail.svg'; import {ReactComponent as SlackAvatar} from 'assets/images/icons/slack.svg'; import {ReactComponent as FlinkAvatar} from 'assets/images/icons/flink.svg'; +import {ReactComponent as AnthropicAvatar} from 'assets/images/icons/anthropic.svg'; +import {ReactComponent as MistralAvatar} from 'assets/images/icons/mistral-ai.svg'; +import {ReactComponent as GoogleAIAvatar} from 'assets/images/icons/google-ai.svg'; +import {ReactComponent as GroqAvatar} from 'assets/images/icons/groq.svg'; +import {ReactComponent as AWSBedrockAvatar} from 'assets/images/icons/aws.svg'; import {Channel, Source} from 'model'; import styles from './index.module.scss'; @@ -114,30 +118,37 @@ export const getChannelAvatar = (source: string) => { case 'FAISS connector': return ; case Source.llama2: - case 'LLama2': + case 'Llama2': return ; case Source.openaiConnector: - case 'OpenAI connector': + case 'OpenAI': return ; case Source.pineconeConnector: - case 'Pinecone connector': + case 'Pinecone': return ; case Source.chroma: case 'Chroma': return ; - case Source.mosaic: - case 'Mosaic': - return ; case Source.weaviate: case 'Weaviate': return ; case Source.gmail: - case 'GMail connector': + case 'Gmail': return ; - case 'Slack connector': + case 'Slack': return ; - case 'Flink connector': + case 'Flink': return ; + case 'Anthropic': + return ; + case 'Mistral AI': + return ; + case 'Google AI Studio': + return ; + case 'groq': + return ; + case 'AWS Bedrock': + return ; default: return ; diff --git a/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.module.scss b/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.module.scss index 6edffe1583..ab1ed99112 100644 --- a/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.module.scss +++ b/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.module.scss @@ -14,3 +14,15 @@ height: 80px; margin-right: 24px; } + +.dropdownTitle { + font-family: 'Lato', sans-serif; + font-size: 14px; + font-weight: bold; + display: flex; + color: var(--color-text-contrast); + height: 20px; + display: flex; + align-items: center; + margin-bottom: 4px; +} diff --git a/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.tsx b/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.tsx index 697c299254..fb8e01f473 100644 --- a/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.tsx +++ b/frontend/control-center/src/pages/Connectors/ConfigureConnector/SetConfigInputs/SetConfigInputs.tsx @@ -1,4 +1,4 @@ -import {Input} from 'components'; +import {Dropdown, Input} from 'components'; import {Source} from 'model'; import React, {Dispatch, SetStateAction, useEffect, useState} from 'react'; import {useTranslation} from 'react-i18next'; @@ -59,26 +59,44 @@ export const SetConfigInputs = (props: SetConfigInputsProps) => { const sensitive = label.includes('Token') || label.includes('Password') || label.includes('Secret'); const placeholder = source === 'rasa' ? t(`rasaPlaceholder`) : hasSteps ? stepPlaceholder : defaultPlaceholder; - inputArr.push( -
- ) => setInput({...input, [keyTyped]: e.target.value})} - label={label} - placeholder={placeholder} - showLabelIcon - tooltipText={t(`inputTooltip${capitalSource}${toolTip}`)} - required={valueTyped !== 'optionalString'} - height={32} - fontClass="font-base" - /> -
- ); + if (configurationValues[key].split('/')[0] === 'dropdown') { + const dropdownOptions = configurationValues[key].replace('dropdown/', '').split('/'); + const [option, setOption] = useState(dropdownOptions[0]); + inputArr.push( +
+
{key}
+ { + setOption(option); + }} + /> +
+ ); + } else { + inputArr.push( +
+ ) => setInput({...input, [keyTyped]: e.target.value})} + label={label} + placeholder={placeholder} + showLabelIcon + tooltipText={t(`inputTooltip${capitalSource}${toolTip}`)} + required={valueTyped !== 'optionalString'} + height={32} + fontClass="font-base" + /> +
+ ); + } }); return ( diff --git a/frontend/control-center/src/pages/Schemas/SchemaItem/SchemaDescription/EnrichedSchemaSection/index.tsx b/frontend/control-center/src/pages/Schemas/SchemaItem/SchemaDescription/EnrichedSchemaSection/index.tsx index 7811f24b5c..119562d275 100644 --- a/frontend/control-center/src/pages/Schemas/SchemaItem/SchemaDescription/EnrichedSchemaSection/index.tsx +++ b/frontend/control-center/src/pages/Schemas/SchemaItem/SchemaDescription/EnrichedSchemaSection/index.tsx @@ -114,7 +114,6 @@ const EnrichedSchemaSection = (props: EnrichedSchemaSectionProps) => { // Use map to create an array of promises const promises = (enrichedCode.fields || []).map(async field => { - console.log(typeof field.type); if (typeof field.type === 'object' && !Array.isArray(field.type)) { if (!field.type.doc) { const doc = await generateDocForField(field); diff --git a/lib/typescript/assets/images/icons/anthropic.svg b/lib/typescript/assets/images/icons/anthropic.svg new file mode 100644 index 0000000000..7b39cc4316 --- /dev/null +++ b/lib/typescript/assets/images/icons/anthropic.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/lib/typescript/assets/images/icons/aws.svg b/lib/typescript/assets/images/icons/aws.svg new file mode 100644 index 0000000000..48c3fb20c9 --- /dev/null +++ b/lib/typescript/assets/images/icons/aws.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/lib/typescript/assets/images/icons/google-ai.svg b/lib/typescript/assets/images/icons/google-ai.svg new file mode 100644 index 0000000000..161b07526c --- /dev/null +++ b/lib/typescript/assets/images/icons/google-ai.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/lib/typescript/assets/images/icons/groq.svg b/lib/typescript/assets/images/icons/groq.svg new file mode 100644 index 0000000000..205fb3bc40 --- /dev/null +++ b/lib/typescript/assets/images/icons/groq.svg @@ -0,0 +1,38 @@ + + + groq_logo + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/lib/typescript/assets/images/icons/mistral-ai.svg b/lib/typescript/assets/images/icons/mistral-ai.svg new file mode 100644 index 0000000000..3e2d053f4c --- /dev/null +++ b/lib/typescript/assets/images/icons/mistral-ai.svg @@ -0,0 +1,32 @@ + + + Mistral AI + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/lib/typescript/translations/translations.ts b/lib/typescript/translations/translations.ts index 938f8780d1..4448ff5f04 100644 --- a/lib/typescript/translations/translations.ts +++ b/lib/typescript/translations/translations.ts @@ -18,7 +18,23 @@ const resources = { 'Weaviate is an open-source vector database that allows storing object and vector embeddings from various ML-models.', openaiDescription: 'The OpenAI connector is a bidirectional connector that connects Airy to the OpenAI LLM.', gmailDescription: - 'The GMail connector is a bidirectional connector for sending and receiving e-mail messages through the Google Mail API.', + 'The Gmail connector is a bidirectional connector for sending and receiving e-mail messages through the Google Mail API.', + slackDescription: 'Slack is a messaging app for business that connects people to the information they need.', + anthropicDescription: + 'Anthropic is known for developing AI systems and large language models with a focus on safe, steerable, and reliable solutions.', + 'aws-bedrockDescription': + 'Amazon Bedrock is a fully managed service that offers a choice of high-performing foundation models (FMs) from leading AI companies.', + 'faiss-connectorDescription': + 'FAISS is a vector database that allows developers to quickly group and search embeddings of documents that are similar to each other.', + googleaiDescription: + 'Google AI Studio is the fastest way to start building with Gemini, our next generation multimodal generative AI model.', + groqDescription: + 'The LPU™ Inference Engine by Groq is a hardware and software platform that delivers exceptional compute speed, quality, and energy efficiency.', + mistralaiDescription: + 'Mistral AI is a French company specializing in artificial intelligence products. Founded in April 2023 by former employees of Meta Platforms and Google DeepMind, the company has quickly risen to prominence in the AI sector.', + flinkDescription: + 'Apache Flink is a framework and distributed processing engine for stateful computations over unbounded and bounded data streams.', + 'llm-controllerDescription': 'Choose your prefered LLM with the LLM Connector.', //Input Component fieldCannotBeEmpty: 'This field cannot be empty.', @@ -638,7 +654,24 @@ const resources = { openaiDescription: 'Der OpenAI-Connector ist ein bidirektionaler Connector, der Airy mit dem OpenAI LLM verbindet.', gmailDescription: - 'Der GMail-Connector ist ein bidirektionaler Connector zum Senden und Empfangen von E-Mail-Nachrichten über die Google Mail-API.', + 'Der Gmail-Connector ist ein bidirektionaler Connector zum Senden und Empfangen von E-Mail-Nachrichten über die Google Mail-API.', + slackDescription: + 'Slack ist eine Messaging-App für Unternehmen, die Menschen mit den Informationen verbindet, die sie benötigen.', + anthropicDescription: + 'Anthropic ist bekannt für die Entwicklung von KI-Systemen und großen Sprachmodellen mit Fokus auf sichere, lenkbare und zuverlässige Lösungen.', + 'aws-bedrockDescription': + 'Amazon Bedrock ist ein vollständig verwalteter Service, der eine Auswahl an leistungsstarken Grundmodellen (FMs) von führenden KI-Unternehmen bietet.', + 'faiss-connectorDescription': + 'FAISS ist eine Vektordatenbank, die es Entwicklern ermöglicht, Einbettungen von ähnlichen Dokumenten schnell zu gruppieren und zu durchsuchen.', + googleaiDescription: + 'Google AI Studio ist der schnellste Weg, um mit Gemini, unserem nächsten multimodalen generativen KI-Modell, zu arbeiten.', + groqDescription: + 'Die LPU™ Inference Engine von Groq ist eine Hardware- und Softwareplattform, die außergewöhnliche Rechengeschwindigkeit, Qualität und Energieeffizienz bietet.', + mistralaiDescription: + 'Mistral AI ist ein französisches Unternehmen, das sich auf Produkte der künstlichen Intelligenz spezialisiert hat. Gegründet im April 2023 von ehemaligen Mitarbeitern von Meta Platforms und Google DeepMind, hat sich das Unternehmen schnell einen Namen im KI-Sektor gemacht.', + flinkDescription: + 'Apache Flink ist ein Framework und eine verteilte Verarbeitungseinheit für zustandsbehaftete Berechnungen über unbeschränkte und beschränkte Datenströme.', + 'llm-controllerDescription': 'Wählen Sie Ihr bevorzugtes LLM mit dem LLM-Connector.', //Input Component fieldCannotBeEmpty: 'Dieses Feld kann nicht leer sein.', @@ -1268,7 +1301,24 @@ const resources = { "Weaviate est une base de données vectorielles open source qui permet de stocker des intégrations d'objets et de vecteurs à partir de divers modèles ML.", openaiDescription: 'Le connecteur OpenAI est un connecteur bidirectionnel qui connecte Airy au OpenAI LLM.', gmailDescription: - "Le connecteur GMail est un connecteur bidirectionnel permettant d'envoyer et de recevoir des messages électroniques via l'API Google Mail.", + "Le connecteur Gmail est un connecteur bidirectionnel permettant d'envoyer et de recevoir des messages électroniques via l'API Google Mail.", + slackDescription: + 'Slack est une application de messagerie pour les entreprises qui connecte les gens aux informations dont ils ont besoin.', + anthropicDescription: + "Anthropic est connu pour développer des systèmes d'IA et des grands modèles de langage avec un accent sur des solutions sûres, contrôlables et fiables.", + 'aws-bedrockDescription': + "Amazon Bedrock est un service entièrement géré qui offre un choix de modèles de fondation performants (FM) provenant des principales entreprises d'IA.", + 'faiss-connectorDescription': + 'FAISS est une base de données vectorielle qui permet aux développeurs de regrouper rapidement et de rechercher des embeddings de documents similaires entre eux.', + googleaiDescription: + "Google AI Studio est le moyen le plus rapide de commencer à construire avec Gemini, notre modèle d'IA générative multimodale de nouvelle génération.", + groqDescription: + "Le moteur d'inférence LPU™ de Groq est une plateforme matérielle et logicielle qui offre une vitesse de calcul exceptionnelle, une qualité et une efficacité énergétique.", + mistralaiDescription: + "Mistral AI est une entreprise française spécialisée dans les produits d'intelligence artificielle. Fondée en avril 2023 par d'anciens employés de Meta Platforms et Google DeepMind, l'entreprise s'est rapidement imposée dans le secteur de l'IA.", + flinkDescription: + 'Apache Flink est un framework et un moteur de traitement distribué pour les calculs avec état sur des flux de données bornés et non bornés.', + 'llm-controllerDescription': 'Choisissez votre LLM préféré avec le connecteur LLM.', //Input Component fieldCannotBeEmpty: 'Ce champ ne peut pas être vide.', @@ -1892,7 +1942,24 @@ const resources = { 'Weaviate es una base de datos vectorial de código abierto que permite almacenar incrustaciones de objetos y vectores de varios modelos ML.', openaiDescription: 'El conector OpenAI es un conector bidireccional que conecta Airy con OpenAI LLM.', gmailDescription: - 'El conector GMail es un conector bidireccional para enviar y recibir mensajes de correo electrónico a través de la API de Google Mail.', + 'El conector Gmail es un conector bidireccional para enviar y recibir mensajes de correo electrónico a través de la API de Google Mail.', + slackDescription: + 'Slack es una aplicación de mensajería para empresas que conecta a las personas con la información que necesitan.', + anthropicDescription: + 'Anthropic es conocido por desarrollar sistemas de IA y grandes modelos de lenguaje con un enfoque en soluciones seguras, controlables y confiables.', + 'aws-bedrockDescription': + 'Amazon Bedrock es un servicio completamente gestionado que ofrece una selección de modelos base de alto rendimiento (FM) de las principales empresas de IA.', + 'faiss-connectorDescription': + 'FAISS es una base de datos vectorial que permite a los desarrolladores agrupar rápidamente y buscar incrustaciones de documentos que son similares entre sí.', + googleaiDescription: + 'Google AI Studio es la forma más rápida de empezar a construir con Gemini, nuestro modelo de IA generativa multimodal de próxima generación.', + groqDescription: + 'El motor de inferencia LPU™ de Groq es una plataforma de hardware y software que ofrece una velocidad de cálculo, calidad y eficiencia energética excepcionales.', + mistralaiDescription: + 'Mistral AI es una empresa francesa especializada en productos de inteligencia artificial. Fundada en abril de 2023 por ex empleados de Meta Platforms y Google DeepMind, la empresa ha ganado rápidamente prominencia en el sector de la IA.', + flinkDescription: + 'Apache Flink es un marco de trabajo y motor de procesamiento distribuido para cálculos con estado sobre flujos de datos acotados y no acotados.', + 'llm-controllerDescription': 'Elija su LLM preferido con el conector LLM.', //Input Component fieldCannotBeEmpty: 'El campo de texto no puede estar vacío.',