👷 Transpile components for better DX

apps/builder/contexts/TypebotContext/actions/blocks.ts

@@ -138,16 +138,26 @@ const duplicateBlockDraft =
   (groupId: string) =>
   (block: Block): Block => {
     const blockId = cuid()
+    if (blockHasItems(block))
+      return {
+        ...block,
+        groupId,
+        id: blockId,
+        items: block.items.map(duplicateItemDraft(blockId)),
+        outgoingEdgeId: undefined,
+      } as Block
+    if (isWebhookBlock(block))
+      return {
+        ...block,
+        groupId,
+        id: blockId,
+        webhookId: cuid(),
+        outgoingEdgeId: undefined,
+      }
     return {
       ...block,
       groupId,
       id: blockId,
-      items: blockHasItems(block)
-        ? block.items.map(duplicateItemDraft(blockId))
-        : undefined,
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      //@ts-ignore
-      webhookId: isWebhookBlock(block) ? cuid() : undefined,
       outgoingEdgeId: undefined,
     }
   }

apps/builder/libs/google-sheets.ts

@@ -1,7 +1,8 @@
 import { Credentials as CredentialsFromDb } from 'db'
 import { OAuth2Client, Credentials } from 'google-auth-library'
 import { GoogleSheetsCredentialsData } from 'models'
