fix: detail reduction of UI (#1131)

This commit is contained in:
Qi
2023-02-22 11:12:34 +08:00
committed by GitHub
parent 0b072da346
commit 7163ea6c4b
30 changed files with 122 additions and 104 deletions

View File

@@ -16,7 +16,7 @@
"dependencies": { "dependencies": {
"@blocksuite/blocks": "0.4.1", "@blocksuite/blocks": "0.4.1",
"@blocksuite/editor": "0.4.1", "@blocksuite/editor": "0.4.1",
"@blocksuite/icons": "2.0.12", "@blocksuite/icons": "2.0.17",
"@blocksuite/store": "0.4.1", "@blocksuite/store": "0.4.1",
"@emotion/react": "^11.10.6", "@emotion/react": "^11.10.6",
"@emotion/styled": "^11.10.6", "@emotion/styled": "^11.10.6",

View File

@@ -16,7 +16,7 @@
"@blocksuite/blocks": "0.4.1", "@blocksuite/blocks": "0.4.1",
"@blocksuite/editor": "0.4.1", "@blocksuite/editor": "0.4.1",
"@blocksuite/global": "0.4.1", "@blocksuite/global": "0.4.1",
"@blocksuite/icons": "2.0.12", "@blocksuite/icons": "2.0.17",
"@blocksuite/store": "0.4.1", "@blocksuite/store": "0.4.1",
"@emotion/css": "^11.10.6", "@emotion/css": "^11.10.6",
"@emotion/react": "^11.10.6", "@emotion/react": "^11.10.6",

View File

@@ -1,6 +1,6 @@
import { IconButton, IconButtonProps } from '@affine/component'; import { IconButton, IconButtonProps } from '@affine/component';
import { styled } from '@affine/component'; import { styled } from '@affine/component';
import { ArrowDownIcon } from '@blocksuite/icons'; import { ArrowDownSmallIcon } from '@blocksuite/icons';
import React from 'react'; import React from 'react';
import { useModal } from '@/store/globalModal'; import { useModal } from '@/store/globalModal';
@@ -34,7 +34,7 @@ export const QuickSearchButton = ({
triggerQuickSearchModal(); triggerQuickSearchModal();
}} }}
> >
<ArrowDownIcon /> <ArrowDownSmallIcon />
</StyledIconButtonWithAnimate> </StyledIconButtonWithAnimate>
); );
}; };

View File

