♻️ (editor) Migrate from react-draggable to @use-gesture

Closes #168

apps/builder/src/features/workspace/components/WorkspaceSettingsModal.tsx

@@ -15,7 +15,7 @@ import {
   UsersIcon,
 } from '@/components/icons'
 import { EmojiOrImageIcon } from '@/components/EmojiOrImageIcon'
-import { User, Workspace } from 'db'
+import { GraphNavigation, User, Workspace } from 'db'
 import { useState } from 'react'
 import { MembersList } from './MembersList'
 import { WorkspaceSettingsForm } from './WorkspaceSettingsForm'
@@ -146,9 +146,13 @@ export const WorkspaceSettingsModal = ({
           </Flex>
         </Stack>
 
-        {isOpen && (
+        {isOpen && user.graphNavigation && (
           <Flex flex="1" p="10">
-            <SettingsContent tab={selectedTab} onClose={onClose} />
+            <SettingsContent
+              tab={selectedTab}
+              onClose={onClose}
+              defaultGraphNavigation={user.graphNavigation}
+            />
           </Flex>
         )}
       </ModalContent>
@@ -158,16 +162,20 @@ export const WorkspaceSettingsModal = ({
 
 const SettingsContent = ({
   tab,
+  defaultGraphNavigation,
   onClose,
 }: {
   tab: SettingsTab
+  defaultGraphNavigation: GraphNavigation
   onClose: () => void
 }) => {
   switch (tab) {
     case 'my-account':
       return <MyAccountForm />
     case 'user-settings':
-      return <EditorSettingsForm />
+      return (
+        <EditorSettingsForm defaultGraphNavigation={defaultGraphNavigation} />
+      )
     case 'workspace-settings':
       return <WorkspaceSettingsForm onClose={onClose} />
     case 'members':