From d73b7fadabc8790c8170148827a6a0a914a6e1ed Mon Sep 17 00:00:00 2001
From: SagarRajput-7 <162284829+SagarRajput-7@users.noreply.github.com>
Date: Fri, 28 Nov 2025 16:30:02 +0530
Subject: [PATCH] chore: fix import and consumption issues with design system
 component (#9694)

* chore: fix import and consumption issues with design system component

* fix: enable auto-imports for @signozhq components via explicit registry
---
 frontend/.eslintrc.js                  |  2 +-
 frontend/package.json                  |  2 +-
 frontend/scripts/update-registry.js    | 50 ++++++++++++++++++++++++++
 frontend/src/auto-import-registry.d.ts | 23 ++++++++++++
 4 files changed, 75 insertions(+), 2 deletions(-)
 create mode 100644 frontend/scripts/update-registry.js
 create mode 100644 frontend/src/auto-import-registry.d.ts

diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js
index 25ff23f209..725d592e2c 100644
--- a/frontend/.eslintrc.js
+++ b/frontend/.eslintrc.js
@@ -1,5 +1,5 @@
 module.exports = {
-	ignorePatterns: ['src/parser/*.ts'],
+	ignorePatterns: ['src/parser/*.ts', 'scripts/update-registry.js'],
 	env: {
 		browser: true,
 		es2021: true,
diff --git a/frontend/package.json b/frontend/package.json
index baf1e9e032..eecb593cf6 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -14,7 +14,7 @@
 		"jest": "jest",
 		"jest:coverage": "jest --coverage",
 		"jest:watch": "jest --watch",
-		"postinstall": "yarn i18n:generate-hash && (is-ci || yarn husky:configure)",
+		"postinstall": "yarn i18n:generate-hash && (is-ci || yarn husky:configure)  && node scripts/update-registry.js",
 		"husky:configure": "cd .. && husky install frontend/.husky && cd frontend && chmod ug+x .husky/*",
 		"commitlint": "commitlint --edit $1",
 		"test": "jest",
diff --git a/frontend/scripts/update-registry.js b/frontend/scripts/update-registry.js
new file mode 100644
index 0000000000..34015e4e3a
--- /dev/null
+++ b/frontend/scripts/update-registry.js
@@ -0,0 +1,50 @@
+/* eslint-disable @typescript-eslint/no-var-requires, import/no-dynamic-require, simple-import-sort/imports, simple-import-sort/exports */
+const fs = require('fs');
+const path = require('path');
+
+// 1. Define paths
+const packageJsonPath = path.resolve(__dirname, '../package.json');
+const registryPath = path.resolve(
+	__dirname,
+	'../src/auto-import-registry.d.ts',
+);
+
+// 2. Read package.json
+const packageJson = require(packageJsonPath);
+
+// 3. Combine dependencies and devDependencies
+const allDeps = {
+	...packageJson.dependencies,
+	...packageJson.devDependencies,
+};
+
+// 4. Filter for @signozhq packages
+const signozPackages = Object.keys(allDeps).filter((dep) =>
+	dep.startsWith('@signozhq/'),
+);
+
+// 5. Generate file content
+const fileContent = `// -------------------------------------------------------------------------
+// AUTO-GENERATED FILE
+// -------------------------------------------------------------------------
+// This file is generated by scripts/update-registry.js automatically
+// whenever you run 'yarn install' or 'npm install'.
+//
+// It forces VS Code to index these specific packages to fix auto-import
+// performance issues in TypeScript 4.x.
+//
+// PR for reference: https://github.com/SigNoz/signoz/pull/9694
+// -------------------------------------------------------------------------
+
+${signozPackages.map((pkg) => `import '${pkg}';`).join('\n')}
+`;
+
+// 6. Write the file
+try {
+	fs.writeFileSync(registryPath, fileContent);
+	console.log(
+		`✅ Auto-import registry updated with ${signozPackages.length} @signozhq packages.`,
+	);
+} catch (err) {
+	console.error('❌ Failed to update auto-import registry:', err);
+}
diff --git a/frontend/src/auto-import-registry.d.ts b/frontend/src/auto-import-registry.d.ts
new file mode 100644
index 0000000000..dcc79a4c93
--- /dev/null
+++ b/frontend/src/auto-import-registry.d.ts
@@ -0,0 +1,23 @@
+// -------------------------------------------------------------------------
+// AUTO-GENERATED FILE
+// -------------------------------------------------------------------------
+// This file is generated by scripts/update-registry.js automatically
+// whenever you run 'yarn install' or 'npm install'.
+//
+// It forces VS Code to index these specific packages to fix auto-import
+// performance issues in TypeScript 4.x.
+//
+// PR for reference: https://github.com/SigNoz/signoz/pull/9694
+// -------------------------------------------------------------------------
+
+import '@signozhq/badge';
+import '@signozhq/button';
+import '@signozhq/calendar';
+import '@signozhq/callout';
+import '@signozhq/design-tokens';
+import '@signozhq/input';
+import '@signozhq/popover';
+import '@signozhq/resizable';
+import '@signozhq/sonner';
+import '@signozhq/table';
+import '@signozhq/tooltip';