From 7adb89f1349337c6faf225c08fb1273ddb27b97c Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Wed, 20 Mar 2024 05:38:39 +0000
Subject: [PATCH] feat(core): open new page on meta-clicking a page link
 (#6220)

---
 .../modules/workbench/entities/workbench.ts   |  2 ++
 .../modules/workbench/view/workbench-link.tsx | 23 +++++++++++--------
 .../modules/workbench/view/workbench-root.tsx |  4 ++++
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/packages/frontend/core/src/modules/workbench/entities/workbench.ts b/packages/frontend/core/src/modules/workbench/entities/workbench.ts
index 79dc48e392..53f3dbabdf 100644
--- a/packages/frontend/core/src/modules/workbench/entities/workbench.ts
+++ b/packages/frontend/core/src/modules/workbench/entities/workbench.ts
@@ -23,6 +23,8 @@ export class Workbench {
     this.views.value[this.activeViewIndex.value]
   );
 
+  basename = new LiveData('/');
+
   location = LiveData.from(
     this.activeView.pipe(switchMap(view => view.location)),
     this.views.value[this.activeViewIndex.value].history.location
diff --git a/packages/frontend/core/src/modules/workbench/view/workbench-link.tsx b/packages/frontend/core/src/modules/workbench/view/workbench-link.tsx
index 1de3602356..ad75fa83f6 100644
--- a/packages/frontend/core/src/modules/workbench/view/workbench-link.tsx
+++ b/packages/frontend/core/src/modules/workbench/view/workbench-link.tsx
@@ -1,5 +1,6 @@
 import { useAppSettingHelper } from '@affine/core/hooks/affine/use-app-setting-helper';
 import { useService } from '@toeverything/infra/di';
+import { useLiveData } from '@toeverything/infra/livedata';
 import type { To } from 'history';
 import { useCallback } from 'react';
 
@@ -15,24 +16,28 @@ export const WorkbenchLink = ({
 >) => {
   const workbench = useService(Workbench);
   const { appSettings } = useAppSettingHelper();
+  const basename = useLiveData(workbench.basename);
   const handleClick = useCallback(
     (event: React.MouseEvent<HTMLAnchorElement>) => {
       event.preventDefault();
       event.stopPropagation();
-      // TODO: open this when multi view control is implemented
-      if (
-        appSettings.enableMultiView &&
-        environment.isDesktop &&
-        (event.ctrlKey || event.metaKey)
-      ) {
-        workbench.open(to, { at: 'beside' });
+
+      if (event.ctrlKey || event.metaKey) {
+        if (appSettings.enableMultiView && environment.isDesktop) {
+          workbench.open(to, { at: 'beside' });
+        } else if (!environment.isDesktop) {
+          const href =
+            typeof to === 'string'
+              ? to
+              : `${to.pathname}${to.search}${to.hash}`;
+          window.open(basename + href, '_blank');
+        }
       } else {
         workbench.open(to);
       }
-
       onClick?.(event);
     },
-    [appSettings.enableMultiView, onClick, to, workbench]
+    [appSettings.enableMultiView, basename, onClick, to, workbench]
   );
   return (
     <a {...other} href="#" onClick={handleClick}>
diff --git a/packages/frontend/core/src/modules/workbench/view/workbench-root.tsx b/packages/frontend/core/src/modules/workbench/view/workbench-root.tsx
index 771ca4d5cb..a7d1d4099b 100644
--- a/packages/frontend/core/src/modules/workbench/view/workbench-root.tsx
+++ b/packages/frontend/core/src/modules/workbench/view/workbench-root.tsx
@@ -39,6 +39,10 @@ export const WorkbenchRoot = () => {
     [workbench]
   );
 
+  useEffect(() => {
+    workbench.basename.next(basename);
+  }, [basename, workbench.basename]);
+
   return (
     <SplitView
       className={styles.workbenchRootContainer}