From 92d5e32e539ed7112b5d1bc4f0bc831327afd905 Mon Sep 17 00:00:00 2001
From: Gustav Larsson <gustav.larsson@gmail.com>
Date: Mon, 26 Aug 2024 12:47:32 +0200
Subject: [PATCH] Add script that counts the number of styled-components
 imports compared with original number

---
 package.json                                  |  1 +
 .../styled-components-migration-progress.ts   | 60 +++++++++++++++++++
 2 files changed, 61 insertions(+)
 create mode 100644 scripts/styled-components-migration-progress.ts

diff --git a/package.json b/package.json
index a4925872db3..06b773b6cd2 100644
--- a/package.json
+++ b/package.json
@@ -188,6 +188,7 @@
     "start": "node dist/server",
     "start:ci": "nyc --silent --exclude \".next/**\" node server",
     "start:e2e": "cross-env TZ=UTC NODE_ENV=production OC_ENV=e2e node server",
+    "styled-components-migration-progress": "tsx scripts/styled-components-migration-progress.ts",
     "styleguide:build": "storybook build",
     "styleguide:dev": "storybook dev -p 6006",
     "test": "npm run test:jest",
diff --git a/scripts/styled-components-migration-progress.ts b/scripts/styled-components-migration-progress.ts
new file mode 100644
index 00000000000..f9edc9b46fc
--- /dev/null
+++ b/scripts/styled-components-migration-progress.ts
@@ -0,0 +1,60 @@
+// This script counts the number of styled-components imports in the project and compares it to the number of imports before TailwindCSS was introduced.
+
+import * as fs from 'fs';
+import * as path from 'path';
+
+const SEARCH_DIR = path.resolve(__dirname, '..');
+const ORIGINAL_IMPORT_COUNT = 343;
+
+function countStyledComponentsImports(searchDir: string): number {
+  let count = 0;
+
+  function searchDirectory(directory: string) {
+    const files = fs.readdirSync(directory);
+
+    for (const file of files) {
+      const fullPath = path.join(directory, file);
+      let stat;
+      try {
+        stat = fs.statSync(fullPath);
+      } catch (error) {
+        continue; // skip entries that cannot be accessed
+      }
+
+      if (stat.isDirectory()) {
+        if (file !== 'node_modules' && file[0] !== '.') {
+          // skip node_modules and hidden directories
+          searchDirectory(fullPath);
+        }
+      } else if (
+        fullPath.endsWith('.js') ||
+        fullPath.endsWith('.jsx') ||
+        fullPath.endsWith('.ts') ||
+        fullPath.endsWith('.tsx')
+      ) {
+        const content = fs.readFileSync(fullPath, 'utf-8');
+        const lines = content.split('\n');
+
+        for (const line of lines) {
+          if (line.match(/import .* from 'styled-components'/) || line.match(/require\('styled-components'\)/)) {
+            count++;
+          }
+        }
+      }
+    }
+  }
+
+  searchDirectory(searchDir);
+  return count;
+}
+
+function calculateProgress(currentCount: number, originalCount: number): number {
+  return 100 - (currentCount / originalCount) * 100;
+}
+
+const currentCount = countStyledComponentsImports(SEARCH_DIR);
+const progress = calculateProgress(currentCount, ORIGINAL_IMPORT_COUNT);
+
+console.log(`Current number of styled-components imports: ${currentCount}`);
+console.log(`Original number of styled-components imports: ${ORIGINAL_IMPORT_COUNT}`);
+console.log(`Migration Progress: ${progress.toFixed(2)}%`);