docs(deps): script analyse deps (#5470)

* docs(deps): script analyse deps

Signed-off-by: protobuf-ci-cd <[email protected]>

* feat: add sorted record

* fix: gitignore

---------

Signed-off-by: protobuf-ci-cd <[email protected]>
Co-authored-by: lisa <[email protected]>

Author: philibea

.gitignore

@@ -17,6 +17,9 @@ storybook-static
 .reports
 .pnpm-store
 
+deps.json
+depsFiltered.json
+
 # VSCode extension "Local History"
 .history
 

package.json

@@ -33,6 +33,8 @@
     "oxc": "oxlint -c .oxlintrc.json",
     "oxc:fix": "pnpm run oxc --fix",
     "prepare": "husky",
+    "analyse:deps:ui": "tsx ./utils/scripts/analyse-deps.ts packages/ui/src/components",
+    "analyse:deps:form": "tsx ./utils/scripts/analyse-deps.ts packages/form/src/components",
     "tokens:update": "tsx ./utils/scripts/figma-synchronise-tokens.tsx && pnpm run format packages/themes/src/themes/console",
     "icons:update": "tsx ./utils/scripts/generate-icons-file.tsx && pnpm run format packages/icons",
     "release": "pnpm build && pnpm changeset publish",

pnpm-lock.yaml

@@ -0,0 +1,134 @@
+import fs from 'node:fs'
+import path from 'node:path'
+
+const cwd = process.cwd()
+const args = process.argv.slice(2)
+
+const srcDir = path.join(cwd, args[0] ?? 'packages/ui/src/components')
+
+type DependencyGraph = {
+  [componentName: string]: {
+    dependsOn: string[]
+  }
+}
+
+const graph: DependencyGraph = {}
+
+const walk = (dir: string): string[] => {
+  const results = []
+  const list = fs.readdirSync(dir)
+
+  for (const file of list) {
+    const filePath = path.join(dir, file)
+
+    const stat = fs.statSync(filePath)
+    if (stat.isDirectory()) {
+      const subDirResult = walk(filePath)
+
+      results.push(...subDirResult)
+    } else {
+      results.push(filePath)
+    }
+  }
+
+  return results
+}
+
+const filesToAnalyze = walk(srcDir)
+
+for (const file of filesToAnalyze) {
+  if (
+    (file.endsWith('.ts') || file.endsWith('.tsx')) &&
+    !['stories.tsx', 'test.tsx'].some(end => file.endsWith(end))
+  ) {
+    const relativePath = path.relative(srcDir, file)
+    const componentName = relativePath.split('/')[0]
+
+    const content = fs.readFileSync(file, 'utf8')
+
+    const matches = content.matchAll(
+      /import\s+(?:.*?from\s+)?(['"])(.*?)(['"])|export\s+{?\s*(\w+)?\s*}?$/g,
+    )
+
+    for (const match of matches) {
+      const importedFile = match[2] || null
+      if (importedFile) {
+        const normalizedFile = path
+          .relative(srcDir, path.join(path.dirname(file), importedFile))
+          .replace(/\.tsx?$/, '')
+
+        if (
+          ![
+            'react',
+            'react-vite',
+            'vitest',
+            'styled',
+            '@emotion/styled',
+            'components/',
+          ].some(string => normalizedFile.endsWith(string))
+        ) {
+          const importedComponent = normalizedFile.split('/').reverse()[0]
+
+          if (!graph[componentName]) {
+            graph[componentName] = { dependsOn: [] }
+          }
+
+          if (importedComponent !== componentName) {
+            const { dependsOn } = graph[componentName]
+            const newDeps = [...new Set([...dependsOn, importedComponent])]
+            graph[componentName].dependsOn = newDeps
+          }
+        }
+      }
+    }
+  }
+}
+
+const sortGraphByDependencySize = ({
+  currentGraph,
+  order = 'asc',
+}: {
+  currentGraph: DependencyGraph
+  order?: 'asc' | 'desc'
+}) => {
+  const entries = Object.entries(currentGraph)
+
+  entries.sort((a, b) => {
+    const aSize = a[1].dependsOn.length
+    const bSize = b[1].dependsOn.length
+
+    return order === 'asc' ? bSize - aSize : aSize - bSize
+  })
+
+  return {
+    order,
+    sortedComponent: entries,
+  }
+}
+
+const sortedComponent = sortGraphByDependencySize({
+  currentGraph: graph,
+  order: 'desc',
+})
+
+const { info } = console
+info('sortedComponent', JSON.stringify(graph, null, 2))
+fs.writeFileSync('deps.json', JSON.stringify(sortedComponent, null, 2))
+
+const componentNames = new Set(
+  sortedComponent.sortedComponent.map(([name]) => name),
+)
+const asRecord = Object.fromEntries(
+  sortedComponent.sortedComponent
+    .map(([name, count]) => {
+      const { dependsOn } = count as { dependsOn: string[] }
+      const filteredDeps = dependsOn.filter(dependency =>
+        componentNames.has(dependency),
+      )
+
+      return [name, filteredDeps.length] as const
+    })
+    .sort(([, aCount], [, bCount]) => aCount - bCount),
+)
+
+fs.writeFileSync('depsFiltered.json', JSON.stringify(asRecord, null, 2))