From 48c26017ae7cda63ac8ee4c8841b84a838ff6f25 Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Fri, 24 Jan 2025 03:46:24 +0000
Subject: [PATCH] fix(core): database properties in info flickering issue
 (#9872)

fix af-2123
---
 .../src/components/doc-properties/table.tsx   | 25 ++++++++++---------
 1 file changed, 13 insertions(+), 12 deletions(-)

diff --git a/packages/frontend/core/src/components/doc-properties/table.tsx b/packages/frontend/core/src/components/doc-properties/table.tsx
index 13a0258bb8..7dc73b7b00 100644
--- a/packages/frontend/core/src/components/doc-properties/table.tsx
+++ b/packages/frontend/core/src/components/doc-properties/table.tsx
@@ -29,7 +29,7 @@ import {
 } from '@toeverything/infra';
 import clsx from 'clsx';
 import type React from 'react';
-import { forwardRef, useCallback, useState } from 'react';
+import { forwardRef, useCallback, useMemo, useState } from 'react';
 
 import { DocPropertyIcon } from './icons/doc-property-icon';
 import { CreatePropertyMenuItems } from './menu/create-doc-property';
@@ -401,6 +401,17 @@ const DocPropertiesTableInner = ({
   className,
 }: DocPropertiesTableProps) => {
   const [expanded, setExpanded] = useState(!!defaultOpenProperty);
+  const defaultOpen = useMemo(() => {
+    return defaultOpenProperty?.type === 'database'
+      ? [
+          {
+            databaseBlockId: defaultOpenProperty.databaseId,
+            rowId: defaultOpenProperty.databaseRowId,
+            docId: defaultOpenProperty.docId,
+          },
+        ]
+      : [];
+  }, [defaultOpenProperty]);
   return (
     <div className={clsx(styles.root, className)}>
       <Collapsible.Root open={expanded} onOpenChange={setExpanded}>
@@ -421,17 +432,7 @@ const DocPropertiesTableInner = ({
           <div className={styles.tableHeaderDivider} />
           <DocDatabaseBacklinkInfo
             onChange={onDatabasePropertyChange}
-            defaultOpen={
-              defaultOpenProperty?.type === 'database'
-                ? [
-                    {
-                      databaseBlockId: defaultOpenProperty.databaseId,
-                      rowId: defaultOpenProperty.databaseRowId,
-                      docId: defaultOpenProperty.docId,
-                    },
-                  ]
-                : []
-            }
+            defaultOpen={defaultOpen}
           />
         </Collapsible.Content>
       </Collapsible.Root>