diff --git a/src/app/admin/catalog/catalog-manager-dialog-wrapper.tsx b/src/app/admin/catalog/catalog-manager-dialog-wrapper.tsx
new file mode 100644
index 00000000..c9b0f5c3
--- /dev/null
+++ b/src/app/admin/catalog/catalog-manager-dialog-wrapper.tsx
@@ -0,0 +1,13 @@
+"use client";
+
+import dynamic from "next/dynamic";
+
+export const CatalogManagerDialog = dynamic(
+	() =>
+		import("@/components/admin/catalog-manager/catalog-manager-dialog").then(
+			(m) => ({
+				default: m.CatalogManagerDialog,
+			}),
+		),
+	{ ssr: false },
+);
diff --git a/src/app/admin/catalog/page.tsx b/src/app/admin/catalog/page.tsx
index 572e2407..2c01ea6a 100644
--- a/src/app/admin/catalog/page.tsx
+++ b/src/app/admin/catalog/page.tsx
@@ -1,4 +1,3 @@
-import dynamic from "next/dynamic";
 import { redirect } from "next/navigation";
 import { CatalogTree } from "@/components/admin/catalog-tree";
 import { Prisma } from "@/generated/prisma/client";
@@ -6,18 +5,9 @@ import { calcPagination, parseListParams } from "@/lib/admin-helpers";
 import { canAccess, getAdminContext, PERMS } from "@/lib/permissions";
 import { prisma } from "@/lib/prisma";
 import { CatalogActions } from "./catalog-actions";
+import { CatalogManagerDialog } from "./catalog-manager-dialog-wrapper";
 import { CatalogTable } from "./catalog-table";
 import { CatalogViewToggle } from "./catalog-view-toggle";
-
-const CatalogManagerDialog = dynamic(
-	() =>
-		import("@/components/admin/catalog-manager/catalog-manager-dialog").then(
-			(m) => ({
-				default: m.CatalogManagerDialog,
-			}),
-		),
-	{ ssr: false },
-);
 export default async function CatalogPagesPage({
 	params: paramsPromise,
 	searchParams,