refactor(editor): get loading icon with theme (#12079)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Introduced a unified loading spinner icon that adapts to light or dark themes automatically.

- **Refactor**
  - Streamlined loading icon usage across the app by replacing multiple theme-based icons with a single helper function for consistent and simplified icon management.

- **Chores**
  - Removed an unused dependency to improve package management.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/blocks/embed/src/common/utils.ts

@@ -1,5 +1,4 @@
 import {
-  DarkLoadingIcon,
   EmbedCardDarkBannerIcon,
   EmbedCardDarkCubeIcon,
   EmbedCardDarkHorizontalIcon,
@@ -10,7 +9,7 @@ import {
   EmbedCardLightHorizontalIcon,
   EmbedCardLightListIcon,
   EmbedCardLightVerticalIcon,
-  LightLoadingIcon,
+  getLoadingIconWith,
 } from '@blocksuite/affine-components/icons';
 import { ColorScheme } from '@blocksuite/affine-model';
 import type { TemplateResult } from 'lit';
@@ -25,9 +24,11 @@ type EmbedCardIcons = {
 };
 
 export function getEmbedCardIcons(theme: ColorScheme): EmbedCardIcons {
+  const LoadingIcon = getLoadingIconWith(theme);
+
   if (theme === ColorScheme.Light) {
     return {
-      LoadingIcon: LightLoadingIcon,
+      LoadingIcon,
       EmbedCardBannerIcon: EmbedCardLightBannerIcon,
       EmbedCardHorizontalIcon: EmbedCardLightHorizontalIcon,
       EmbedCardListIcon: EmbedCardLightListIcon,
@@ -36,7 +37,7 @@ export function getEmbedCardIcons(theme: ColorScheme): EmbedCardIcons {
     };
   } else {
     return {
-      LoadingIcon: DarkLoadingIcon,
+      LoadingIcon,
       EmbedCardBannerIcon: EmbedCardDarkBannerIcon,
       EmbedCardHorizontalIcon: EmbedCardDarkHorizontalIcon,
       EmbedCardListIcon: EmbedCardDarkListIcon,

blocksuite/affine/blocks/embed/src/embed-linked-doc-block/utils.ts

@@ -1,8 +1,7 @@
 import {
-  DarkLoadingIcon,
   EmbedEdgelessIcon,
   EmbedPageIcon,
-  LightLoadingIcon,
+  getLoadingIconWith,
   ReloadIcon,
 } from '@blocksuite/affine-components/icons';
 import {
@@ -51,10 +50,11 @@ export function getEmbedLinkedDocIcons(
   style: (typeof EmbedLinkedDocStyles)[number]
 ): EmbedCardImages {
   const small = style !== 'vertical';
+  const LoadingIcon = getLoadingIconWith(theme);
   if (editorMode === 'page') {
     if (theme === ColorScheme.Light) {
       return {
-        LoadingIcon: LightLoadingIcon,
+        LoadingIcon,
         ReloadIcon,
         LinkedDocIcon: EmbedPageIcon,
         LinkedDocDeletedIcon,
@@ -69,7 +69,7 @@ export function getEmbedLinkedDocIcons(
     } else {
       return {
         ReloadIcon,
-        LoadingIcon: DarkLoadingIcon,
+        LoadingIcon,
         LinkedDocIcon: EmbedPageIcon,
         LinkedDocDeletedIcon,
         LinkedDocEmptyBanner: small
@@ -85,7 +85,7 @@ export function getEmbedLinkedDocIcons(
     if (theme === ColorScheme.Light) {
       return {
         ReloadIcon,
-        LoadingIcon: LightLoadingIcon,
+        LoadingIcon,
         LinkedDocIcon: EmbedEdgelessIcon,
         LinkedDocDeletedIcon,
         LinkedDocEmptyBanner: small
@@ -99,7 +99,7 @@ export function getEmbedLinkedDocIcons(
     } else {
       return {
         ReloadIcon,
-        LoadingIcon: DarkLoadingIcon,
+        LoadingIcon,
         LinkedDocIcon: EmbedEdgelessIcon,
         LinkedDocDeletedIcon,
         LinkedDocEmptyBanner: small

blocksuite/affine/blocks/embed/src/embed-synced-doc-block/utils.ts

@@ -1,8 +1,7 @@
 import {
-  DarkLoadingIcon,
   EmbedEdgelessIcon,
   EmbedPageIcon,
-  LightLoadingIcon,
+  getLoadingIconWith,
   ReloadIcon,
 } from '@blocksuite/affine-components/icons';
 import { ColorScheme } from '@blocksuite/affine-model';
@@ -34,9 +33,10 @@ export function getSyncedDocIcons(
   theme: ColorScheme,
   editorMode: 'page' | 'edgeless'
 ): SyncedCardImages {
+  const LoadingIcon = getLoadingIconWith(theme);
   if (theme === ColorScheme.Light) {
     return {
-      LoadingIcon: LightLoadingIcon,
+      LoadingIcon,
       SyncedDocIcon: editorMode === 'page' ? EmbedPageIcon : EmbedEdgelessIcon,
       SyncedDocErrorIcon,
       SyncedDocDeletedIcon,
@@ -47,7 +47,7 @@ export function getSyncedDocIcons(
     };
   } else {
     return {
-      LoadingIcon: DarkLoadingIcon,
+      LoadingIcon,
       SyncedDocIcon: editorMode === 'page' ? EmbedPageIcon : EmbedEdgelessIcon,
       SyncedDocErrorIcon,
       SyncedDocDeletedIcon,