feat(electron): app tabs dnd (#7684)

<div class='graphite__hidden'> <div>🎥 Video uploaded on Graphite:</div> <a href="https://app.graphite.dev/media/video/T2klNLEk0wxLh4NRDzhk/cd84e155-9f2e-4d12-a933-8673eb6bc6cb.mp4"> <img src="https://app.graphite.dev/api/v1/graphite/video/thumbnail/T2klNLEk0wxLh4NRDzhk/cd84e155-9f2e-4d12-a933-8673eb6bc6cb.mp4"> </a> </div> <video src="https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/T2klNLEk0wxLh4NRDzhk/cd84e155-9f2e-4d12-a933-8673eb6bc6cb.mp4">Kapture 2024-07-31 at 19.39.30.mp4</video> fix AF-1149 fix PD-1513 fix PD-1515
toeverything · Aug 2, 2024 · bfff10e · bfff10e
1 parent 4719ffa
commit bfff10e
Show file tree

Hide file tree

Showing 13 changed files with 567 additions and 188 deletions.
diff --git a/packages/frontend/component/src/theme/global.css b/packages/frontend/component/src/theme/global.css
@@ -275,32 +275,6 @@ affine-block-hub {
   }
 }
 
-button,
-input,
-select,
-textarea
-/* [role='button']  */ {
-  -webkit-app-region: no-drag;
-}
-
-#webpack-dev-server-client-overlay {
-  -webkit-app-region: no-drag;
-}
-
-html[data-active='false'] {
-  opacity: 0;
-  transition: opacity 0.2s 0.1s;
-}
-
-html[data-active='true']:has([data-blur-background='true']) {
-  opacity: 1;
-  transition: opacity 0.2s;
-}
-
-html[data-active='false'] * {
-  -webkit-app-region: no-drag !important;
-}
-
 html,
 body {
   height: 100%;

diff --git a/packages/frontend/core/src/modules/app-tabs-header/services/app-tabs-header-service.ts b/packages/frontend/core/src/modules/app-tabs-header/services/app-tabs-header-service.ts
@@ -31,23 +31,63 @@ export class AppTabsHeaderService extends Service {
     []
   );
 
-  showContextMenu = async (workbenchId: string, viewIdx: number) => {
-    await apis?.ui.showTabContextMenu(workbenchId, viewIdx);
-  };
+  showContextMenu = apis?.ui.showTabContextMenu;
 
-  activateView = async (workbenchId: string, viewIdx: number) => {
-    await apis?.ui.activateView(workbenchId, viewIdx);
-  };
+  activateView = apis?.ui.activateView;
+
+  closeTab = apis?.ui.closeTab;
 
-  closeTab = async (workbenchId: string) => {
-    await apis?.ui.closeTab(workbenchId);
+  onAddTab = apis?.ui.addTab;
+
+  onAddDocTab = async (
+    docId: string,
+    targetTabId?: string,
+    edge?: 'left' | 'right'
+  ) => {
+    await apis?.ui.addTab({
+      view: {
+        path: {
+          pathname: '/' + docId,
+        },
+      },
+      target: targetTabId,
+      edge,
+    });
   };
 
-  onAddTab = async () => {
-    await apis?.ui.addTab();
+  onAddTagTab = async (
+    tagId: string,
+    targetTabId?: string,
+    edge?: 'left' | 'right'
+  ) => {
+    await apis?.ui.addTab({
+      view: {
+        path: {
+          pathname: '/tag/' + tagId,
+        },
+      },
+      target: targetTabId,
+      edge,
+    });
   };
 
-  onToggleRightSidebar = async () => {
-    await apis?.ui.toggleRightSidebar();
+  onAddCollectionTab = async (
+    collectionId: string,
+    targetTabId?: string,
+    edge?: 'left' | 'right'
+  ) => {
+    await apis?.ui.addTab({
+      view: {
+        path: {
+          pathname: '/collection/' + collectionId,
+        },
+      },
+      target: targetTabId,
+      edge,
+    });
   };
+
+  onToggleRightSidebar = apis?.ui.toggleRightSidebar;
+
+  moveTab = apis?.ui.moveTab;
 }