Merge pull request #1543 from easyops-cn/steve/fix-lucide-icons

fix(): Lucide icons don't support range request yet

Author: weareoutman

bricks/icons/src/shared/RangeRequest.ts

@@ -4,11 +4,9 @@ import { getRuntime } from "@next-core/runtime";
 import antdIcons from "../antd-icon/generated/icons.json";
 import easyopsIcons from "../easyops-icon/generated/icons.json";
 import faIcons from "../fa-icon/generated/icons.json";
-import lucideIcons from "../lucide-icon/generated/icons.json";
 import antdRanges from "../antd-icon/generated/ranges.json";
 import faRanges from "../fa-icon/generated/ranges.json";
 import easyopsRanges from "../easyops-icon/generated/ranges.json";
-import lucideRanges from "../lucide-icon/generated/ranges.json";
 
 const publicPath =
   process.env.NODE_ENV === "test" ? "" : __webpack_public_path__;
@@ -29,11 +27,6 @@ const SETTINGS_MAP = {
     icons: easyopsIcons,
     ranges: easyopsRanges,
   },
-  lucide: {
-    url: `${publicPath}chunks/lucide-icons/all.${lucideRanges._hash}.svg`,
-    icons: lucideIcons,
-    ranges: lucideRanges,
-  },
 } as unknown as Record<string, Settings>;
 
 const TEST_URL = `${publicPath}manifest.json`;
@@ -99,7 +92,7 @@ export async function supportsMultipartRangeRequest() {
   return await supportsPromise;
 }
 
-type Lib = "antd" | "fa" | "easyops" | "lucide";
+type Lib = "antd" | "fa" | "easyops";
 
 interface Settings {
   url: string;
@@ -141,7 +134,7 @@ const dbPromise = new Promise<IDBDatabase | null>((resolve) => {
       const db = (event.target as IDBOpenDBRequest).result;
       // These transactions maybe the same.
       const transactions = new Set<IDBTransaction>();
-      for (const lib of ["antd", "fa", "easyops", "lucide"]) {
+      for (const lib of ["antd", "fa", "easyops"]) {
         if (!db.objectStoreNames.contains(lib)) {
           transactions.add(db.createObjectStore(lib).transaction);
         }
@@ -177,7 +170,7 @@ const dbPromise = new Promise<IDBDatabase | null>((resolve) => {
       return;
     }
     Promise.all(
-      ["antd", "fa", "easyops", "lucide"].map(
+      ["antd", "fa", "easyops"].map(
         async (lib) =>
           new Promise<void>((libResolve, libReject) => {
             new Promise<string | null>((hashResolve) => {

bricks/icons/src/shared/SvgCache.ts

@@ -21,7 +21,6 @@ const REGEX_MICRO_APPS_WITH_VERSION = /\/micro-apps\/v([23])\//;
 
 const antdRangeRequest = new RangeRequest("antd");
 const easyopsRangeRequest = new RangeRequest("easyops");
-const lucideRangeRequest = new RangeRequest("lucide");
 
 /** Given a URL, this function returns the resulting SVG element or an appropriate error symbol. */
 async function resolveIcon(
@@ -33,13 +32,13 @@ async function resolveIcon(
 
   // istanbul ignore next: experimental
   try {
-    if (options?.id && (await supportsMultipartRangeRequest())) {
+    if (
+      options?.id &&
+      options?.lib !== "lucide" &&
+      (await supportsMultipartRangeRequest())
+    ) {
       const rangeRequest =
-        options.lib === "easyops"
-          ? easyopsRangeRequest
-          : options.lib === "lucide"
-            ? lucideRangeRequest
-            : antdRangeRequest;
+        options.lib === "easyops" ? easyopsRangeRequest : antdRangeRequest;
       content = await rangeRequest.fetch(options.id);
     }
   } catch {