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.

apps/builder/pages/_app.tsx

@@ -13,6 +13,8 @@ import 'assets/styles/custom.css'
 import { UserContext } from 'contexts/UserContext'
 import { TypebotContext } from 'contexts/TypebotContext'
 import { useRouter } from 'next/router'
+import { KBarProvider } from 'kbar'
+import { actions } from 'libs/kbar'
 
 const App = ({ Component, pageProps }: AppProps) => {
   useRouterProgressBar()
@@ -20,13 +22,15 @@ const App = ({ Component, pageProps }: AppProps) => {
 
   return (
     <ChakraProvider theme={customTheme}>
-      <SessionProvider>
-        <UserContext>
-          <TypebotContext typebotId={query.typebotId?.toString()}>
-            <Component {...pageProps} />
-          </TypebotContext>
-        </UserContext>
-      </SessionProvider>
+      <KBarProvider actions={actions}>
+        <SessionProvider>
+          <UserContext>
+            <TypebotContext typebotId={query.typebotId?.toString()}>
+              <Component {...pageProps} />
+            </TypebotContext>
+          </UserContext>
+        </SessionProvider>
+      </KBarProvider>
     </ChakraProvider>
   )
 }

apps/builder/pages/typebots/[typebotId]/edit.tsx

@@ -1,23 +1,19 @@
 import { Flex } from '@chakra-ui/layout'
-import { Board } from 'components/board/Board'
+import { Board } from 'layouts/editor/Board'
 import { Seo } from 'components/Seo'
 import { TypebotHeader } from 'components/shared/TypebotHeader'
 import { EditorContext } from 'contexts/EditorContext'
-import { KBarProvider } from 'kbar'
 import React from 'react'
-import { actions } from 'libs/kbar'
 import { KBar } from 'components/shared/KBar'
 
 const TypebotEditPage = () => (
   <EditorContext>
     <Seo title="Editor" />
-    <KBarProvider actions={actions}>
-      <KBar />
-      <Flex overflow="hidden" h="100vh" flexDir="column" id="editor-container">
-        <TypebotHeader />
-        <Board />
-      </Flex>
-    </KBarProvider>
+    <KBar />
+    <Flex overflow="hidden" h="100vh" flexDir="column" id="editor-container">
+      <TypebotHeader />
+      <Board />
+    </Flex>
   </EditorContext>
 )
 export default TypebotEditPage