-import { decrypt, encrypt, isDefined } from 'utils'
+import { isDefined } from 'utils'
+import { decrypt, encrypt } from 'utils/api'
 import prisma from './prisma'
 
 export const oauth2Client = new OAuth2Client(

apps/builder/next.config.js

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 const { withSentryConfig } = require('@sentry/nextjs')
 const path = require('path')
+const withTM = require('next-transpile-modules')(['utils', 'models'])
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
@@ -15,6 +16,8 @@ const sentryWebpackPluginOptions = {
   silent: true,
 }
 
-module.exports = process.env.SENTRY_AUTH_TOKEN
-  ? withSentryConfig(nextConfig, sentryWebpackPluginOptions)
-  : nextConfig
+module.exports = withTM(
+  process.env.SENTRY_AUTH_TOKEN
+    ? withSentryConfig(nextConfig, sentryWebpackPluginOptions)
+    : nextConfig
+)

apps/builder/package.json

@@ -3,7 +3,6 @@
   "version": "0.1.0",
   "license": "AGPL-3.0-or-later",
   "scripts": {
-    "dx": "pnpm dev",
     "dev": "ENVSH_ENV=.env.local bash ../../env.sh next dev -p 3000",
     "build": "next build",
     "start": "next start",
@@ -108,6 +107,7 @@
     "eslint-config-next": "12.3.0",
     "eslint-plugin-react": "^7.31.8",
     "models": "workspace:*",
+    "next-transpile-modules": "^9.0.0",
     "typescript": "^4.8.3",
     "utils": "workspace:*"
   }

apps/builder/pages/api/credentials.ts

@@ -5,11 +5,11 @@ import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
 import {
   badRequest,
-  encrypt,
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+  encrypt,
+} from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/credentials/[credentialsId].ts

@@ -2,7 +2,7 @@ import { withSentry } from '@sentry/nextjs'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/credentials/google-sheets/callback.ts

@@ -4,7 +4,7 @@ import prisma from 'libs/prisma'
 import { googleSheetsScopes } from './consent-url'
 import { stringify } from 'querystring'
 import { CredentialsType } from 'models'
-import { badRequest, encrypt, notAuthenticated } from 'utils'
+import { badRequest, encrypt, notAuthenticated } from 'utils/api'
 import { oauth2Client } from 'libs/google-sheets'
 import { withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'

apps/builder/pages/api/customDomains.ts

@@ -9,7 +9,7 @@ import {
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/customDomains/[domain].ts

@@ -1,7 +1,7 @@
 import { withSentry } from '@sentry/nextjs'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 import { got } from 'got'
 import { getAuthenticatedUser } from 'services/api/utils'
 

apps/builder/pages/api/folders.ts

@@ -3,7 +3,7 @@ import { DashboardFolder, WorkspaceRole } from 'db'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/folders/[id].ts

@@ -3,7 +3,7 @@ import { DashboardFolder } from 'db'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/integrations/email/test-config.ts

@@ -3,7 +3,7 @@ import { SmtpCredentialsData } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { createTransport } from 'nodemailer'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { notAuthenticated } from 'utils'
+import { notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/integrations/google-sheets/spreadsheets.ts

@@ -1,7 +1,7 @@
 import { NextApiRequest, NextApiResponse } from 'next'
 import { drive } from '@googleapis/drive'
 import { getAuthenticatedGoogleClient } from 'libs/google-sheets'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 import { setUser, withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'
 

apps/builder/pages/api/integrations/google-sheets/spreadsheets/[id]/sheets.ts

@@ -1,12 +1,8 @@
 import { NextApiRequest, NextApiResponse } from 'next'
 import { GoogleSpreadsheet } from 'google-spreadsheet'
 import { getAuthenticatedGoogleClient } from 'libs/google-sheets'
-import {
-  badRequest,
-  isDefined,
-  methodNotAllowed,
-  notAuthenticated,
-} from 'utils'
+import { isDefined } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 import { withSentry, setUser } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'
 

apps/builder/pages/api/mock/webhook-easy-config.ts

@@ -1,6 +1,6 @@
 import { withSentry } from '@sentry/nextjs'
 import { NextApiRequest, NextApiResponse } from 'next'
-import { methodNotAllowed } from 'utils'
+import { methodNotAllowed } from 'utils/api'
 
 const handler = (req: NextApiRequest, res: NextApiResponse) => {
   if (req.method === 'POST') {

apps/builder/pages/api/mock/webhook.ts

@@ -1,6 +1,6 @@
 import { withSentry } from '@sentry/nextjs'
 import { NextApiRequest, NextApiResponse } from 'next'
-import { methodNotAllowed } from 'utils'
+import { methodNotAllowed } from 'utils/api'
 
 const handler = (req: NextApiRequest, res: NextApiResponse) => {
   if (req.method === 'POST') {

apps/builder/pages/api/publicTypebots.ts

@@ -4,7 +4,7 @@ import { InputBlockType, PublicTypebot } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canPublishFileInput } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/publicTypebots/[id].ts

@@ -4,7 +4,7 @@ import { InputBlockType, PublicTypebot } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canPublishFileInput } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { badRequest, methodNotAllowed, notAuthenticated } from 'utils'
+import { badRequest, methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/storage/upload-url.ts

@@ -6,7 +6,7 @@ import {
   generatePresignedUrl,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 
 const handler = async (
   req: NextApiRequest,

apps/builder/pages/api/stripe/billing-portal.ts

@@ -4,7 +4,7 @@ import {
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 import Stripe from 'stripe'
 import { withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'

apps/builder/pages/api/stripe/invoices.ts

@@ -4,7 +4,7 @@ import {
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 import Stripe from 'stripe'
 import { withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'

apps/builder/pages/api/stripe/subscription.ts

@@ -1,11 +1,11 @@
 import { NextApiRequest, NextApiResponse } from 'next'
+import { isDefined } from 'utils'
 import {
   badRequest,
   forbidden,
-  isDefined,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 import Stripe from 'stripe'
 import { withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'

apps/builder/pages/api/stripe/webhook.ts

@@ -1,5 +1,5 @@
 import { NextApiRequest, NextApiResponse } from 'next'
-import { methodNotAllowed } from 'utils'
+import { methodNotAllowed } from 'utils/api'
 import Stripe from 'stripe'
 import Cors from 'micro-cors'
 import { buffer } from 'micro'

apps/builder/pages/api/typebots.ts

@@ -4,7 +4,12 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
 import { parseNewTypebot } from 'services/typebots/typebots'
-import { badRequest, methodNotAllowed, notAuthenticated, notFound } from 'utils'
+import {
+  badRequest,
+  methodNotAllowed,
+  notAuthenticated,
+  notFound,
+} from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId].ts

@@ -4,7 +4,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot, canWriteTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/blocks.ts

@@ -3,7 +3,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated, notFound } from 'utils'
+import { methodNotAllowed, notAuthenticated, notFound } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/collaborators.ts

@@ -3,7 +3,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/collaborators/[userId].ts

@@ -3,7 +3,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canEditGuests } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/invitations.ts

@@ -4,15 +4,15 @@ import { CollaborationType, WorkspaceRole } from 'db'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot, canWriteTypebot } from 'services/api/dbRules'
-import { sendEmailNotification } from 'utils'
-import { getAuthenticatedUser } from 'services/api/utils'
 import {
+  sendEmailNotification,
   badRequest,
-  env,
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
+import { getAuthenticatedUser } from 'services/api/utils'
+import { env } from 'utils'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/invitations/[email].ts

@@ -4,7 +4,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canEditGuests } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/results.ts

@@ -10,7 +10,7 @@ import {
   forbidden,
   methodNotAllowed,
   notAuthenticated,
-} from 'utils'
+} from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/results/[resultId]/logs.ts

@@ -3,7 +3,7 @@ import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/results/answers/count.ts

@@ -1,7 +1,7 @@
 import { PublicTypebot } from 'models'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 import { withSentry } from '@sentry/nextjs'
 import { getAuthenticatedUser } from 'services/api/utils'
 import { canReadTypebot } from 'services/api/dbRules'

apps/builder/pages/api/typebots/[typebotId]/results/stats.ts

@@ -4,7 +4,7 @@ import { Stats } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canReadTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/typebots/[typebotId]/webhooks.ts

@@ -4,7 +4,7 @@ import { defaultWebhookAttributes } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { canWriteTypebot } from 'services/api/dbRules'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { forbidden, methodNotAllowed, notAuthenticated } from 'utils'
+import { forbidden, methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)

apps/builder/pages/api/users/[userId].ts

@@ -2,7 +2,7 @@ import { withSentry } from '@sentry/nextjs'
 import prisma from 'libs/prisma'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { getAuthenticatedUser } from 'services/api/utils'
-import { methodNotAllowed, notAuthenticated } from 'utils'
+import { methodNotAllowed, notAuthenticated } from 'utils/api'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   const user = await getAuthenticatedUser(req)