fix(core): settings storage empty styles (#10313)

This commit is contained in:
Peng Xiao
2025-02-21 17:19:53 +08:00
committed by GitHub
parent 24fa58df52
commit 83669f8fbb
4 changed files with 61 additions and 40 deletions

View File

@@ -214,8 +214,8 @@ export const BackupSettingPanel = () => {
/>
);
}
if (backupWorkspaces?.items.length === 0 || !backupWorkspaces) {
return <Empty />;
if (!backupWorkspaces) {
return null;
}
return (
<>
@@ -242,6 +242,9 @@ export const BackupSettingPanel = () => {
);
}, [isLoading, backupWorkspaces, pageNum]);
const isEmpty =
(backupWorkspaces?.items.length === 0 || !backupWorkspaces) && !isLoading;
return (
<>
<SettingHeader
@@ -249,7 +252,11 @@ export const BackupSettingPanel = () => {
subtitle={t['com.affine.settings.workspace.backup.subtitle']()}
data-testid="backup-title"
/>
<div className={styles.listContainer}>{innerElement}</div>
{isEmpty ? (
<Empty />
) : (
<div className={styles.listContainer}>{innerElement}</div>
)}
</>
);
};

View File

@@ -62,7 +62,12 @@ export const listItemRightLabel = style({
});
export const empty = style({
padding: '8px 16px',
paddingTop: '64px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
color: cssVarV2('text/secondary'),
fontSize: cssVar('fontSm'),
});
export const pagination = style({

View File

@@ -261,6 +261,8 @@ export const BlobManagementPanel = () => {
return;
}, [unusedBlobs]);
const isEmpty = (unusedBlobs.length === 0 || !unusedBlobs) && !isLoading;
return (
<>
{selectedBlobs.length > 0 ? (
@@ -288,42 +290,44 @@ export const BlobManagementPanel = () => {
{`${t['com.affine.settings.workspace.storage.unused-blobs']()} (${unusedBlobs.length})`}
</div>
)}
<div className={styles.blobManagementContainer}>
{isLoading ? (
<div className={styles.loadingContainer}>
<Loading size={32} />
</div>
) : unusedBlobs.length === 0 ? (
<Empty />
) : (
<>
<div className={styles.blobPreviewGrid} ref={blobPreviewGridRef}>
{unusedBlobsPage.map(blob => {
const selected = selectedBlobs.includes(blob);
return (
<BlobCard
key={blob.key}
blobRecord={blob}
onClick={e => handleBlobClick(blob, e)}
selected={selected}
/>
);
})}
{isEmpty ? (
<Empty />
) : (
<div className={styles.blobManagementContainer}>
{isLoading ? (
<div className={styles.loadingContainer}>
<Loading size={32} />
</div>
{unusedBlobs.length > PAGE_SIZE && (
<Pagination
pageNum={pageNum}
totalCount={unusedBlobs.length}
countPerPage={PAGE_SIZE}
onPageChange={(_, pageNum) => {
setPageNum(pageNum);
setSkip(pageNum * PAGE_SIZE);
}}
/>
)}
</>
)}
</div>
) : (
<>
<div className={styles.blobPreviewGrid} ref={blobPreviewGridRef}>
{unusedBlobsPage.map(blob => {
const selected = selectedBlobs.includes(blob);
return (
<BlobCard
key={blob.key}
blobRecord={blob}
onClick={e => handleBlobClick(blob, e)}
selected={selected}
/>
);
})}
</div>
{unusedBlobs.length > PAGE_SIZE && (
<Pagination
pageNum={pageNum}
totalCount={unusedBlobs.length}
countPerPage={PAGE_SIZE}
onPageChange={(_, pageNum) => {
setPageNum(pageNum);
setSkip(pageNum * PAGE_SIZE);
}}
/>
)}
</>
)}
</div>
)}
</>
);
};

View File

@@ -88,7 +88,12 @@ export const loadingContainer = style({
});
export const empty = style({
padding: '8px 16px',
paddingTop: '64px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
color: cssVarV2('text/secondary'),
fontSize: cssVar('fontSm'),
});
export const blobPreviewContainer = style({