diff --git a/superset-frontend/src/preamble.ts b/superset-frontend/src/preamble.ts
index 5564f5b44e..31d547dff0 100644
--- a/superset-frontend/src/preamble.ts
+++ b/superset-frontend/src/preamble.ts
@@ -20,7 +20,6 @@ import { setConfig as setHotLoaderConfig } from 'react-hot-loader';
 import 'abortcontroller-polyfill/dist/abortcontroller-polyfill-only';
 import moment from 'moment';
 import { configure } from '@superset-ui/core';
-import ColorScheme from '@superset-ui/core/lib/color/ColorScheme';
 import setupClient from './setup/setupClient';
 import setupColors from './setup/setupColors';
 import setupFormatters from './setup/setupFormatters';
@@ -51,26 +50,10 @@ if (typeof window !== 'undefined') {
 // Setup SupersetClient
 setupClient();
 
-// Setup color palettes
-let extraCategoricalColorSchemes: ColorScheme[] = [];
-let extraSequentialColorSchemes: ColorScheme[] = [];
-
-if (
-  bootstrapData.common &&
-  bootstrapData.common.extra_categorical_color_schemes
-) {
-  extraCategoricalColorSchemes =
-    bootstrapData.common.extra_categorical_color_schemes;
-}
-if (
-  bootstrapData.common &&
-  bootstrapData.common.extra_sequential_color_schemes
-) {
-  extraSequentialColorSchemes =
-    bootstrapData.common.extra_sequential_color_schemes;
-}
-
-setupColors(extraCategoricalColorSchemes, extraSequentialColorSchemes);
+setupColors(
+  bootstrapData?.common?.extra_categorical_color_schemes,
+  bootstrapData?.common?.extra_sequential_color_schemes,
+);
 
 // Setup number formatters
 setupFormatters();
diff --git a/superset-frontend/src/setup/setupColors.js b/superset-frontend/src/setup/setupColors.ts
similarity index 71%
rename from superset-frontend/src/setup/setupColors.js
rename to superset-frontend/src/setup/setupColors.ts
index 529a3a4afb..77b1b69454 100644
--- a/superset-frontend/src/setup/setupColors.js
+++ b/superset-frontend/src/setup/setupColors.ts
@@ -16,28 +16,30 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import airbnb from '@superset-ui/core/esm/color/colorSchemes/categorical/airbnb';
-import categoricalD3 from '@superset-ui/core/esm/color/colorSchemes/categorical/d3';
-import echarts from '@superset-ui/core/esm/color/colorSchemes/categorical/echarts';
-import google from '@superset-ui/core/esm/color/colorSchemes/categorical/google';
-import lyft from '@superset-ui/core/esm/color/colorSchemes/categorical/lyft';
-import preset from '@superset-ui/core/esm/color/colorSchemes/categorical/preset';
-import sequentialCommon from '@superset-ui/core/esm/color/colorSchemes/sequential/common';
-import sequentialD3 from '@superset-ui/core/esm/color/colorSchemes/sequential/d3';
+import airbnb from '@superset-ui/core/lib/color/colorSchemes/categorical/airbnb';
+import categoricalD3 from '@superset-ui/core/lib/color/colorSchemes/categorical/d3';
+import echarts from '@superset-ui/core/lib/color/colorSchemes/categorical/echarts';
+import google from '@superset-ui/core/lib/color/colorSchemes/categorical/google';
+import lyft from '@superset-ui/core/lib/color/colorSchemes/categorical/lyft';
+import preset from '@superset-ui/core/lib/color/colorSchemes/categorical/preset';
+import sequentialCommon from '@superset-ui/core/lib/color/colorSchemes/sequential/common';
+import sequentialD3 from '@superset-ui/core/lib/color/colorSchemes/sequential/d3';
 import {
+  CategoricalScheme,
   getCategoricalSchemeRegistry,
   getSequentialSchemeRegistry,
+  SequentialScheme,
 } from '@superset-ui/core';
-import superset from '@superset-ui/core/esm/color/colorSchemes/categorical/superset';
+import superset from '@superset-ui/core/lib/color/colorSchemes/categorical/superset';
 
 export default function setupColors(
-  extraCategoricalColorSchemas,
-  extraSequentialColorSchemes,
+  extraCategoricalColorSchemas: CategoricalScheme[] = [],
+  extraSequentialColorSchemes: SequentialScheme[] = [],
 ) {
   // Register color schemes
   const categoricalSchemeRegistry = getCategoricalSchemeRegistry();
 
-  if (extraCategoricalColorSchemas && extraCategoricalColorSchemas.length > 0) {
+  if (extraCategoricalColorSchemas?.length > 0) {
     extraCategoricalColorSchemas.forEach(scheme => {
       categoricalSchemeRegistry.registerValue(scheme.id, scheme);
     });
@@ -54,7 +56,7 @@ export default function setupColors(
 
   const sequentialSchemeRegistry = getSequentialSchemeRegistry();
 
-  if (extraSequentialColorSchemes && extraSequentialColorSchemes.length > 0) {
+  if (extraSequentialColorSchemes?.length > 0) {
     extraSequentialColorSchemes.forEach(scheme => {
       categoricalSchemeRegistry.registerValue(scheme.id, scheme);
     });