diff --git a/packages/frontend/core/src/pages/workspace/detail-page/detail-page.tsx b/packages/frontend/core/src/pages/workspace/detail-page/detail-page.tsx
index 17e81f22cdcc0..7982f4ed74f5f 100644
--- a/packages/frontend/core/src/pages/workspace/detail-page/detail-page.tsx
+++ b/packages/frontend/core/src/pages/workspace/detail-page/detail-page.tsx
@@ -277,7 +277,6 @@ const DetailPageImpl = memo(function DetailPageImpl() {
 export const DetailPage = ({ pageId }: { pageId: string }): ReactElement => {
   const currentWorkspace = useService(Workspace);
   const pageRecordList = useService(PageRecordList);
-
   const pageListReady = useLiveData(pageRecordList.isReady$);
 
   const pageRecords = useLiveData(pageRecordList.records$);
@@ -286,7 +285,6 @@ export const DetailPage = ({ pageId }: { pageId: string }): ReactElement => {
     () => pageRecords.find(page => page.id === pageId),
     [pageRecords, pageId]
   );
-
   const pageManager = useService(PageManager);
 
   const [page, setPage] = useState<Doc | null>(null);
@@ -318,6 +316,19 @@ export const DetailPage = ({ pageId }: { pageId: string }): ReactElement => {
     }
   }, [jumpOnce, pageRecord]);
 
+  useEffect(() => {
+    if (page && pageRecord?.meta?.trash) {
+      currentWorkspace.docCollection.awarenessStore.setReadonly(
+        page.blockSuiteDoc,
+        true
+      );
+    }
+  }, [
+    currentWorkspace.docCollection.awarenessStore,
+    page,
+    pageRecord?.meta?.trash,
+  ]);
+
   // if sync engine has been synced and the page is null, show 404 page.
   if (pageListReady && !page) {
     return <PageNotFound />;