refactor(editor): ♻️ Undo / Redo buttons + structure refacto

Yet another huge refacto... While implementing undo and redo features I understood that I updated the stored typebot too many times (i.e. on each key input) so I had to rethink it entirely. I also moved around some files.

packages/bot-engine/src/services/integration.ts

@@ -50,8 +50,8 @@ const executeGoogleSheetIntegration = async (
   variables: Table<Variable>,
   updateVariableValue: (variableId: string, value: string) => void
 ) => {
-  if (!step.options) return step.edgeId
-  switch (step.options?.action) {
+  if (!('action' in step.options)) return step.edgeId
+  switch (step.options.action) {
     case GoogleSheetsAction.INSERT_ROW:
       await insertRowInGoogleSheets(step.options, variables)
       break

packages/bot-engine/src/services/logic.ts

@@ -9,7 +9,7 @@ import {
   SetVariableStep,
   RedirectStep,
 } from 'models'
-import { isDefined } from 'utils'
+import { isDefined, isNotDefined } from 'utils'
 import { sanitizeUrl } from './utils'
 import { isMathFormula, evaluateExpression, parseVariables } from './variable'
 
@@ -66,7 +66,7 @@ const executeComparison =
     if (!comparison?.variableId) return false
     const inputValue = variables.byId[comparison.variableId].value ?? ''
     const { value } = comparison
-    if (!isDefined(value)) return false
+    if (isNotDefined(value)) return false
     switch (comparison.comparisonOperator) {
       case ComparisonOperators.CONTAINS: {
         return inputValue.includes(value)

packages/models/src/typebot/steps/integration.ts

@@ -47,11 +47,12 @@ export enum GoogleSheetsAction {
 }
 
 export type GoogleSheetsOptions =
+  | GoogleSheetsOptionsBase
   | GoogleSheetsGetOptions
   | GoogleSheetsInsertRowOptions
   | GoogleSheetsUpdateRowOptions
 
-type GoogleSheetsOptionsBase = {
+export type GoogleSheetsOptionsBase = {
   credentialsId?: string
   spreadsheetId?: string
   sheetId?: string
@@ -60,29 +61,31 @@ type GoogleSheetsOptionsBase = {
 export type Cell = { column?: string; value?: string }
 export type ExtractingCell = { column?: string; variableId?: string }
 
-export type GoogleSheetsGetOptions = GoogleSheetsOptionsBase & {
-  action?: GoogleSheetsAction.GET
+export type GoogleSheetsGetOptions = NonNullable<GoogleSheetsOptionsBase> & {
+  action: GoogleSheetsAction.GET
   referenceCell?: Cell
-  cellsToExtract?: Table<ExtractingCell>
+  cellsToExtract: Table<ExtractingCell>
 }
 
-export type GoogleSheetsInsertRowOptions = GoogleSheetsOptionsBase & {
-  action?: GoogleSheetsAction.INSERT_ROW
-  cellsToInsert?: Table<Cell>
-}
+export type GoogleSheetsInsertRowOptions =
+  NonNullable<GoogleSheetsOptionsBase> & {
+    action: GoogleSheetsAction.INSERT_ROW
+    cellsToInsert: Table<Cell>
+  }
 
-export type GoogleSheetsUpdateRowOptions = GoogleSheetsOptionsBase & {
-  action?: GoogleSheetsAction.UPDATE_ROW
-  referenceCell?: Cell
-  cellsToUpsert?: Table<Cell>
-}
+export type GoogleSheetsUpdateRowOptions =
+  NonNullable<GoogleSheetsOptionsBase> & {
+    action: GoogleSheetsAction.UPDATE_ROW
+    referenceCell?: Cell
+    cellsToUpsert: Table<Cell>
+  }
 
 export type ResponseVariableMapping = { bodyPath?: string; variableId?: string }
 
 export type WebhookOptions = {
-  webhookId?: string
-  variablesForTest?: Table<VariableForTest>
-  responseVariableMapping?: Table<ResponseVariableMapping>
+  webhookId: string
+  variablesForTest: Table<VariableForTest>
+  responseVariableMapping: Table<ResponseVariableMapping>
 }
 
 export enum HttpMethod {
@@ -103,9 +106,9 @@ export type VariableForTest = { variableId?: string; value?: string }
 export type Webhook = {
   id: string
   url?: string
-  method?: HttpMethod
-  queryParams?: Table<KeyValue>
-  headers?: Table<KeyValue>
+  method: HttpMethod
+  queryParams: Table<KeyValue>
+  headers: Table<KeyValue>
   body?: string
 }
 
@@ -118,4 +121,13 @@ export const defaultGoogleSheetsOptions: GoogleSheetsOptions = {}
 
 export const defaultGoogleAnalyticsOptions: GoogleAnalyticsOptions = {}
 
-export const defaultWebhookOptions: WebhookOptions = {}
+export const defaultWebhookOptions: Omit<WebhookOptions, 'webhookId'> = {
+  responseVariableMapping: { byId: {}, allIds: [] },
+  variablesForTest: { byId: {}, allIds: [] },
+}
+
+export const defaultWebhookAttributes: Omit<Webhook, 'id'> = {
+  method: HttpMethod.GET,
+  headers: { byId: {}, allIds: [] },
+  queryParams: { byId: {}, allIds: [] },
+}

packages/models/src/typebot/typebot.ts

@@ -40,7 +40,7 @@ export type Block = {
 export type Source = {
   blockId: string
   stepId: string
-  nodeId?: string
+  buttonId?: string
   conditionType?: 'true' | 'false'
 }
 export type Target = { blockId: string; stepId?: string }

packages/models/src/utils.ts

@@ -1 +1,3 @@
 export type Table<T> = { byId: { [key: string]: T }; allIds: string[] }
+
+export const defaultTable = { byId: {}, allIds: [] }

packages/utils/src/utils.ts

@@ -46,6 +46,10 @@ export const isDefined = <T>(
   value: T | undefined | null
 ): value is NonNullable<T> => value !== undefined && value !== null
 
+export const isNotDefined = <T>(
+  value: T | undefined | null
+): value is undefined | null => value === undefined || value === null
+
 export const filterTable = <T>(ids: string[], table: Table<T>): Table<T> => ({
   byId: ids.reduce((acc, id) => ({ ...acc, [id]: table.byId[id] }), {}),
   allIds: ids,