fix: demond load outline

This commit is contained in:
Kilu 2024-07-29 22:41:32 +08:00
parent 49f8ae93c7
commit 38784b9d73
4 changed files with 71 additions and 63 deletions

View File

@ -167,13 +167,15 @@ function AddComment() {
</Button>
</div>
)}
<LoginModal
redirectTo={url}
open={loginOpen}
onClose={() => {
setLoginOpen(false);
}}
/>
{loginOpen && (
<LoginModal
redirectTo={url}
open={loginOpen}
onClose={() => {
setLoginOpen(false);
}}
/>
)}
</div>
);
}

View File

@ -125,26 +125,28 @@ function MoreActions({ comment }: { comment: GlobalComment }) {
<MoreIcon className={'h-4 w-4'} />
</IconButton>
</RichTooltip>
<NormalModal
PaperProps={{
sx: {
maxWidth: 420,
},
}}
okText={t('button.delete')}
danger={true}
onOk={handleDeleteAction}
onCancel={() => {
setDeleteModalOpen(false);
}}
onClose={() => setDeleteModalOpen(false)}
open={deleteModalOpen}
title={<div className={'text-left'}>{t('globalComment.deleteComment')}</div>}
>
<div className={'w-full whitespace-pre-wrap break-words pb-1 text-text-caption'}>
{t('globalComment.confirmDeleteDescription')}
</div>
</NormalModal>
{deleteModalOpen && (
<NormalModal
PaperProps={{
sx: {
maxWidth: 420,
},
}}
okText={t('button.delete')}
danger={true}
onOk={handleDeleteAction}
onCancel={() => {
setDeleteModalOpen(false);
}}
onClose={() => setDeleteModalOpen(false)}
open={deleteModalOpen}
title={<div className={'text-left'}>{t('globalComment.deleteComment')}</div>}
>
<div className={'w-full whitespace-pre-wrap break-words pb-1 text-text-caption'}>
{t('globalComment.confirmDeleteDescription')}
</div>
</NormalModal>
)}
</>
);
}

View File

@ -76,47 +76,51 @@ function MoreActions() {
<IconButton onClick={handleClick}>
<MoreIcon className={'text-text-caption'} />
</IconButton>
<Popover
anchorOrigin={{
vertical: 'bottom',
horizontal: 'right',
}}
transformOrigin={{
vertical: 'top',
horizontal: 'right',
}}
open={open}
anchorEl={anchorEl}
onClose={handleClose}
>
<div className={'flex w-[240px] flex-col gap-2 px-2 py-2'}>
{actions.map((action, index) => (
<button
{open && (
<Popover
anchorOrigin={{
vertical: 'bottom',
horizontal: 'right',
}}
transformOrigin={{
vertical: 'top',
horizontal: 'right',
}}
open={open}
anchorEl={anchorEl}
onClose={handleClose}
>
<div className={'flex w-[240px] flex-col gap-2 px-2 py-2'}>
{actions.map((action, index) => (
<button
onClick={() => {
action.onClick();
handleClose();
}}
key={index}
className={
'flex items-center gap-2 rounded-[8px] p-1.5 text-sm hover:bg-content-blue-50 focus:bg-content-blue-50 focus:outline-none'
}
>
<action.Icon />
<span>{action.label}</span>
</button>
))}
<div
onClick={() => {
action.onClick();
handleClose();
window.open('https://appflowy.io', '_blank');
}}
key={index}
className={
'flex items-center gap-2 rounded-[8px] p-1.5 text-sm hover:bg-content-blue-50 focus:bg-content-blue-50 focus:outline-none'
'flex w-full cursor-pointer items-center justify-center py-2 text-sm text-text-title opacity-50'
}
>
<action.Icon />
<span>{action.label}</span>
</button>
))}
<div
onClick={() => {
window.open('https://appflowy.io', '_blank');
}}
className={'flex w-full cursor-pointer items-center justify-center py-2 text-sm text-text-title opacity-50'}
>
Powered by
<Logo className={'ml-3 h-4 w-4'} />
<AppflowyLogo className={'w-20'} />
Powered by
<Logo className={'ml-3 h-4 w-4'} />
<AppflowyLogo className={'w-20'} />
</div>
</div>
</div>
</Popover>
</Popover>
)}
</>
);
}

View File

@ -67,7 +67,7 @@ export function PublishViewHeader({ onOpenDrawer, openDrawer }: { onOpenDrawer:
>
<div className={'flex w-full items-center justify-between gap-2 overflow-hidden'}>
<Suspense fallback={null}>
{!openDrawer && (
{!openDrawer && openPopover && (
<OutlinePopover
onMouseEnter={handleOpenPopover}
onMouseLeave={debounceClosePopover}