@@ -3,15 +3,15 @@ import { IconButton } from '@affine/component';
import { toast } from '@affine/component'; import { toast } from '@affine/component';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { import {
DeleteTemporarilyIcon,
EdgelessIcon, EdgelessIcon,
ExportIcon, ExportIcon,
ExportToHtmlIcon, ExportToHtmlIcon,
ExportToMarkdownIcon, ExportToMarkdownIcon,
FavouritedIcon, FavoritedIcon,
FavouritesIcon, FavoriteIcon,
MoreVerticalIcon, MoreVerticalIcon,
PaperIcon, PaperIcon,
TrashIcon,
} from '@blocksuite/icons'; } from '@blocksuite/icons';
import useCurrentPageMeta from '@/hooks/use-current-page-meta'; import useCurrentPageMeta from '@/hooks/use-current-page-meta';
@@ -41,9 +41,9 @@ const PopoverContent = () => {
favorite ? t('Removed from Favorites') : t('Added to Favorites') favorite ? t('Removed from Favorites') : t('Added to Favorites')
); );
}} }}
icon={favorite ? <FavouritedIcon /> : <FavouritesIcon />} icon={favorite ? <FavoritedIcon /> : <FavoriteIcon />}
> >
{favorite ? t('Remove from favorites') : t('Add to favorites')} {favorite ? t('Remove from favorites') : t('Add to Favorites')}
</MenuItem> </MenuItem>
<MenuItem <MenuItem
icon={mode === 'page' ? <EdgelessIcon /> : <PaperIcon />} icon={mode === 'page' ? <EdgelessIcon /> : <PaperIcon />}
@@ -97,7 +97,7 @@ const PopoverContent = () => {
confirm && toast(t('Moved to Trash')); confirm && toast(t('Moved to Trash'));
}); });
}} }}
icon={<TrashIcon />} icon={<DeleteTemporarilyIcon />}
> >
{t('Delete')} {t('Delete')}
</MenuItem> </MenuItem>
@@ -107,7 +107,7 @@ const PopoverContent = () => {
export const EditorOptionMenu = () => { export const EditorOptionMenu = () => {
return ( return (
<Menu content={<PopoverContent />} placement="bottom-end"> <Menu content={<PopoverContent />} placement="bottom-end" trigger="click">
<IconButton> <IconButton>
<MoreVerticalIcon /> <MoreVerticalIcon />
</IconButton> </IconButton>

View File

@@ -1,4 +1,4 @@
import { TableCell } from '@affine/component'; import { TableCell, TableCellProps } from '@affine/component';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import localizedFormat from 'dayjs/plugin/localizedFormat'; import localizedFormat from 'dayjs/plugin/localizedFormat';
import React from 'react'; import React from 'react';
@@ -11,15 +11,15 @@ export const DateCell = ({
pageMeta, pageMeta,
dateKey, dateKey,
backupKey = '', backupKey = '',
...props
}: { }: {
pageMeta: PageMeta; pageMeta: PageMeta;
dateKey: keyof PageMeta; dateKey: keyof PageMeta;
backupKey?: keyof PageMeta; backupKey?: keyof PageMeta;
}) => { } & Omit<TableCellProps, 'children'>) => {
// dayjs().format('L LT');
const value = pageMeta[dateKey] ?? pageMeta[backupKey]; const value = pageMeta[dateKey] ?? pageMeta[backupKey];
return ( return (
<TableCell ellipsis={true}> <TableCell ellipsis={true} {...props}>
{value ? dayjs(value as string).format('YYYY-MM-DD HH:mm') : '--'} {value ? dayjs(value as string).format('YYYY-MM-DD HH:mm') : '--'}
</TableCell> </TableCell>
); );

View File

@@ -8,13 +8,13 @@ import {
import { toast } from '@affine/component'; import { toast } from '@affine/component';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { import {
DeleteForeverIcon, DeletePermanentlyIcon,
FavouritedIcon, DeleteTemporarilyIcon,
FavouritesIcon, FavoritedIcon,
FavoriteIcon,
MoreVerticalIcon, MoreVerticalIcon,
OpenInNewIcon, OpenInNewIcon,
RestoreIcon, ResetIcon,
TrashIcon,
} from '@blocksuite/icons'; } from '@blocksuite/icons';
import { usePageHelper } from '@/hooks/use-page-helper'; import { usePageHelper } from '@/hooks/use-page-helper';
@@ -36,9 +36,9 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
favorite ? t('Removed from Favorites') : t('Added to Favorites') favorite ? t('Removed from Favorites') : t('Added to Favorites')
); );
}} }}
icon={favorite ? <FavouritedIcon /> : <FavouritesIcon />} icon={favorite ? <FavoritedIcon /> : <FavoriteIcon />}
> >
{favorite ? t('Remove from favorites') : t('Add to favorites')} {favorite ? t('Remove from favorites') : t('Add to Favorites')}
</MenuItem> </MenuItem>
<MenuItem <MenuItem
onClick={() => { onClick={() => {
@@ -62,7 +62,7 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
confirm && toast(t('Moved to Trash')); confirm && toast(t('Moved to Trash'));
}); });
}} }}
icon={<TrashIcon />} icon={<DeleteTemporarilyIcon />}
> >
{t('Delete')} {t('Delete')}
</MenuItem> </MenuItem>
@@ -70,7 +70,12 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
); );
return ( return (
<FlexWrapper alignItems="center" justifyContent="center"> <FlexWrapper alignItems="center" justifyContent="center">
<Menu content={OperationMenu} placement="bottom-end" disablePortal={true}> <Menu
content={OperationMenu}
placement="bottom-end"
disablePortal={true}
trigger="click"
>
<IconButton darker={true}> <IconButton darker={true}>
<MoreVerticalIcon /> <MoreVerticalIcon />
</IconButton> </IconButton>
@@ -99,7 +104,7 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
openPage(id); openPage(id);
}} }}
> >
<RestoreIcon /> <ResetIcon />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
<Tooltip content={t('Delete permanently')} placement="top-start"> <Tooltip content={t('Delete permanently')} placement="top-start">
@@ -117,7 +122,7 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
}); });
}} }}
> >
<DeleteForeverIcon /> <DeletePermanentlyIcon />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
</FlexWrapper> </FlexWrapper>

View File

