From d6159023ed0817adf14b4398874b1f5f05a73b02 Mon Sep 17 00:00:00 2001
From: Zach Warunek <58487828+zwarunek@users.noreply.github.com>
Date: Thu, 20 Feb 2025 11:41:21 -0800
Subject: [PATCH] fix(cli): monorepo cn import (#6530)

* fix monorepo cn import

* chore: changeset

* style(shadcn): format

---------

Co-authored-by: shadcn <m@shadcn.com>
---
 .changeset/orange-papayas-relax.md            |  5 ++
 .../utils/transformers/transform-import.ts    | 17 ++----
 .../transform-import.test.ts.snap             | 22 ++++++++
 .../test/utils/transform-import.test.ts       | 53 +++++++++++++++++++
 4 files changed, 85 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/orange-papayas-relax.md

diff --git a/.changeset/orange-papayas-relax.md b/.changeset/orange-papayas-relax.md
new file mode 100644
index 0000000000..56389409db
--- /dev/null
+++ b/.changeset/orange-papayas-relax.md
@@ -0,0 +1,5 @@
+---
+"shadcn": patch
+---
+
+fix cn import bug in monorepo
diff --git a/packages/shadcn/src/utils/transformers/transform-import.ts b/packages/shadcn/src/utils/transformers/transform-import.ts
index 17551bfbdd..e2c40cea3d 100644
--- a/packages/shadcn/src/utils/transformers/transform-import.ts
+++ b/packages/shadcn/src/utils/transformers/transform-import.ts
@@ -1,16 +1,14 @@
 import { Config } from "@/src/utils/get-config"
 import { Transformer } from "@/src/utils/transformers"
 
-const COMMON_CN_IMPORTS = {
-  "@/lib/utils": /^@\/lib\/utils/,
-  "@workspace/lib/utils": /^@workspace\/lib\/utils/,
-}
-
 export const transformImport: Transformer = async ({
   sourceFile,
   config,
   isRemote,
 }) => {
+  const workspaceAlias = config.aliases?.utils?.split("/")[0]?.slice(1)
+  const utilsImport = `@${workspaceAlias}/lib/utils`
+
   const importDeclarations = sourceFile.getImportDeclarations()
 
   for (const importDeclaration of importDeclarations) {
@@ -23,17 +21,12 @@ export const transformImport: Transformer = async ({
     importDeclaration.setModuleSpecifier(moduleSpecifier)
 
     // Replace `import { cn } from "@/lib/utils"`
-    if (COMMON_CN_IMPORTS[moduleSpecifier as keyof typeof COMMON_CN_IMPORTS]) {
+    if (utilsImport === moduleSpecifier) {
       const namedImports = importDeclaration.getNamedImports()
       const cnImport = namedImports.find((i) => i.getName() === "cn")
       if (cnImport) {
         importDeclaration.setModuleSpecifier(
-          moduleSpecifier.replace(
-            COMMON_CN_IMPORTS[
-              moduleSpecifier as keyof typeof COMMON_CN_IMPORTS
-            ],
-            config.aliases.utils
-          )
+          moduleSpecifier.replace(utilsImport, config.aliases.utils)
         )
       }
     }
diff --git a/packages/shadcn/test/utils/__snapshots__/transform-import.test.ts.snap b/packages/shadcn/test/utils/__snapshots__/transform-import.test.ts.snap
index 75d1bd98d3..ba6206ea69 100644
--- a/packages/shadcn/test/utils/__snapshots__/transform-import.test.ts.snap
+++ b/packages/shadcn/test/utils/__snapshots__/transform-import.test.ts.snap
@@ -69,3 +69,25 @@ import { Foo } from "bar"
     import { cn } from "@custom-alias/lib/utils"
     "
 `;
+
+exports[`transform import for monorepo 1`] = `
+"import * as React from "react"
+import { Foo } from "bar"
+    import { Button } from "@workspace/ui/components/ui/button"
+    import { Label} from "ui/label"
+    import { Box } from "@workspace/ui/components/box"
+
+    import { cn } from "@workspace/ui/lib/utils"
+    "
+`;
+
+exports[`transform import for monorepo 2`] = `
+"import * as React from "react"
+import { Foo } from "bar"
+    import { Button } from "@repo/ui/components/ui/button"
+    import { Label} from "ui/label"
+    import { Box } from "@repo/ui/components/box"
+
+    import { cn } from "@repo/ui/lib/utils"
+    "
+`;
diff --git a/packages/shadcn/test/utils/transform-import.test.ts b/packages/shadcn/test/utils/transform-import.test.ts
index 477c5235fb..29ce7073ca 100644
--- a/packages/shadcn/test/utils/transform-import.test.ts
+++ b/packages/shadcn/test/utils/transform-import.test.ts
@@ -143,3 +143,56 @@ import { Foo } from "bar"
     })
   ).toMatchSnapshot()
 })
+
+
+test("transform import for monorepo", async () => {
+  expect(
+    await transform({
+      filename: "test.ts",
+      raw: `import * as React from "react"
+import { Foo } from "bar"
+    import { Button } from "@/registry/new-york/ui/button"
+    import { Label} from "ui/label"
+    import { Box } from "@/registry/new-york/box"
+
+    import { cn } from "@/lib/utils"
+    `,
+      config: {
+        tsx: true,
+        tailwind: {
+          baseColor: "neutral",
+          cssVariables: true,
+        },
+        aliases: {
+          components: "@workspace/ui/components",
+          utils: "@workspace/ui/lib/utils",
+        },
+      },
+    })
+  ).toMatchSnapshot()
+
+  expect(
+    await transform({
+      filename: "test.ts",
+      raw: `import * as React from "react"
+import { Foo } from "bar"
+    import { Button } from "@/registry/new-york/ui/button"
+    import { Label} from "ui/label"
+    import { Box } from "@/registry/new-york/box"
+
+    import { cn } from "@/lib/utils"
+    `,
+      config: {
+        tsx: true,
+        tailwind: {
+          baseColor: "neutral",
+          cssVariables: true,
+        },
+        aliases: {
+          components: "@repo/ui/components",
+          utils: "@repo/ui/lib/utils",
+        },
+      },
+    })
+  ).toMatchSnapshot()
+})