fix(core): settings storage empty styles

toeverything · Feb 20, 2025 · b6bb0d9 · b6bb0d9
1 parent 5fcc402
commit b6bb0d9
Show file tree

Hide file tree

Showing 6 changed files with 61 additions and 82 deletions.
diff --git a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/backup/index.tsx b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/backup/index.tsx
@@ -214,8 +214,8 @@ export const BackupSettingPanel = () => {
         />
       );
     }
-    if (backupWorkspaces?.items.length === 0 || !backupWorkspaces) {
-      return <Empty />;
+    if (!backupWorkspaces) {
+      return null;
     }
     return (
       <>
@@ -242,14 +242,21 @@ export const BackupSettingPanel = () => {
     );
   }, [isLoading, backupWorkspaces, pageNum]);
 
+  const isEmpty =
+    (backupWorkspaces?.items.length === 0 || !backupWorkspaces) && !isLoading;
+
   return (
     <>
       <SettingHeader
         title={t['com.affine.settings.workspace.backup']()}
         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>
+      )}
     </>
   );
 };
diff --git a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/backup/styles.css.ts b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/backup/styles.css.ts
@@ -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({

diff --git a/...s/frontend/core/src/desktop/dialogs/setting/workspace-setting/storage/blob-management.tsx b/...s/frontend/core/src/desktop/dialogs/setting/workspace-setting/storage/blob-management.tsx
@@ -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>
+      )}
     </>
   );
 };
diff --git a/packages/frontend/core/src/desktop/dialogs/setting/workspace-setting/storage/style.css.ts b/packages/frontend/core/src/desktop/dialogs/setting/workspace-setting/storage/style.css.ts
@@ -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({

diff --git a/packages/frontend/native/index.d.ts b/packages/frontend/native/index.d.ts
@@ -1,27 +1,5 @@
 /* auto-generated by NAPI-RS */
 /* eslint-disable */
-export declare class Application {
-  static tapGlobalAudio(excludedProcesses: Array<Application> | undefined | null, audioStreamCallback: ((err: Error | null, arg: Float32Array) => void)): AudioTapStream
-  get processId(): number
-  get bundleIdentifier(): string
-  get name(): string
-  get icon(): Buffer
-  get isRunning(): boolean
-  tapAudio(audioStreamCallback: ((err: Error | null, arg: Float32Array) => void)): AudioTapStream
-}
-
-export declare class ApplicationListChangedSubscriber {
-  unsubscribe(): void
-}
-
-export declare class ApplicationStateChangedSubscriber {
-  unsubscribe(): void
-}
-
-export declare class AudioTapStream {
-  stop(): void
-}
-
 export declare class DocStorage {
   constructor(path: string)
   validate(): Promise<boolean>
@@ -60,20 +38,6 @@ export declare class DocStoragePool {
   clearClocks(universalId: string): Promise<void>
 }
 
-export declare class RecordingPermissions {
-  audio: boolean
-  screen: boolean
-}
-
-export declare class ShareableContent {
-  static onApplicationListChanged(callback: ((err: Error | null, ) => void)): ApplicationListChangedSubscriber
-  static onAppStateChanged(app: Application, callback: ((err: Error | null, ) => void)): ApplicationStateChangedSubscriber
-  constructor()
-  applications(): Array<Application>
-  applicationWithProcessId(processId: number): Application
-  checkRecordingPermissions(): RecordingPermissions
-}
-
 export declare class SqliteConnection {
   constructor(path: string)
   connect(): Promise<void>

diff --git a/packages/frontend/native/index.js b/packages/frontend/native/index.js
@@ -364,14 +364,8 @@ if (!nativeBinding) {
   throw new Error(`Failed to load native binding`)
 }
 
-module.exports.Application = nativeBinding.Application
-module.exports.ApplicationListChangedSubscriber = nativeBinding.ApplicationListChangedSubscriber
-module.exports.ApplicationStateChangedSubscriber = nativeBinding.ApplicationStateChangedSubscriber
-module.exports.AudioTapStream = nativeBinding.AudioTapStream
 module.exports.DocStorage = nativeBinding.DocStorage
 module.exports.DocStoragePool = nativeBinding.DocStoragePool
-module.exports.RecordingPermissions = nativeBinding.RecordingPermissions
-module.exports.ShareableContent = nativeBinding.ShareableContent
 module.exports.SqliteConnection = nativeBinding.SqliteConnection
 module.exports.mintChallengeResponse = nativeBinding.mintChallengeResponse
 module.exports.ValidationResult = nativeBinding.ValidationResult