Make the order of custom themes stable

epam · Jun 13, 2024 · 56a2c1c · 56a2c1c
1 parent 72ea3df
commit 56a2c1c
Showing 1 changed file with 17 additions and 11 deletions.
diff --git a/app/src/data/customThemes.ts b/app/src/data/customThemes.ts
@@ -37,22 +37,28 @@ async function loadCustomThemesInternal() {
     const { customThemes = [] } = getCustomThemesConfigFromLs() || {};
     const ctManifestArr: CustomThemeManifest[] = [];
     if (customThemes.length > 0) {
-        await Promise.all(
+        const ctManifestArrLoaded = await Promise.all(
             customThemes.map(async (themeUrl) => {
                 const themeManifestUrl = `${themeUrl}/${THEME_MANIFEST_FILE}`;
                 return fetch(themeManifestUrl)
-                    .then(async (r) => {
-                        const tmJson: { css: string[]; settings: null | string, id: string, name: string, propsOverride?: TPropEditorTypeOverride } = await r.json();
-                        const { id, name, css, settings, propsOverride } = tmJson;
-                        const loadedSettings = settings ? await loadSettings(convertRelUrlToAbs(settings, themeUrl)) : null;
-                        await loadCssArr(css.map((cssRel) => convertRelUrlToAbs(cssRel, themeUrl)));
-                        ctManifestArr.push({ id, name, css, settings: loadedSettings, propsOverride });
-                    })
-                    .catch((err) => {
-                        console.error(`Unable to load custom theme from "${themeManifestUrl}"`, err);
-                    });
+                    .then<CustomThemeManifest>(async (r) => {
+                    const tmJson: { css: string[]; settings: null | string, id: string, name: string, propsOverride?: TPropEditorTypeOverride } = await r.json();
+                    const { id, name, css, settings, propsOverride } = tmJson;
+                    const loadedSettings = settings ? await loadSettings(convertRelUrlToAbs(settings, themeUrl)) : null;
+                    await loadCssArr(css.map((cssRel) => convertRelUrlToAbs(cssRel, themeUrl)));
+                    return { id, name, css, settings: loadedSettings, propsOverride };
+                })
+                    .catch<undefined>((err) => {
+                    console.error(`Unable to load custom theme from "${themeManifestUrl}"`, err);
+                    return undefined;
+                });
             }),
         );
+        ctManifestArrLoaded.forEach((item: CustomThemeManifest | undefined) => {
+            if (item) {
+                ctManifestArr.push(item);
+            }
+        });
     }
     return ctManifestArr;
 }