🐛 (openai) Fix models dropdown list on new block

apps/builder/src/features/blocks/integrations/openai/api/listModels.ts

@@ -5,15 +5,17 @@ import { z } from 'zod'
 import { isReadWorkspaceFobidden } from '@/features/workspace/helpers/isReadWorkspaceFobidden'
 import { Configuration, OpenAIApi, ResponseTypes } from 'openai-edge'
 import { decrypt } from '@typebot.io/lib/api'
-import { OpenAICredentials } from '@typebot.io/schemas/features/blocks/integrations/openai'
-import { IntegrationBlockType, typebotSchema } from '@typebot.io/schemas'
+import {
+  OpenAICredentials,
+  defaultBaseUrl,
+} from '@typebot.io/schemas/features/blocks/integrations/openai'
 import { isNotEmpty } from '@typebot.io/lib/utils'
 
 export const listModels = authenticatedProcedure
   .meta({
     openapi: {
       method: 'GET',
-      path: '/typebots/{typebotId}/blocks/{blockId}/openai/models',
+      path: '/openai/models',
       protect: true,
       summary: 'List OpenAI models',
       tags: ['OpenAI'],
@@ -21,10 +23,10 @@ export const listModels = authenticatedProcedure
   })
   .input(
     z.object({
-      typebotId: z.string(),
-      blockId: z.string(),
       credentialsId: z.string(),
       workspaceId: z.string(),
+      baseUrl: z.string().default(defaultBaseUrl),
+      apiVersion: z.string().optional(),
     })
   )
   .output(
@@ -34,7 +36,7 @@ export const listModels = authenticatedProcedure
   )
   .query(
     async ({
-      input: { credentialsId, workspaceId, typebotId, blockId },
+      input: { credentialsId, workspaceId, baseUrl, apiVersion },
       ctx: { user },
     }) => {
       const workspace = await prisma.workspace.findFirst({
@@ -45,14 +47,6 @@ export const listModels = authenticatedProcedure
               userId: true,
             },
           },
-          typebots: {
-            where: {
-              id: typebotId,
-            },
-            select: {
-              groups: true,
-            },
-          },
           credentials: {
             where: {
               id: credentialsId,
@@ -80,25 +74,6 @@ export const listModels = authenticatedProcedure
           message: 'No credentials found',
         })
 
-      const typebot = workspace.typebots.at(0)
-
-      if (!typebot)
-        throw new TRPCError({
-          code: 'NOT_FOUND',
-          message: 'Typebot not found',
-        })
-
-      const block = typebotSchema._def.schema.shape.groups
-        .parse(workspace.typebots.at(0)?.groups)
-        .flatMap((group) => group.blocks)
-        .find((block) => block.id === blockId)
-
-      if (!block || block.type !== IntegrationBlockType.OPEN_AI)
-        throw new TRPCError({
-          code: 'NOT_FOUND',
-          message: 'OpenAI block not found',
-        })
-
       const data = (await decrypt(
         credentials.data,
         credentials.iv
@@ -106,15 +81,15 @@ export const listModels = authenticatedProcedure
 
       const config = new Configuration({
         apiKey: data.apiKey,
-        basePath: block.options.baseUrl,
+        basePath: baseUrl,
         baseOptions: {
           headers: {
             'api-key': data.apiKey,
           },
         },
-        defaultQueryParams: isNotEmpty(block.options.apiVersion)
+        defaultQueryParams: isNotEmpty(apiVersion)
           ? new URLSearchParams({
-              'api-version': block.options.apiVersion,
+              'api-version': apiVersion,
             })
           : undefined,
       })

apps/builder/src/features/blocks/integrations/openai/components/OpenAISettings.tsx

@@ -33,7 +33,7 @@ type Props = {
 }
 
 export const OpenAISettings = ({
-  block: { options, id },
+  block: { options },
   onOptionsChange,
 }: Props) => {
   const { workspace } = useWorkspace()
@@ -126,7 +126,6 @@ export const OpenAISettings = ({
           />
           {options.task && (
             <OpenAITaskSettings
-              blockId={id}
               options={options}
               onOptionsChange={onOptionsChange}
             />
@@ -140,24 +139,21 @@ export const OpenAISettings = ({
 const OpenAITaskSettings = ({
   options,
   onOptionsChange,
-  blockId,
 }: {
   options: ChatCompletionOpenAIOptions | CreateImageOpenAIOptions
-  blockId: string
   onOptionsChange: (options: OpenAIBlock['options']) => void
 }) => {
   switch (options.task) {
     case 'Create chat completion': {
       return (
         <OpenAIChatCompletionSettings
-          blockId={blockId}
           options={options}
           onOptionsChange={onOptionsChange}
         />
       )
     }
     case 'Create image': {
-      return <></>
+      return null
     }
   }
 }

apps/builder/src/features/blocks/integrations/openai/components/createChatCompletion/ModelsDropdown.tsx

@@ -1,35 +1,35 @@
 import { Select } from '@/components/inputs/Select'
-import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
 import { useToast } from '@/hooks/useToast'
 import { trpc } from '@/lib/trpc'
 
 type Props = {
+  baseUrl: string
+  apiVersion?: string
   credentialsId: string
-  blockId: string
   defaultValue: string
   onChange: (model: string | undefined) => void
 }
 
 export const ModelsDropdown = ({
+  baseUrl,
+  apiVersion,
   defaultValue,
   onChange,
   credentialsId,
-  blockId,
 }: Props) => {
-  const { typebot } = useTypebot()
   const { workspace } = useWorkspace()
   const { showToast } = useToast()
 
   const { data } = trpc.openAI.listModels.useQuery(
     {
       credentialsId,
-      blockId,
-      typebotId: typebot?.id as string,
+      baseUrl,
       workspaceId: workspace?.id as string,
+      apiVersion,
     },
     {
-      enabled: !!typebot && !!workspace,
+      enabled: !!workspace,
       onError: (error) => {
         showToast({
           description: error.message,

apps/builder/src/features/blocks/integrations/openai/components/createChatCompletion/OpenAIChatCompletionSettings.tsx

@@ -19,13 +19,11 @@ const apiReferenceUrl =
   'https://platform.openai.com/docs/api-reference/chat/create'
 
 type Props = {
-  blockId: string
   options: ChatCompletionOpenAIOptions
   onOptionsChange: (options: ChatCompletionOpenAIOptions) => void
 }
 
 export const OpenAIChatCompletionSettings = ({
-  blockId,
   options,
   onOptionsChange,
 }: Props) => {
@@ -79,8 +77,9 @@ export const OpenAIChatCompletionSettings = ({
           <ModelsDropdown
             credentialsId={options.credentialsId}
             defaultValue={options.model}
+            baseUrl={options.baseUrl}
+            apiVersion={options.apiVersion}
             onChange={updateModel}
-            blockId={blockId}
           />
           <Accordion allowMultiple>
             <AccordionItem>