From f073df3ee5293be163f0b31f8fa3fa61d552c66c Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Mon, 9 Dec 2024 03:48:08 +0000
Subject: [PATCH] fix(mobile): backlink ordering in doc info (#9015)

fix AF-1885
---
 .../bi-directional-link-panel.css.ts          |  2 +-
 .../desktop/dialogs/doc-info/info-modal.tsx   | 40 +++++++++---------
 .../mobile/components/doc-info/doc-info.tsx   | 42 +++++++++----------
 3 files changed, 42 insertions(+), 42 deletions(-)

diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/bi-directional-link-panel.css.ts b/packages/frontend/core/src/components/blocksuite/block-suite-editor/bi-directional-link-panel.css.ts
index 6ee9a37150..509031c590 100644
--- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/bi-directional-link-panel.css.ts
+++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/bi-directional-link-panel.css.ts
@@ -88,13 +88,13 @@ globalStyle(`${link} .affine-reference-title`, {
 export const linkPreviewContainer = style({
   display: 'flex',
   flexDirection: 'column',
-  gap: '8px',
 });
 
 export const linkPreview = style({
   border: `1px solid ${cssVarV2('layer/insideBorder/border')}`,
   borderRadius: '8px',
   padding: '8px',
+  marginBottom: '8px',
   color: cssVarV2('text/primary'),
   ':hover': {
     backgroundColor: cssVarV2('layer/background/hoverOverlay'),
diff --git a/packages/frontend/core/src/desktop/dialogs/doc-info/info-modal.tsx b/packages/frontend/core/src/desktop/dialogs/doc-info/info-modal.tsx
index daeaedd375..2edaa3f217 100644
--- a/packages/frontend/core/src/desktop/dialogs/doc-info/info-modal.tsx
+++ b/packages/frontend/core/src/desktop/dialogs/doc-info/info-modal.tsx
@@ -95,26 +95,6 @@ export const InfoTable = ({
 
   return (
     <>
-      {backlinks && backlinks.length > 0 ? (
-        <>
-          <LinksRow
-            references={backlinks}
-            onClick={onClose}
-            label={t['com.affine.page-properties.backlinks']()}
-          />
-          <Divider size="thinner" />
-        </>
-      ) : null}
-      {links && links.length > 0 ? (
-        <>
-          <LinksRow
-            references={links}
-            onClick={onClose}
-            label={t['com.affine.page-properties.outgoing-links']()}
-          />
-          <Divider size="thinner" />
-        </>
-      ) : null}
       <PropertyCollapsibleSection
         title={t.t('com.affine.workspace.properties')}
       >
@@ -166,6 +146,26 @@ export const InfoTable = ({
       </PropertyCollapsibleSection>
       <Divider size="thinner" />
       <DocDatabaseBacklinkInfo onChange={onBacklinkPropertyChange} />
+      {backlinks && backlinks.length > 0 ? (
+        <>
+          <LinksRow
+            references={backlinks}
+            onClick={onClose}
+            label={t['com.affine.page-properties.backlinks']()}
+          />
+          <Divider size="thinner" />
+        </>
+      ) : null}
+      {links && links.length > 0 ? (
+        <>
+          <LinksRow
+            references={links}
+            onClick={onClose}
+            label={t['com.affine.page-properties.outgoing-links']()}
+          />
+          <Divider size="thinner" />
+        </>
+      ) : null}
     </>
   );
 };
diff --git a/packages/frontend/core/src/mobile/components/doc-info/doc-info.tsx b/packages/frontend/core/src/mobile/components/doc-info/doc-info.tsx
index 89bc1b5294..a959a7ce94 100644
--- a/packages/frontend/core/src/mobile/components/doc-info/doc-info.tsx
+++ b/packages/frontend/core/src/mobile/components/doc-info/doc-info.tsx
@@ -78,27 +78,6 @@ export const DocInfoSheet = ({
         <Suspense>
           <TimeRow docId={docId} className={styles.timeRow} />
           <Divider size="thinner" />
-          {backlinks && backlinks.length > 0 ? (
-            <>
-              <LinksRow
-                className={styles.linksRow}
-                references={backlinks}
-                label={t['com.affine.page-properties.backlinks']()}
-              />
-              <Divider size="thinner" />
-            </>
-          ) : null}
-          {links && links.length > 0 ? (
-            <>
-              <LinksRow
-                className={styles.linksRow}
-                references={links}
-                label={t['com.affine.page-properties.outgoing-links']()}
-              />
-              <Divider size="thinner" />
-            </>
-          ) : null}
-
           <PropertyCollapsibleSection
             title={t.t('com.affine.workspace.properties')}
           >
@@ -150,6 +129,27 @@ export const DocInfoSheet = ({
           <Divider size="thinner" />
 
           <DocDatabaseBacklinkInfo />
+
+          {backlinks && backlinks.length > 0 ? (
+            <>
+              <LinksRow
+                className={styles.linksRow}
+                references={backlinks}
+                label={t['com.affine.page-properties.backlinks']()}
+              />
+              <Divider size="thinner" />
+            </>
+          ) : null}
+          {links && links.length > 0 ? (
+            <>
+              <LinksRow
+                className={styles.linksRow}
+                references={links}
+                label={t['com.affine.page-properties.outgoing-links']()}
+              />
+              <Divider size="thinner" />
+            </>
+          ) : null}
         </Suspense>
       </Scrollable.Viewport>
       <Scrollable.Scrollbar className={styles.scrollBar} />