feat: convert date in page list

packages/app/package.json

@@ -25,6 +25,7 @@
     "@toeverything/pathfinder-logger": "workspace:@pathfinder/logger@*",
     "cmdk": "^0.1.20",
     "css-spring": "^4.1.0",
+    "dayjs": "^1.11.7",
     "lit": "^2.3.1",
     "next": "13.0.1",
     "prettier": "^2.7.1",

packages/app/src/components/page-list/date-cell.tsx

@@ -0,0 +1,24 @@
+import localizedFormat from 'dayjs/plugin/localizedFormat';
+import dayjs from 'dayjs';
+import { PageMeta } from '@/providers/editor-provider';
+import { TableCell } from '@/ui/table';
+import React from 'react';
+
+dayjs.extend(localizedFormat);
+
+export const DateCell = ({
+  pageMeta,
+  dateKey,
+}: {
+  pageMeta: PageMeta;
+  dateKey: keyof PageMeta;
+}) => {
+  // dayjs().format('L LT');
+  return (
+    <TableCell ellipsis={true}>
+      {dayjs(pageMeta[dateKey] as string).format('YYYY-MM-DD HH:MM')}
+    </TableCell>
+  );
+};
+
+export default DateCell;

packages/app/src/components/page-list/index.tsx

@@ -12,6 +12,7 @@ import { OperationCell, TrashOperationCell } from './operation-cell';
 import Empty from './empty';
 import Link from 'next/link';
 import React from 'react';
+import DateCell from '@/components/page-list/date-cell';
 const FavoriteTag = ({ pageMeta }: { pageMeta: PageMeta }) => {
   const { toggleFavoritePage } = useEditor();
 
@@ -40,6 +41,7 @@ export const PageList = ({
   if (pageList.length === 0) {
     return <Empty />;
   }
+
   return (
     <StyledTableContainer>
       <Table>
@@ -48,7 +50,7 @@ export const PageList = ({
             <TableCell proportion={0.5}>Documents</TableCell>
             <TableCell proportion={0.2}>Created</TableCell>
             <TableCell proportion={0.2}>
-              {isTrash ? 'Uploaded' : 'Moved to Trash'}
+              {isTrash ? 'Moved to Trash' : 'Uploaded'}
             </TableCell>
             <TableCell proportion={0.1}></TableCell>
           </TableRow>
@@ -69,8 +71,11 @@ export const PageList = ({
                     {showFavoriteTag && <FavoriteTag pageMeta={pageMeta} />}
                   </StyledTitleWrapper>
                 </TableCell>
-                <TableCell ellipsis={true}>{pageMeta.createDate}</TableCell>
-                <TableCell ellipsis={true}>{pageMeta.createDate}</TableCell>
+                <DateCell pageMeta={pageMeta} dateKey="createDate" />
+                <DateCell
+                  pageMeta={pageMeta}
+                  dateKey={isTrash ? 'trashDate' : 'createDate'}
+                />
                 <TableCell style={{ padding: 0 }}>
                   {isTrash ? (
                     <TrashOperationCell pageMeta={pageMeta} />

packages/app/src/components/page-list/operation-cell.tsx

@@ -3,7 +3,15 @@ import { useConfirm } from '@/providers/confirm-provider';
 import { Menu, MenuItem } from '@/ui/menu';
 import { Wrapper } from '@/ui/layout';
 import { IconButton } from '@/ui/button';
-import { MoreVerticalIcon, RestoreIcon, DeleteIcon } from '@blocksuite/icons';
+import {
+  MoreVerticalIcon,
+  RestoreIcon,
+  DeleteIcon,
+  FavouritesIcon,
+  FavouritedIcon,
+  OpenInNewIcon,
+  TrashIcon,
+} from '@blocksuite/icons';
 import React from 'react';
 
 export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
@@ -17,6 +25,7 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
         onClick={() => {
           toggleFavoritePage(id);
         }}
+        icon={favorite ? <FavouritedIcon /> : <FavouritesIcon />}
       >
         {favorite ? 'Remove' : 'Add'} to favourites
       </MenuItem>
@@ -24,6 +33,7 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
         onClick={() => {
           openPage(id);
         }}
+        icon={<OpenInNewIcon />}
       >
         Open in new tab
       </MenuItem>
@@ -39,6 +49,7 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
             confirm && toggleDeletePage(id);
           });
         }}
+        icon={<TrashIcon />}
       >
         Delete
       </MenuItem>

packages/app/src/components/workspace-slider-bar/index.tsx

@@ -29,7 +29,7 @@ const FavoriteList = ({ showList }: { showList: boolean }) => {
   const { pageList, openPage } = useEditor();
   const router = useRouter();
 
-  const favoriteList = pageList.filter(p => p.favorite);
+  const favoriteList = pageList.filter(p => p.favorite && !p.trash);
   return (
     <Collapse in={showList}>
       {favoriteList.map((pageMeta, index) => {

packages/app/src/providers/editor-provider/interface.ts

@@ -17,8 +17,6 @@ export type EditorHandlers = {
     query?: { [key: string]: string }
   ) => Promise<boolean>;
   getPageMeta: (pageId: string) => PageMeta | void;
-  deletePage: (pageId: string) => void;
-  recyclePage: (pageId: string) => void;
   toggleDeletePage: (pageId: string) => void;
   favoritePage: (pageId: string) => void;
   unFavoritePage: (pageId: string) => void;

packages/app/src/providers/editor-provider/useEditorHandler.ts

@@ -26,15 +26,10 @@ export const useEditorHandler = (workspace?: Workspace): EditorHandlers => {
         },
       });
     },
-    deletePage: pageId => {
-      workspace!.setPageMeta(pageId, { trash: true });
-    },
-    recyclePage: pageId => {
-      workspace!.setPageMeta(pageId, { trash: false });
-    },
     toggleDeletePage: pageId => {
       const pageMeta = workspace!.meta.pageMetas.find(p => p.id === pageId);
       if (pageMeta) {
+        workspace!.meta.setPage(pageId, { trashDate: new Date().getTime() });
         workspace!.setPageMeta(pageId, { trash: !pageMeta.trash });
       }
     },

pnpm-lock.yaml

@@ -41,6 +41,7 @@ importers:
       '@types/react-dom': 18.0.6
       cmdk: ^0.1.20
       css-spring: ^4.1.0
+      dayjs: ^1.11.7
       eslint: 8.22.0
       eslint-config-next: 12.3.1
       eslint-config-prettier: ^8.5.0
@@ -70,6 +71,7 @@ importers:
       '@toeverything/pathfinder-logger': link:../logger
       cmdk: 0.1.20_7ey2zzynotv32rpkwno45fsx4e
       css-spring: 4.1.0
+      dayjs: 1.11.7
       lit: 2.4.0
       next: 13.0.1_biqbaboplfbrettd7655fr4n2y
       prettier: 2.7.1
@@ -1579,6 +1581,10 @@ packages:
     resolution: {integrity: sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==}
     dev: true
 
+  /dayjs/1.11.7:
+    resolution: {integrity: sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==}
+    dev: false
+
   /debug/2.6.9:
     resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
     peerDependencies:
@@ -1877,7 +1883,7 @@ packages:
       eslint-import-resolver-webpack:
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.38.0_eslint@8.22.0
+      '@typescript-eslint/parser': 5.38.0_76twfck5d7crjqrmw4yltga7zm
       debug: 3.2.7
       eslint: 8.22.0
       eslint-import-resolver-node: 0.3.6
@@ -1896,7 +1902,7 @@ packages:
       '@typescript-eslint/parser':
         optional: true
     dependencies:
-      '@typescript-eslint/parser': 5.38.0_eslint@8.22.0
+      '@typescript-eslint/parser': 5.38.0_76twfck5d7crjqrmw4yltga7zm
       array-includes: 3.1.5
       array.prototype.flat: 1.3.0
       debug: 2.6.9