💚 Fix embeds build and create-block CLI

packages/forge/blocks/anthropic/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const AnthropicLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 16 16" fill="currentColor" {...props}>

packages/forge/blocks/anthropic/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/calCom/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const CalComLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 31 31" {...props}>

packages/forge/blocks/calCom/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/chatNode/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ChatNodeLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" {...props}>

packages/forge/blocks/chatNode/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/difyAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const DifyAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" {...props}>

packages/forge/blocks/difyAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/elevenlabs/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ElevenlabsLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 100 100" {...props}>

packages/forge/blocks/elevenlabs/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/mistral/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const MistralLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 256 233" {...props}>

packages/forge/blocks/mistral/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/openRouter/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const OpenRouterLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 512 512" fill="#71717A" stroke="#71717A" {...props}>

packages/forge/blocks/openRouter/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/openai/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const OpenAILightLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 24 24" fill="#000100" {...props}>

packages/forge/blocks/openai/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/qrcode/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const QrCodeLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg

packages/forge/blocks/qrcode/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/togetherAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const TogetherAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 32 32" {...props}>

packages/forge/blocks/togetherAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/zemanticAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ZemanticAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 24 24" {...props}>

packages/forge/blocks/zemanticAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/cli/index.ts

@@ -84,6 +84,7 @@ const main = async () => {
   await createLogoFile(newBlockPath, prompt)
   if (prompt.auth !== 'none') await createAuthFile(newBlockPath, prompt)
   await createSchemasFile(newBlockPath, prompt)
+  await addBlockToRepository(prompt)
   s.stop('Creating files...')
   s.start('Installing dependencies...')
   await new Promise<void>((resolve, reject) => {
@@ -186,7 +187,8 @@ const createTsConfig = async (path: string) => {
         compilerOptions: {
           lib: ['ESNext', 'DOM'],
           noEmit: true,
-          jsx: 'react',
+          jsx: 'preserve',
+          jsxImportSource: 'react',
         },
       }),
       { parser: 'json', ...prettierRc }
@@ -201,7 +203,7 @@ const createLogoFile = async (
   writeFileSync(
     join(path, 'logo.tsx'),
     await prettier.format(
-      `import React from 'react'
+      `/** @jsxImportSource react */
 
       export const ${capitalize(
         camelCaseId
@@ -244,6 +246,19 @@ const createAuthFile = async (
     )
   )
 
+const addBlockToRepository = async ({
+  camelCaseId,
+  id,
+}: {
+  camelCaseId: string
+  id: string
+}) => {
+  const schemasPath = await addBlockToRepoPackageJson(id)
+  await addBlockToRepoDefinitions(schemasPath, camelCaseId, id)
+  await addBlockToRepoConstants(schemasPath, id)
+  await addBlockToRepoSchemas(schemasPath, camelCaseId, id)
+}
+
 const createSchemasFile = async (
   path: string,
   {
@@ -265,6 +280,111 @@ export const ${camelCaseName}CredentialsSchema = parseBlockCredentials(${camelCa
   )
 }
 
+async function addBlockToRepoDefinitions(
+  schemasPath: string,
+  camelCaseId: string,
+  id: string
+) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'definitions.ts')
+  ).toString()
+  const importStatement = `import { ${camelCaseId}Block } from '@typebot.io/${id}-block'`
+  const objectEntry = `  [${camelCaseId}Block.id]: ${camelCaseId}Block,`
+  const nextLineImportIndex = existingDefinitionsData.indexOf(
+    '\n',
+    existingDefinitionsData.lastIndexOf('import')
+  )
+
+  const newObjectEntryIndex = existingDefinitionsData.lastIndexOf(',') + 1
+
+  const newDefinitionsData = `${existingDefinitionsData.slice(
+    0,
+    nextLineImportIndex
+  )}
+${importStatement}
+${existingDefinitionsData.slice(nextLineImportIndex, newObjectEntryIndex)}
+${objectEntry}
+${existingDefinitionsData.slice(newObjectEntryIndex)}`
+
+  writeFileSync(
+    join(schemasPath, 'definitions.ts'),
+    await prettier.format(newDefinitionsData, {
+      parser: 'typescript',
+      ...prettierRc,
+    })
+  )
+}
+
+async function addBlockToRepoSchemas(
+  schemasPath: string,
+  camelCaseId: string,
+  id: string
+) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'schemas.ts')
+  ).toString()
+  const importStatement = `import { ${camelCaseId}Block } from '@typebot.io/${id}-block'
+import { ${camelCaseId}BlockSchema } from '@typebot.io/${id}-block/schemas'`
+  const objectEntry = `  [${camelCaseId}Block.id]: ${camelCaseId}BlockSchema,`
+  const nextLineImportIndex = existingDefinitionsData.indexOf(
+    '\n',
+    existingDefinitionsData.lastIndexOf('import')
+  )
+
+  const newObjectEntryIndex = existingDefinitionsData.lastIndexOf(',') + 1
+
+  const newDefinitionsData = `${existingDefinitionsData.slice(
+    0,
+    nextLineImportIndex
+  )}
+${importStatement}
+${existingDefinitionsData.slice(nextLineImportIndex, newObjectEntryIndex)}
+${objectEntry}
+${existingDefinitionsData.slice(newObjectEntryIndex)}`
+
+  writeFileSync(
+    join(schemasPath, 'schemas.ts'),
+    await prettier.format(newDefinitionsData, {
+      parser: 'typescript',
+      ...prettierRc,
+    })
+  )
+}
+
+async function addBlockToRepoConstants(schemasPath: string, id: string) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'constants.ts')
+  ).toString()
+
+  writeFileSync(
+    join(schemasPath, 'constants.ts'),
+    await prettier.format(
+      existingDefinitionsData.replace(
+        `] as const satisfies ForgedBlock['type'][]`,
+        `'${id}'] as const satisfies ForgedBlock['type'][]`
+      ),
+      {
+        parser: 'typescript',
+        ...prettierRc,
+      }
+    )
+  )
+}
+
+async function addBlockToRepoPackageJson(id: string) {
+  const schemasPath = join(process.cwd(), `../repository`)
+  const packageJson = require(join(schemasPath, 'package.json'))
+  packageJson.devDependencies[`@typebot.io/${id}-block`] = 'workspace:*'
+  writeFileSync(
+    join(schemasPath, 'package.json'),
+    await prettier.format(JSON.stringify(packageJson, null, 2), {
+      parser: 'json',
+      ...prettierRc,
+    })
+  )
+  return schemasPath
+}
+
 main()
   .then()
   .catch((err) => {

packages/forge/repository/constants.ts

@@ -1,3 +1,4 @@
+// Do not edit this file manually
 import { ForgedBlock } from './types'
 
 export const forgedBlockIds = [

packages/forge/repository/definitions.ts

@@ -23,4 +23,4 @@ export const forgedBlocks = {
   [anthropicBlock.id]: anthropicBlock,
   [togetherAiBlock.id]: togetherAiBlock,
   [openRouterBlock.id]: openRouterBlock,
-} as const
+}

packages/forge/repository/schemas.ts

@@ -1,3 +1,4 @@
+// Do not edit this file manually
 import { anthropicBlock } from '@typebot.io/anthropic-block'
 import { anthropicBlockSchema } from '@typebot.io/anthropic-block/schemas'
 import { calComBlock } from '@typebot.io/cal-com-block'