@@ -5,15 +5,12 @@ import {
TableHead, TableHead,
TableRow, TableRow,
} from '@affine/component'; } from '@affine/component';
import { Content } from '@affine/component'; import { Content, IconButton, toast, Tooltip } from '@affine/component';
import { IconButton } from '@affine/component';
import { Tooltip } from '@affine/component';
import { toast } from '@affine/component';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { import {
EdgelessIcon, EdgelessIcon,
FavouritedIcon, FavoritedIcon,
FavouritesIcon, FavoriteIcon,
PaperIcon, PaperIcon,
} from '@blocksuite/icons'; } from '@blocksuite/icons';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
@@ -62,9 +59,9 @@ const FavoriteTag = ({
className={favorite ? '' : 'favorite-button'} className={favorite ? '' : 'favorite-button'}
> >
{favorite ? ( {favorite ? (
<FavouritedIcon data-testid="favorited-icon" /> <FavoritedIcon data-testid="favorited-icon" />
) : ( ) : (
<FavouritesIcon /> <FavoriteIcon />
)} )}
</IconButton> </IconButton>
</Tooltip> </Tooltip>
@@ -108,11 +105,8 @@ export const PageList = ({
</TableHead> </TableHead>
<TableBody> <TableBody>
{pageList.map((pageMeta, index) => { {pageList.map((pageMeta, index) => {
return ( // On click event must be set on the table cell, since the last operation cell is not clickable, and if set on the row, the menu will have bug on close.
<StyledTableRow const onClick = () => {
data-testid="page-list-item"
key={`${pageMeta.id}-${index}`}
onClick={() => {
if (isPublic) { if (isPublic) {
router.push( router.push(
`/public-workspace/${router.query.workspaceId}/${pageMeta.id}` `/public-workspace/${router.query.workspaceId}/${pageMeta.id}`
@@ -122,9 +116,13 @@ export const PageList = ({
`/workspace/${currentWorkspace?.id}/${pageMeta.id}` `/workspace/${currentWorkspace?.id}/${pageMeta.id}`
); );
} }
}} };
return (
<StyledTableRow
data-testid="page-list-item"
key={`${pageMeta.id}-${index}`}
> >
<TableCell> <TableCell onClick={onClick}>
<StyledTitleWrapper> <StyledTitleWrapper>
<StyledTitleLink> <StyledTitleLink>
{pageMeta.mode === 'edgeless' ? ( {pageMeta.mode === 'edgeless' ? (
@@ -139,19 +137,21 @@ export const PageList = ({
{showFavoriteTag && <FavoriteTag pageMeta={pageMeta} />} {showFavoriteTag && <FavoriteTag pageMeta={pageMeta} />}
</StyledTitleWrapper> </StyledTitleWrapper>
</TableCell> </TableCell>
<DateCell pageMeta={pageMeta} dateKey="createDate" /> <DateCell
pageMeta={pageMeta}
dateKey="createDate"
onClick={onClick}
/>
<DateCell <DateCell
pageMeta={pageMeta} pageMeta={pageMeta}
dateKey={isTrash ? 'trashDate' : 'updatedDate'} dateKey={isTrash ? 'trashDate' : 'updatedDate'}
backupKey={isTrash ? 'trashDate' : 'createDate'} backupKey={isTrash ? 'trashDate' : 'createDate'}
onClick={onClick}
/> />
{!isPublic ? ( {!isPublic && (
<TableCell <TableCell
style={{ padding: 0 }} style={{ padding: 0 }}
data-testid={`more-actions-${pageMeta.id}`} data-testid={`more-actions-${pageMeta.id}`}
onClick={e => {
e.stopPropagation();
}}
> >
{isTrash ? ( {isTrash ? (
<TrashOperationCell pageMeta={pageMeta} /> <TrashOperationCell pageMeta={pageMeta} />
@@ -159,7 +159,7 @@ export const PageList = ({
<OperationCell pageMeta={pageMeta} /> <OperationCell pageMeta={pageMeta} />
)} )}
</TableCell> </TableCell>
) : null} )}
</StyledTableRow> </StyledTableRow>
); );
})} })}

View File

@@ -1,9 +1,9 @@
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { import {
AllPagesIcon, DeleteTemporarilyIcon,
FavouritesIcon, FavoriteIcon,
FolderIcon,
SettingsIcon, SettingsIcon,
TrashIcon,
} from '@blocksuite/icons'; } from '@blocksuite/icons';
import { FC, SVGProps } from 'react'; import { FC, SVGProps } from 'react';
@@ -19,14 +19,14 @@ export const useSwitchToConfig = (
{ {
title: t('All pages'), title: t('All pages'),
href: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/all` : '', href: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/all` : '',
icon: AllPagesIcon, icon: FolderIcon,
}, },
{ {
title: t('Favorites'), title: t('Favorites'),
href: currentWorkspaceId href: currentWorkspaceId
? `/workspace/${currentWorkspaceId}/favorite` ? `/workspace/${currentWorkspaceId}/favorite`
: '', : '',
icon: FavouritesIcon, icon: FavoriteIcon,
}, },
{ {
title: t('Workspace Settings'), title: t('Workspace Settings'),
@@ -38,7 +38,7 @@ export const useSwitchToConfig = (
{ {
title: t('Trash'), title: t('Trash'),
href: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/trash` : '', href: currentWorkspaceId ? `/workspace/${currentWorkspaceId}/trash` : '',
icon: TrashIcon, icon: DeleteTemporarilyIcon,
}, },
]; ];
}; };

View File

@@ -102,7 +102,7 @@ export const StyledModalDivider = styled('div')(({ theme }) => {
height: '0', height: '0',
margin: '6px 16px 6.5px 16px', margin: '6px 16px 6.5px 16px',
position: 'relative', position: 'relative',
borderTop: `0.5px solid ${theme.colors.placeHolderColor}`, borderTop: `0.5px solid ${theme.colors.borderColor}`,
transition: 'all 0.15s', transition: 'all 0.15s',
}; };
}); });

View File

@@ -3,7 +3,7 @@ import { Button } from '@affine/component';
import { Menu, MenuItem } from '@affine/component'; import { Menu, MenuItem } from '@affine/component';
import { LOCALES } from '@affine/i18n'; import { LOCALES } from '@affine/i18n';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { ArrowDownIcon } from '@blocksuite/icons'; import { ArrowDownSmallIcon } from '@blocksuite/icons';
const LanguageMenuContent = () => { const LanguageMenuContent = () => {
const { i18n } = useTranslation(); const { i18n } = useTranslation();
@@ -41,7 +41,7 @@ export const LanguageMenu = () => {
disablePortal={true} disablePortal={true}
> >
<Button <Button
icon={<ArrowDownIcon />} icon={<ArrowDownSmallIcon />}
iconPosition="end" iconPosition="end"
noBorder={true} noBorder={true}
style={{ textTransform: 'capitalize' }} style={{ textTransform: 'capitalize' }}

View File

@@ -10,7 +10,7 @@ export const StyledSplitLine = styled.div(({ theme }) => {
return { return {
width: '1px', width: '1px',
height: '20px', height: '20px',
background: theme.colors.iconColor, background: theme.colors.borderColor,
marginRight: '24px', marginRight: '24px',
}; };
}); });

View File

@@ -3,6 +3,8 @@ import { Button } from '@affine/component';
import { WorkspaceUnit } from '@affine/datacenter'; import { WorkspaceUnit } from '@affine/datacenter';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
export const ExportPage = ({ workspace }: { workspace: WorkspaceUnit }) => { export const ExportPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
console.log('workspace', workspace);
const { t } = useTranslation(); const { t } = useTranslation();
return ( return (
<> <>

View File

@@ -42,6 +42,7 @@ export const WorkspaceDelete = ({
onClose(); onClose();
router.push(`/workspace`); router.push(`/workspace`);
}; };
console.log('workspace', workspace);
return ( return (
<Modal open={open} onClose={onClose}> <Modal open={open} onClose={onClose}>

View File

@@ -50,7 +50,7 @@ export const InviteMemberModal = ({
onInviteSuccess, onInviteSuccess,
}: LoginModalProps) => { }: LoginModalProps) => {
const [email, setEmail] = useState<string>(''); const [email, setEmail] = useState<string>('');
const [showMember, setShowMember] = useState<boolean>(false); const [showMember, setShowMember] = useState<boolean>(true);
const [showTip, setShowTip] = useState<boolean>(false); const [showTip, setShowTip] = useState<boolean>(false);
const [userData, setUserData] = useState<User | null>(null); const [userData, setUserData] = useState<User | null>(null);
const { inviteMember, getUserByEmail } = useMembers(); const { inviteMember, getUserByEmail } = useMembers();
@@ -90,7 +90,7 @@ export const InviteMemberModal = ({
value={email} value={email}
onChange={inputChange} onChange={inputChange}
onBlur={() => { onBlur={() => {
setShowMember(false); // setShowMember(false);
}} }}
placeholder={t('Invite placeholder')} placeholder={t('Invite placeholder')}
></Input> ></Input>
@@ -211,7 +211,6 @@ const MemberIcon = styled('div')(({ theme }) => {
borderRadius: '50%', borderRadius: '50%',
color: theme.colors.primaryColor, color: theme.colors.primaryColor,
background: '#F5F5F5', background: '#F5F5F5',
marginRight: '8px',
textAlign: 'center', textAlign: 'center',
lineHeight: '45px', lineHeight: '45px',
// icon size // icon size
@@ -231,5 +230,6 @@ const Email = styled('div')(({ theme }) => {
overflow: 'hidden', overflow: 'hidden',
textOverflow: 'ellipsis', textOverflow: 'ellipsis',
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
marginLeft: '8px',
}; };
}); });

View File

@@ -5,7 +5,11 @@ import { toast } from '@affine/component';
import { FlexWrapper } from '@affine/component'; import { FlexWrapper } from '@affine/component';
import { WorkspaceUnit } from '@affine/datacenter'; import { WorkspaceUnit } from '@affine/datacenter';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { EmailIcon, MoreVerticalIcon, TrashIcon } from '@blocksuite/icons'; import {
DeleteTemporarilyIcon,
EmailIcon,
MoreVerticalIcon,
} from '@blocksuite/icons';
import { useState } from 'react'; import { useState } from 'react';
import Loading from '@/components/loading'; import Loading from '@/components/loading';
@@ -111,7 +115,7 @@ export const MembersPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
}) })
); );
}} }}
icon={<TrashIcon />} icon={<DeleteTemporarilyIcon />}
> >
{t('Remove from workspace')} {t('Remove from workspace')}
</MenuItem> </MenuItem>
@@ -119,6 +123,7 @@ export const MembersPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
} }
placement="bottom-end" placement="bottom-end"
disablePortal={true} disablePortal={true}
trigger="click"
> >
<IconButton> <IconButton>
<MoreVerticalIcon /> <MoreVerticalIcon />

View File

@@ -3,13 +3,13 @@ import { Tooltip } from '@affine/component';
import { IconButton } from '@affine/component'; import { IconButton } from '@affine/component';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { import {
AllPagesIcon, ArrowDownSmallIcon,
ArrowDownIcon, DeleteTemporarilyIcon,
FavouritesIcon, FavoriteIcon,
FolderIcon,
PlusIcon, PlusIcon,
SearchIcon, SearchIcon,
SettingsIcon, SettingsIcon,
TrashIcon,
} from '@blocksuite/icons'; } from '@blocksuite/icons';
import Link from 'next/link'; import Link from 'next/link';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
@@ -127,13 +127,13 @@ export const WorkSpaceSliderBar = () => {
</StyledListItem> </StyledListItem>
<Link href={{ pathname: paths.all }}> <Link href={{ pathname: paths.all }}>
<StyledListItem active={router.asPath === paths.all}> <StyledListItem active={router.asPath === paths.all}>
<AllPagesIcon /> <FolderIcon />
<span data-testid="all-pages">{t('All pages')}</span> <span data-testid="all-pages">{t('All pages')}</span>
</StyledListItem> </StyledListItem>
</Link> </Link>
<StyledListItem active={router.asPath === paths.favorite}> <StyledListItem active={router.asPath === paths.favorite}>
<StyledLink href={{ pathname: paths.favorite }}> <StyledLink href={{ pathname: paths.favorite }}>
<FavouritesIcon /> <FavoriteIcon />
{t('Favorites')} {t('Favorites')}
</StyledLink> </StyledLink>
<IconButton <IconButton
@@ -142,7 +142,7 @@ export const WorkSpaceSliderBar = () => {
setShowSubFavorite(!showSubFavorite); setShowSubFavorite(!showSubFavorite);
}} }}
> >
<ArrowDownIcon <ArrowDownSmallIcon
style={{ style={{
transform: `rotate(${showSubFavorite ? '180' : '0'}deg)`, transform: `rotate(${showSubFavorite ? '180' : '0'}deg)`,
}} }}
@@ -174,7 +174,7 @@ export const WorkSpaceSliderBar = () => {
<Link href={{ pathname: paths.trash }}> <Link href={{ pathname: paths.trash }}>
<StyledListItem active={router.asPath === paths.trash}> <StyledListItem active={router.asPath === paths.trash}>
<TrashIcon /> {t('Trash')} <DeleteTemporarilyIcon /> {t('Trash')}
</StyledListItem> </StyledListItem>
</Link> </Link>
<StyledNewPageButton <StyledNewPageButton

View File

@@ -1,5 +1,5 @@
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { AllPagesIcon } from '@blocksuite/icons'; import { FolderIcon } from '@blocksuite/icons';
import Head from 'next/head'; import Head from 'next/head';
import { ReactElement, useCallback } from 'react'; import { ReactElement, useCallback } from 'react';
@@ -18,7 +18,7 @@ const All = () => {
<Head> <Head>
<title>{t('All pages')} - AFFiNE</title> <title>{t('All pages')} - AFFiNE</title>
</Head> </Head>
<PageListHeader icon={<AllPagesIcon />}>{t('All pages')}</PageListHeader> <PageListHeader icon={<FolderIcon />}>{t('All pages')}</PageListHeader>
<PageList <PageList
pageList={pageList.filter(p => !p.trash)} pageList={pageList.filter(p => !p.trash)}
showFavoriteTag={true} showFavoriteTag={true}

View File

@@ -1,5 +1,5 @@
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { FavouritesIcon } from '@blocksuite/icons'; import { FavoriteIcon } from '@blocksuite/icons';
import Head from 'next/head'; import Head from 'next/head';
import { ReactElement } from 'react'; import { ReactElement } from 'react';
@@ -16,9 +16,7 @@ export const Favorite = () => {
<Head> <Head>
<title>{t('Favorites')} - AFFiNE</title> <title>{t('Favorites')} - AFFiNE</title>
</Head> </Head>
<PageListHeader icon={<FavouritesIcon />}> <PageListHeader icon={<FavoriteIcon />}>{t('Favorites')}</PageListHeader>
{t('Favorites')}
</PageListHeader>
<PageList <PageList
pageList={pageList.filter(p => p.favorite && !p.trash)} pageList={pageList.filter(p => p.favorite && !p.trash)}
showFavoriteTag={true} showFavoriteTag={true}

View File

@@ -1,5 +1,5 @@
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import { TrashIcon } from '@blocksuite/icons'; import { DeleteTemporarilyIcon } from '@blocksuite/icons';
import Head from 'next/head'; import Head from 'next/head';
import { ReactElement, useCallback } from 'react'; import { ReactElement, useCallback } from 'react';
@@ -18,7 +18,9 @@ export const Trash = () => {
<Head> <Head>
<title>{t('Trash')} - AFFiNE</title> <title>{t('Trash')} - AFFiNE</title>
</Head> </Head>
<PageListHeader icon={<TrashIcon />}>{t('Trash')}</PageListHeader> <PageListHeader icon={<DeleteTemporarilyIcon />}>
{t('Trash')}
</PageListHeader>
<PageList <PageList
pageList={pageList.filter(p => p.trash)} pageList={pageList.filter(p => p.trash)}
isTrash={true} isTrash={true}

View File

@@ -17,7 +17,7 @@ export const getLightTheme = (
primaryColor: '#6880FF', primaryColor: '#6880FF',
pageBackground: '#fff', pageBackground: '#fff',
hoverBackground: '#F1F3FF', hoverBackground: '#F1F3FF',
innerHoverBackground: '#E9E9EC', innerHoverBackground: '#E0E6FF',
popoverBackground: '#fff', popoverBackground: '#fff',
tooltipBackground: '#6880FF', tooltipBackground: '#6880FF',
codeBackground: '#f2f5f9', codeBackground: '#f2f5f9',

View File

@@ -151,7 +151,7 @@ export const Popper = ({
onPointerLeave={onPointerLeaveHandler} onPointerLeave={onPointerLeaveHandler}
style={popoverStyle} style={popoverStyle}
className={popoverClassName} className={popoverClassName}
onClick={() => { onClick={e => {
if (hasClickTrigger && !visibleControlledByParent) { if (hasClickTrigger && !visibleControlledByParent) {
setVisible(false); setVisible(false);
} }

View File

@@ -1,13 +1,6 @@
import { HTMLAttributes, PropsWithChildren } from 'react';
import { TableCellProps } from './interface'; import { TableCellProps } from './interface';
import { StyledTableCell } from './styles'; import { StyledTableCell } from './styles';
export const TableCell = ({ export const TableCell = ({ children, ...props }: TableCellProps) => {
children,
...props
}: PropsWithChildren<
TableCellProps & HTMLAttributes<HTMLTableCellElement>
>) => {
return <StyledTableCell {...props}>{children}</StyledTableCell>; return <StyledTableCell {...props}>{children}</StyledTableCell>;
}; };

View File

@@ -5,6 +5,7 @@
// import TableRow from '@mui/material/TableRow'; // import TableRow from '@mui/material/TableRow';
// //
export * from './interface';
export * from './Table'; export * from './Table';
export * from './TableBody'; export * from './TableBody';
export * from './TableCell'; export * from './TableCell';

View File

@@ -1,8 +1,9 @@
import { CSSProperties } from 'react'; import { CSSProperties, HTMLAttributes, PropsWithChildren } from 'react';
export type TableCellProps = { export type TableCellProps = {
align?: 'left' | 'right' | 'center'; align?: 'left' | 'right' | 'center';
ellipsis?: boolean; ellipsis?: boolean;
proportion?: number; proportion?: number;
style?: CSSProperties; style?: CSSProperties;
}; } & PropsWithChildren &
HTMLAttributes<HTMLTableCellElement>;

View File

@@ -29,7 +29,7 @@
"Sign out description": "Nach dem Abmelden gehen alle nicht synchronisierten Inhalte verloren.", "Sign out description": "Nach dem Abmelden gehen alle nicht synchronisierten Inhalte verloren.",
"Joined Workspace": "Workspace beigetreten", "Joined Workspace": "Workspace beigetreten",
"404 - Page Not Found": "404 - Seite nicht gefunden", "404 - Page Not Found": "404 - Seite nicht gefunden",
"Add to favorites": "Zu Favoriten hinzufügen", "Add to Favorites": "Zu Favoriten hinzufügen",
"Added to Favorites": "Zu Favoriten hinzugefügt", "Added to Favorites": "Zu Favoriten hinzugefügt",
"All pages": "Alle Seiten", "All pages": "Alle Seiten",
"Bold": "Fett", "Bold": "Fett",

View File

@@ -23,7 +23,7 @@
"Find results": "Find {{number}} results", "Find results": "Find {{number}} results",
"Collapse sidebar": "Collapse sidebar", "Collapse sidebar": "Collapse sidebar",
"Expand sidebar": "Expand sidebar", "Expand sidebar": "Expand sidebar",
"Add to favorites": "Add to favorites", "Add to Favorites": "Add to Favorites",
"Paper": "Paper", "Paper": "Paper",
"Edgeless": "Edgeless", "Edgeless": "Edgeless",
"Added to Favorites": "Added to Favorites", "Added to Favorites": "Added to Favorites",

View File

@@ -22,7 +22,7 @@
"Sign out description": "Se déconnecter provoquera la perte du contenu non synchronisé.", "Sign out description": "Se déconnecter provoquera la perte du contenu non synchronisé.",
"404 - Page Not Found": "Erreur 404 - Page non trouvée", "404 - Page Not Found": "Erreur 404 - Page non trouvée",
"AFFiNE Community": "Communauté AFFiNE", "AFFiNE Community": "Communauté AFFiNE",
"Add to favorites": "Ajouter aux favoris", "Add to Favorites": "Ajouter aux favoris",
"Added to Favorites": "Ajouté aux favoris ", "Added to Favorites": "Ajouté aux favoris ",
"All pages": "Toutes les pages", "All pages": "Toutes les pages",
"Bold": "Gras", "Bold": "Gras",

View File

@@ -39,7 +39,7 @@
"Copied link to clipboard": "Ссылка скопирована в буфер обмена", "Copied link to clipboard": "Ссылка скопирована в буфер обмена",
"Delete Member?": "Удалить участника?", "Delete Member?": "Удалить участника?",
"404 - Page Not Found": "404 - Страница не найдена", "404 - Page Not Found": "404 - Страница не найдена",
"Add to favorites": "Добавить в избранное", "Add to Favorites": "Добавить в избранное",
"Added to Favorites": "Добавлено в Избранное", "Added to Favorites": "Добавлено в Избранное",
"All changes are saved locally": "Все изменения сохраняются локально", "All changes are saved locally": "Все изменения сохраняются локально",
"All pages": "Все страницы", "All pages": "Все страницы",

View File

@@ -25,7 +25,7 @@
"Download all data": "下载所有数据", "Download all data": "下载所有数据",
"Download core data": "下载核心数据", "Download core data": "下载核心数据",
"Edit": "编辑", "Edit": "编辑",
"Add to favorites": "加入收藏", "Add to Favorites": "加入收藏",
"All pages": "全部页面", "All pages": "全部页面",
"Cancel": "取消", "Cancel": "取消",
"Code block": "代码块", "Code block": "代码块",

18
pnpm-lock.yaml generated
View File

@@ -78,7 +78,7 @@ importers:
specifiers: specifiers:
'@blocksuite/blocks': 0.4.1 '@blocksuite/blocks': 0.4.1
'@blocksuite/editor': 0.4.1 '@blocksuite/editor': 0.4.1
'@blocksuite/icons': 2.0.12 '@blocksuite/icons': 2.0.17
'@blocksuite/store': 0.4.1 '@blocksuite/store': 0.4.1
'@emotion/react': ^11.10.6 '@emotion/react': ^11.10.6
'@emotion/styled': ^11.10.6 '@emotion/styled': ^11.10.6
@@ -110,7 +110,7 @@ importers:
dependencies: dependencies:
'@blocksuite/blocks': 0.4.1_atn5tmcwtxn4phcfq72w467xbe '@blocksuite/blocks': 0.4.1_atn5tmcwtxn4phcfq72w467xbe
'@blocksuite/editor': 0.4.1_e5cdg6aldwc4hxgrfphufwkeea '@blocksuite/editor': 0.4.1_e5cdg6aldwc4hxgrfphufwkeea
'@blocksuite/icons': 2.0.12_pmekkgnqduwlme35zpnqhenc34 '@blocksuite/icons': 2.0.17_pmekkgnqduwlme35zpnqhenc34
'@blocksuite/store': 0.4.1_lit@2.6.1+yjs@13.5.47 '@blocksuite/store': 0.4.1_lit@2.6.1+yjs@13.5.47
'@emotion/react': 11.10.6_pmekkgnqduwlme35zpnqhenc34 '@emotion/react': 11.10.6_pmekkgnqduwlme35zpnqhenc34
'@emotion/styled': 11.10.6_oouaibmszuch5k64ms7uxp2aia '@emotion/styled': 11.10.6_oouaibmszuch5k64ms7uxp2aia
@@ -150,7 +150,7 @@ importers:
'@blocksuite/blocks': 0.4.1 '@blocksuite/blocks': 0.4.1
'@blocksuite/editor': 0.4.1 '@blocksuite/editor': 0.4.1
'@blocksuite/global': 0.4.1 '@blocksuite/global': 0.4.1
'@blocksuite/icons': 2.0.12 '@blocksuite/icons': 2.0.17
'@blocksuite/store': 0.4.1 '@blocksuite/store': 0.4.1
'@emotion/css': ^11.10.6 '@emotion/css': ^11.10.6
'@emotion/react': ^11.10.6 '@emotion/react': ^11.10.6
@@ -193,7 +193,7 @@ importers:
'@blocksuite/blocks': 0.4.1_atn5tmcwtxn4phcfq72w467xbe '@blocksuite/blocks': 0.4.1_atn5tmcwtxn4phcfq72w467xbe
'@blocksuite/editor': 0.4.1_e5cdg6aldwc4hxgrfphufwkeea '@blocksuite/editor': 0.4.1_e5cdg6aldwc4hxgrfphufwkeea
'@blocksuite/global': 0.4.1_lit@2.6.1 '@blocksuite/global': 0.4.1_lit@2.6.1
'@blocksuite/icons': 2.0.12_pmekkgnqduwlme35zpnqhenc34 '@blocksuite/icons': 2.0.17_pmekkgnqduwlme35zpnqhenc34
'@blocksuite/store': 0.4.1_lit@2.6.1+yjs@13.5.47 '@blocksuite/store': 0.4.1_lit@2.6.1+yjs@13.5.47
'@emotion/css': 11.10.6 '@emotion/css': 11.10.6
'@emotion/react': 11.10.6_pmekkgnqduwlme35zpnqhenc34 '@emotion/react': 11.10.6_pmekkgnqduwlme35zpnqhenc34
@@ -1753,6 +1753,16 @@ packages:
react: 18.2.0 react: 18.2.0
dev: false dev: false
/@blocksuite/icons/2.0.17_pmekkgnqduwlme35zpnqhenc34:
resolution: {integrity: sha512-nFhgnmfYvy/Pk+KBON5M+veZaz/IoQ+rAugzx2nPy+YPkgXvOxa5ml4rhzZYE2qgx7/FdsKQ5qkBWPjJoYRlbw==}
peerDependencies:
'@types/react': ^18.0.25
react: ^18.2.0
dependencies:
'@types/react': 18.0.28
react: 18.2.0
dev: false
/@blocksuite/phasor/0.4.1_lit@2.6.1+yjs@13.5.47: /@blocksuite/phasor/0.4.1_lit@2.6.1+yjs@13.5.47:
resolution: {integrity: sha512-RzAmB9wbsVo8K4sUjjhatM/D/mbe2crHyJ5LE/HkUTIxp7D4DQapRP7RREJojzw2KhcRvapEVRRwlLV2f5wGUQ==} resolution: {integrity: sha512-RzAmB9wbsVo8K4sUjjhatM/D/mbe2crHyJ5LE/HkUTIxp7D4DQapRP7RREJojzw2KhcRvapEVRRwlLV2f5wGUQ==}
peerDependencies: peerDependencies: