feat: convert date in page list

This commit is contained in:
QiShaoXuan
2022-12-13 17:40:31 +08:00
parent 6cb552d62f
commit 378fe52aec
8 changed files with 55 additions and 15 deletions
@@ -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;
@@ -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} />
@@ -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>
@@ -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) => {
@@ -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;
@@ -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 });
}
},