From c140450a1e70ab596655fa7dce645d25b9011792 Mon Sep 17 00:00:00 2001
From: Andrew Sikowitz <andrew.sikowitz@acryl.io>
Date: Tue, 22 Apr 2025 13:05:16 -0700
Subject: [PATCH] fix(ui/storybook): Allow relative imports to fix storybook
 build (#13292)

---
 datahub-web-react/.eslintrc.js                |  8 ++++---
 .../theme/foundations/index.ts                | 24 +++++++++----------
 .../src/alchemy-components/theme/index.ts     |  8 +++----
 .../theme/semantic-tokens.ts                  |  2 +-
 .../src/alchemy-components/theme/utils.ts     | 12 +++-------
 5 files changed, 25 insertions(+), 29 deletions(-)

diff --git a/datahub-web-react/.eslintrc.js b/datahub-web-react/.eslintrc.js
index d1697e09e8..598a08dc96 100644
--- a/datahub-web-react/.eslintrc.js
+++ b/datahub-web-react/.eslintrc.js
@@ -78,9 +78,11 @@ module.exports = {
     overrides: [
         {
             files: ['src/app/searchV2/**/*.tsx', 'src/app/entityV2/**/*.tsx'],
-            rules: {
-                'import/no-cycle': 'off',
-            },
+            rules: { 'import/no-cycle': 'off' },
+        },
+        {
+            files: ['src/alchemy-components/theme/**/*.ts'],
+            rules: { 'import/no-relative-packages': 'off', 'import-alias/import-alias': 'off' },
         },
     ],
 };
diff --git a/datahub-web-react/src/alchemy-components/theme/foundations/index.ts b/datahub-web-react/src/alchemy-components/theme/foundations/index.ts
index 70abfc172a..e4c81d77f0 100644
--- a/datahub-web-react/src/alchemy-components/theme/foundations/index.ts
+++ b/datahub-web-react/src/alchemy-components/theme/foundations/index.ts
@@ -1,15 +1,15 @@
-import blur from '@components/theme/foundations/blur';
-import borders from '@components/theme/foundations/borders';
-import breakpoints from '@components/theme/foundations/breakpoints';
-import colors from '@components/theme/foundations/colors';
-import radius from '@components/theme/foundations/radius';
-import shadows from '@components/theme/foundations/shadows';
-import sizes from '@components/theme/foundations/sizes';
-import spacing from '@components/theme/foundations/spacing';
-import transform from '@components/theme/foundations/transform';
-import transition from '@components/theme/foundations/transition';
-import typography from '@components/theme/foundations/typography';
-import zIndices from '@components/theme/foundations/zIndex';
+import blur from './blur';
+import borders from './borders';
+import breakpoints from './breakpoints';
+import colors from './colors';
+import radius from './radius';
+import shadows from './shadows';
+import sizes from './sizes';
+import spacing from './spacing';
+import transform from './transform';
+import transition from './transition';
+import typography from './typography';
+import zIndices from './zIndex';
 
 export const foundations = {
     blur,
diff --git a/datahub-web-react/src/alchemy-components/theme/index.ts b/datahub-web-react/src/alchemy-components/theme/index.ts
index c186896d41..95256d7edd 100644
--- a/datahub-web-react/src/alchemy-components/theme/index.ts
+++ b/datahub-web-react/src/alchemy-components/theme/index.ts
@@ -1,7 +1,7 @@
-import * as config from '@components/theme/config';
-import { foundations } from '@components/theme/foundations';
-import { semanticTokens } from '@components/theme/semantic-tokens';
-import * as utils from '@components/theme/utils';
+import * as config from './config';
+import { foundations } from './foundations';
+import { semanticTokens } from './semantic-tokens';
+import * as utils from './utils';
 
 const theme = {
     semanticTokens,
diff --git a/datahub-web-react/src/alchemy-components/theme/semantic-tokens.ts b/datahub-web-react/src/alchemy-components/theme/semantic-tokens.ts
index 46fc055c1d..29bd20d11f 100644
--- a/datahub-web-react/src/alchemy-components/theme/semantic-tokens.ts
+++ b/datahub-web-react/src/alchemy-components/theme/semantic-tokens.ts
@@ -1,4 +1,4 @@
-import { foundations } from '@components/theme/foundations';
+import { foundations } from './foundations';
 
 const { colors } = foundations;
 
diff --git a/datahub-web-react/src/alchemy-components/theme/utils.ts b/datahub-web-react/src/alchemy-components/theme/utils.ts
index 188d08ded0..f59b3f5e86 100644
--- a/datahub-web-react/src/alchemy-components/theme/utils.ts
+++ b/datahub-web-react/src/alchemy-components/theme/utils.ts
@@ -1,15 +1,9 @@
 /*
 	Theme Utils that can be used anywhere in the app
 */
-import {
-    ColorOptions,
-    DEFAULT_VALUE,
-    FontSizeOptions,
-    MiscColorOptions,
-    RotationOptions,
-} from '@components/theme/config';
-import { foundations } from '@components/theme/foundations';
-import { semanticTokens } from '@components/theme/semantic-tokens';
+import { ColorOptions, DEFAULT_VALUE, FontSizeOptions, MiscColorOptions, RotationOptions } from './config';
+import { foundations } from './foundations';
+import { semanticTokens } from './semantic-tokens';
 
 const { colors, typography, transform } = foundations;
 /*