💚 Fix embeds build and create-block CLI

baptisteArno · Mar 19, 2024 · a4c865c · a4c865c
1 parent 56a23a1
commit a4c865c
Show file tree

Hide file tree

Showing 35 changed files with 204 additions and 28 deletions.
diff --git a/packages/embeds/js/package.json b/packages/embeds/js/package.json
@@ -26,6 +26,7 @@
     "@rollup/plugin-babel": "6.0.3",
     "@rollup/plugin-node-resolve": "15.1.0",
     "@rollup/plugin-terser": "0.4.3",
+    "@rollup/plugin-typescript": "11.1.2",
     "@typebot.io/bot-engine": "workspace:*",
     "@typebot.io/env": "workspace:*",
     "@typebot.io/lib": "workspace:*",

diff --git a/packages/embeds/js/rollup.config.js b/packages/embeds/js/rollup.config.js
@@ -4,6 +4,7 @@ import { babel } from '@rollup/plugin-babel'
 import postcss from 'rollup-plugin-postcss'
 import autoprefixer from 'autoprefixer'
 import tailwindcss from 'tailwindcss'
+import typescript from '@rollup/plugin-typescript'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
 import fs from 'fs'
 
@@ -28,6 +29,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     postcss({
       plugins: [autoprefixer(), tailwindcss()],
       extract: false,

diff --git a/packages/embeds/nextjs/package.json b/packages/embeds/nextjs/package.json
@@ -35,7 +35,8 @@
     "rollup-plugin-typescript-paths": "1.4.0",
     "tslib": "2.6.0",
     "tsx": "3.12.7",
-    "typescript": "5.3.2"
+    "typescript": "5.3.2",
+    "@rollup/plugin-typescript": "11.1.2"
   },
   "peerDependencies": {
     "next": "12.x || 13.x || 14.x",

diff --git a/packages/embeds/nextjs/rollup.config.js b/packages/embeds/nextjs/rollup.config.js
@@ -2,6 +2,7 @@ import resolve from '@rollup/plugin-node-resolve'
 import terser from '@rollup/plugin-terser'
 import { babel } from '@rollup/plugin-babel'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
+import typescript from '@rollup/plugin-typescript'
 import fs from 'fs'
 
 const extensions = ['.ts', '.tsx']
@@ -26,6 +27,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     terser({ format: { preamble } }),
   ],
 }

diff --git a/packages/embeds/react/package.json b/packages/embeds/react/package.json
@@ -39,7 +39,8 @@
     "rollup-plugin-typescript-paths": "1.4.0",
     "tslib": "2.6.0",
     "tsx": "3.12.7",
-    "typescript": "5.3.2"
+    "typescript": "5.3.2",
+    "@rollup/plugin-typescript": "11.1.2"
   },
   "peerDependencies": {
     "react": "^16.0.0 || ^17.0.0 || ^18.0.0"

diff --git a/packages/embeds/react/rollup.config.js b/packages/embeds/react/rollup.config.js
@@ -2,6 +2,7 @@ import resolve from '@rollup/plugin-node-resolve'
 import terser from '@rollup/plugin-terser'
 import { babel } from '@rollup/plugin-babel'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
+import typescript from '@rollup/plugin-typescript'
 import fs from 'fs'
 
 const extensions = ['.ts', '.tsx']
@@ -26,6 +27,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     terser({ format: { preamble } }),
   ],
 }

diff --git a/packages/forge/blocks/anthropic/logo.tsx b/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}>

diff --git a/packages/forge/blocks/anthropic/tsconfig.json b/packages/forge/blocks/anthropic/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/calCom/logo.tsx b/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}>

diff --git a/packages/forge/blocks/calCom/tsconfig.json b/packages/forge/blocks/calCom/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/chatNode/logo.tsx b/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}>

diff --git a/packages/forge/blocks/chatNode/tsconfig.json b/packages/forge/blocks/chatNode/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/difyAi/logo.tsx b/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}>

diff --git a/packages/forge/blocks/difyAi/tsconfig.json b/packages/forge/blocks/difyAi/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/elevenlabs/logo.tsx b/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}>

diff --git a/packages/forge/blocks/elevenlabs/tsconfig.json b/packages/forge/blocks/elevenlabs/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/mistral/logo.tsx b/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}>

diff --git a/packages/forge/blocks/mistral/tsconfig.json b/packages/forge/blocks/mistral/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/openRouter/logo.tsx b/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}>

diff --git a/packages/forge/blocks/openRouter/tsconfig.json b/packages/forge/blocks/openRouter/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/openai/logo.tsx b/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}>

diff --git a/packages/forge/blocks/openai/tsconfig.json b/packages/forge/blocks/openai/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/qrcode/logo.tsx b/packages/forge/blocks/qrcode/logo.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const QrCodeLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg

diff --git a/packages/forge/blocks/qrcode/tsconfig.json b/packages/forge/blocks/qrcode/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/togetherAi/logo.tsx b/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}>

diff --git a/packages/forge/blocks/togetherAi/tsconfig.json b/packages/forge/blocks/togetherAi/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/blocks/zemanticAi/logo.tsx b/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}>

diff --git a/packages/forge/blocks/zemanticAi/tsconfig.json b/packages/forge/blocks/zemanticAi/tsconfig.json
@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }
diff --git a/packages/forge/cli/index.ts b/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) => {