create-nextjs-cms 0.5.66 → 0.5.68

package/dist/lib/cms-setup.js

@@ -1,29 +1,25 @@
 import chalk from 'chalk';
-import { logger } from './logger.js';
-import { execWithoutSpinner } from './exec-utils.js';
-import { log } from '@clack/prompts';
-const runCmsSetupCommand = async (projectDir) => {
+import { logger } from '../helpers/logger.js';
+import { execWithoutSpinner } from '../helpers/exec-utils.js';
+import * as p from '@clack/prompts';
+const runCmsSetupCommand = async ({ preferredPM, projectDir, }) => {
     // For all package managers, use inherit for stdout/stderr to avoid hanging issues
     // The command will show its own output and the spinner will just indicate progress
-    await execWithoutSpinner('nextjs-cms-kit', ['--dev', 'setup'], {
+    await execWithoutSpinner(preferredPM, ['nextjs-cms-kit', '--dev', 'setup'], {
         cwd: projectDir,
         stdout: 'inherit',
         stderr: 'inherit',
     });
     return null;
 };
-export const runCmsSetup = async ({ dir, installed, preferredPM, }) => {
-    log.info(chalk.cyan('Running CMS setup...'));
+export const runCmsSetup = async ({ dir, preferredPM }) => {
+    p.log.info(chalk.cyan('Running CMS setup'));
     try {
-        await runCmsSetupCommand(dir);
-        logger.success('\n🎉 Your NextJS CMS project has been created successfully!');
-        logger.message('\nNext steps:');
-        logger.message(`  cd ${dir}`);
-        logger.message(installed ? `  ${preferredPM} dev` : `  ${preferredPM} install && ${preferredPM} dev`);
+        await runCmsSetupCommand({ preferredPM, projectDir: dir });
     }
     catch (error) {
         logger.error('⚠️  CMS setup failed. You may need to run it manually:');
-        logger.warn('   nextjs-cms-kit --dev setup');
+        logger.warn(`${preferredPM} nextjs-cms-kit --dev setup`);
         logger.error(`   Error: ${error instanceof Error ? error.message : 'Unknown error'}`);
         throw error;
     }

package/dist/lib/create-project.d.ts

@@ -0,0 +1,9 @@
+interface CreateProjectOptions {
+    targetDir: string;
+    sectionsToAdd: ('blog' | 'category' | 'simple')[];
+    projectName: string;
+    preferredPM: string;
+}
+export declare const createProject: ({ targetDir, sectionsToAdd, projectName, preferredPM }: CreateProjectOptions) => Promise<void>;
+export {};
+//# sourceMappingURL=create-project.d.ts.map

package/dist/lib/create-project.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-project.d.ts","sourceRoot":"","sources":["../../src/lib/create-project.ts"],"names":[],"mappings":"AASA,UAAU,oBAAoB;IAC1B,SAAS,EAAE,MAAM,CAAA;IACjB,aAAa,EAAE,CAAC,MAAM,GAAG,UAAU,GAAG,QAAQ,CAAC,EAAE,CAAA;IACjD,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,aAAa,GAAU,wDAAwD,oBAAoB,kBAmE/G,CAAA"}

package/dist/lib/create-project.js

@@ -0,0 +1,69 @@
+import { relative } from 'node:path';
+import path from 'node:path';
+import fs from 'fs-extra';
+import * as p from '@clack/prompts';
+import chalk from 'chalk';
+import { fileURLToPath } from 'node:url';
+import { updateEnvSecrets } from '../helpers/utils.js';
+import { createBlogSection, createCategorySection, createSimpleSection } from './section-creators.js';
+export const createProject = async ({ targetDir, sectionsToAdd, projectName, preferredPM }) => {
+    p.log.info(`Creating project in: ${chalk.green(targetDir)}`);
+    p.log.message(` - Using ${chalk.green(preferredPM)}`);
+    const templateDir = fileURLToPath(new URL('../../templates/default/', import.meta.url));
+    // Copy template → project dir with a filter to skip build/cache artifacts
+    await fs.copy(templateDir, targetDir, {
+        filter: (src) => {
+            const rel = relative(templateDir, src);
+            if (!rel || rel === '.')
+                return true;
+            return (!rel.startsWith('node_modules') &&
+                !rel.startsWith('.next') &&
+                !rel.startsWith('dist') &&
+                !rel.startsWith('.turbo') &&
+                !rel.includes('tsconfig.tsbuildinfo'));
+        },
+        // Overwrite is safe since target is ensured empty (or new)
+        overwrite: true,
+        errorOnExist: false,
+    });
+    // Generate random secrets for .env file
+    await updateEnvSecrets(targetDir);
+    // npm excludes .gitignore from packages, so we rename it back from _gitignore
+    const gitignoreTemplatePath = path.join(targetDir, '_gitignore');
+    const gitignorePath = path.join(targetDir, '.gitignore');
+    if (await fs.pathExists(gitignoreTemplatePath)) {
+        await fs.move(gitignoreTemplatePath, gitignorePath);
+    }
+    // Create selected sections
+    if (sectionsToAdd.length > 0) {
+        for (const section of sectionsToAdd) {
+            switch (section) {
+                case 'blog':
+                    await createBlogSection(targetDir);
+                    break;
+                case 'category':
+                    await createCategorySection(targetDir);
+                    break;
+                case 'simple':
+                    await createSimpleSection(targetDir);
+                    break;
+            }
+        }
+        p.log.message(` - ${chalk.green(sectionsToAdd.join(', '))} section${sectionsToAdd.length > 1 ? 's' : ''} added successfully`);
+    }
+    // Update package.json name (if template contains package.json)
+    const packageJsonPath = path.join(targetDir, 'package.json');
+    if (await fs.pathExists(packageJsonPath)) {
+        try {
+            const pkg = (await fs.readJson(packageJsonPath));
+            pkg.name = projectName;
+            await fs.writeJson(packageJsonPath, pkg, { spaces: 2 });
+        }
+        catch {
+            p.log.warn('Could not update package.json name automatically.');
+        }
+    }
+    else {
+        p.log.warn('No package.json found in template root; skipping name update.');
+    }
+};

package/dist/lib/git.d.ts

@@ -0,0 +1,6 @@
+/** @returns Whether or not the provided directory has a `.git` subdirectory in it. */
+export declare const isRootGitRepo: (dir: string) => boolean;
+/** @returns Whether or not this directory or a parent directory has a `.git` directory. */
+export declare const isInsideGitRepo: (dir: string) => Promise<boolean>;
+export declare const initializeGit: (projectDir: string) => Promise<void>;
+//# sourceMappingURL=git.d.ts.map

package/dist/lib/git.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"git.d.ts","sourceRoot":"","sources":["../../src/lib/git.ts"],"names":[],"mappings":"AAiBA,sFAAsF;AACtF,eAAO,MAAM,aAAa,GAAI,KAAK,MAAM,KAAG,OAE3C,CAAA;AAED,2FAA2F;AAC3F,eAAO,MAAM,eAAe,GAAU,KAAK,MAAM,KAAG,OAAO,CAAC,OAAO,CAYlE,CAAA;AAkBD,eAAO,MAAM,aAAa,GAAU,YAAY,MAAM,kBA0ErD,CAAA"}

package/dist/lib/git.js

@@ -0,0 +1,116 @@
+import { execSync } from 'child_process';
+import path from 'path';
+import * as p from '@clack/prompts';
+import chalk from 'chalk';
+import { execa } from 'execa';
+import fs from 'fs-extra';
+import ora from 'ora';
+const isGitInstalled = (dir) => {
+    try {
+        execSync('git --version', { cwd: dir });
+        return true;
+    }
+    catch {
+        return false;
+    }
+};
+/** @returns Whether or not the provided directory has a `.git` subdirectory in it. */
+export const isRootGitRepo = (dir) => {
+    return fs.existsSync(path.join(dir, '.git'));
+};
+/** @returns Whether or not this directory or a parent directory has a `.git` directory. */
+export const isInsideGitRepo = async (dir) => {
+    try {
+        // If this command succeeds, we're inside a git repo
+        await execa('git', ['rev-parse', '--is-inside-work-tree'], {
+            cwd: dir,
+            stdout: 'ignore',
+        });
+        return true;
+    }
+    catch {
+        // Else, it will throw a git-error and we return false
+        return false;
+    }
+};
+const getGitVersion = () => {
+    const stdout = execSync('git --version').toString().trim();
+    const gitVersionTag = stdout.split(' ')[2];
+    const major = gitVersionTag?.split('.')[0];
+    const minor = gitVersionTag?.split('.')[1];
+    return { major: Number(major), minor: Number(minor) };
+};
+/** @returns The git config value of "init.defaultBranch". If it is not set, returns "main". */
+const getDefaultBranch = () => {
+    const stdout = execSync('git config --global init.defaultBranch || echo main').toString().trim();
+    return stdout;
+};
+// This initializes the Git-repository for the project
+export const initializeGit = async (projectDir) => {
+    p.log.info(chalk.cyan('Initializing Git'));
+    if (!isGitInstalled(projectDir)) {
+        p.log.warn(`❌ ${chalk.yellow('Git is not installed. Skipping Git initialization')}`);
+        return;
+    }
+    const spinner = ora('Creating a new git repo...\n').start();
+    const isRoot = isRootGitRepo(projectDir);
+    const isInside = await isInsideGitRepo(projectDir);
+    const dirName = path.parse(projectDir).name; // skip full path for logging
+    if (isInside && isRoot) {
+        // Dir is a root git repo
+        spinner.stop();
+        const overwriteGit = await p.confirm({
+            message: `${chalk.redBright.bold('Warning:')} Git is already initialized in "${dirName}". Initializing a new git repository would delete the previous history. Would you like to continue anyways?`,
+            initialValue: false,
+        });
+        if (!overwriteGit) {
+            p.log.message(` - ${chalk.gray('Skipping Git initialization')}`);
+            return;
+        }
+        // Deleting the .git folder
+        fs.removeSync(path.join(projectDir, '.git'));
+    }
+    else if (isInside && !isRoot) {
+        // Dir is inside a git worktree
+        spinner.stop();
+        const initializeChildGitRepo = await p.confirm({
+            message: `${chalk.redBright.bold('Warning:')} "${dirName}" is already in a git worktree. Would you still like to initialize a new git repository in this directory?`,
+            initialValue: false,
+        });
+        if (!initializeChildGitRepo) {
+            p.log.message(` - ${chalk.gray('Skipping Git initialization')}`);
+            return;
+        }
+    }
+    // We're good to go, initializing the git repo
+    try {
+        const branchName = getDefaultBranch();
+        // --initial-branch flag was added in git v2.28.0
+        const { major, minor } = getGitVersion();
+        if (major < 2 || (major == 2 && minor < 28)) {
+            await execa('git', ['init'], { cwd: projectDir });
+            // symbolic-ref is used here due to refs/heads/master not existing
+            // It is only created after the first commit
+            // https://superuser.com/a/1419674
+            await execa('git', ['symbolic-ref', 'HEAD', `refs/heads/${branchName}`], {
+                cwd: projectDir,
+            });
+        }
+        else {
+            await execa('git', ['init', `--initial-branch=${branchName}`], {
+                cwd: projectDir,
+            });
+        }
+        await execa('git', ['add', '.'], { cwd: projectDir });
+        spinner.stop();
+        p.log.message(`${chalk.green(' - ✓ Successfully initialized and staged')} ${chalk.green.bold('git')}`);
+    }
+    catch {
+        spinner.stop();
+        // Safeguard, should be unreachable
+        p.log.message(` - ❌ ${chalk.yellow('could not initialize git. Update git to the latest version!')}`);
+    }
+    finally {
+        spinner.stop();
+    }
+};

package/dist/lib/install-deps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"install-deps.d.ts","sourceRoot":"","sources":["../../src/lib/install-deps.ts"],"names":[],"mappings":"AA4DA,eAAO,MAAM,mBAAmB,GAAU,gBAAgB;IAAE,UAAU,EAAE,MAAM,CAAA;CAAE,kBA6D/E,CAAA"}
+{"version":3,"file":"install-deps.d.ts","sourceRoot":"","sources":["../../src/lib/install-deps.ts"],"names":[],"mappings":"AA4DA,eAAO,MAAM,mBAAmB,GAAU,gBAAgB;IAAE,UAAU,EAAE,MAAM,CAAA;CAAE,kBA8D/E,CAAA"}

package/dist/lib/install-deps.js

@@ -1,9 +1,9 @@
 import chalk from 'chalk';
 import ora from 'ora';
 import { log } from '@clack/prompts';
-import { logger } from './logger.js';
-import { detectPackageManager } from './utils.js';
-import { execWithSpinner, execWithoutSpinner } from './exec-utils.js';
+import { logger } from '../helpers/logger.js';
+import { detectPackageManager } from '../helpers/utils.js';
+import { execWithSpinner, execWithoutSpinner } from '../helpers/exec-utils.js';
 const runInstallCommand = async (pkgManager, projectDir) => {
     switch (pkgManager) {
         // When using npm, inherit both stdout and stderr so that the progress bar is shown
@@ -52,7 +52,7 @@ const runInstallCommand = async (pkgManager, projectDir) => {
     }
 };
 export const installDependencies = async ({ projectDir }) => {
-    log.info(chalk.cyan('Installing dependencies...'));
+    log.info(chalk.cyan('Installing dependencies'));
     const pkgManager = detectPackageManager();
     try {
         const installSpinner = await runInstallCommand(pkgManager, projectDir);
@@ -60,11 +60,8 @@ export const installDependencies = async ({ projectDir }) => {
         // If not, create a new spinner for success message
         if (installSpinner) {
             installSpinner.stop();
-            // log.message(chalk.green('Successfully installed dependencies!'))
-        }
-        else {
-            // log.message(chalk.green('Successfully installed dependencies!'))
         }
+        log.message(chalk.green(' - ✓ Successfully installed dependencies'));
     }
     catch (error) {
         const errorMessage = error instanceof Error ? error.message : String(error);
@@ -76,7 +73,7 @@ export const installDependencies = async ({ projectDir }) => {
             // Run pnpm install -g to recreate global node_modules (non-interactive)
             try {
                 const fixSpinner = ora('Fixing pnpm global store...').start();
-                await execWithoutSpinner('pnpm', ['install', '-g', '--yes'], {
+                await execWithoutSpinner('pnpm', ['install', '-g', '--force'], {
                     stdout: 'ignore',
                     stderr: 'ignore',
                     reject: false, // Don't fail if this doesn't work
@@ -84,20 +81,22 @@ export const installDependencies = async ({ projectDir }) => {
                         CI: 'true', // Make pnpm non-interactive
                     },
                 });
-                fixSpinner.succeed('Fixed pnpm global store');
+                fixSpinner.stop();
+                log.message(' - Fixed pnpm global store');
                 // Retry the original install command
-                log.message('Retrying pnpm install...');
+                log.message(' - Retrying pnpm install...');
                 const retrySpinner = await runInstallCommand(pkgManager, projectDir);
                 if (retrySpinner) {
-                    retrySpinner.succeed(chalk.green('Successfully installed dependencies!'));
+                    retrySpinner.stop();
+                    log.message(chalk.green(' - ✓ Successfully installed dependencies'));
                 }
                 else {
-                    ora().succeed(chalk.green('Successfully installed dependencies!'));
+                    log.message(chalk.green(' - ✓ Successfully installed dependencies'));
                 }
                 return;
             }
             catch (retryError) {
-                ora().fail(chalk.red('Failed to fix pnpm path length issue'));
+                ora().fail(chalk.red(' - ❌ Failed to fix pnpm path length issue'));
                 logger.error('⚠️  Could not automatically fix the issue.');
                 logger.message('');
                 logger.message('Try one of these solutions:');

package/dist/lib/validate-app-name.d.ts

@@ -0,0 +1,2 @@
+export declare const validateAppName: (rawInput: string) => "Invalid project name: Project name can only contain letters, numbers, hyphens, and underscores." | undefined;
+//# sourceMappingURL=validate-app-name.d.ts.map

package/dist/lib/validate-app-name.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"validate-app-name.d.ts","sourceRoot":"","sources":["../../src/lib/validate-app-name.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,GAAI,UAAU,MAAM,kHAQ/C,CAAA"}

package/dist/lib/validate-app-name.js

@@ -0,0 +1,10 @@
+import { isValidPkgName } from '../helpers/utils.js';
+export const validateAppName = (rawInput) => {
+    const valid = isValidPkgName(rawInput);
+    if (valid) {
+        return;
+    }
+    else {
+        return 'Invalid project name: Project name can only contain letters, numbers, hyphens, and underscores.';
+    }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-nextjs-cms",
-  "version": "0.5.66",
+  "version": "0.5.68",
   "private": false,
   "type": "module",
   "bin": {

package/templates/default/app/(rootLayout)/(plugins)/[...slug]/PluginClient.tsx

@@ -0,0 +1,55 @@
+'use client'
+
+import dynamic from 'next/dynamic'
+import React, { useMemo } from 'react'
+import { trpc } from '@/app/_trpc/client'
+import { getPluginClientLoader } from './plugin-registry'
+
+type PluginClientProps = {
+    packageName: string
+    component: string
+}
+
+const isComponentType = (value: unknown): value is React.ComponentType<any> => {
+    if (typeof value === 'function') return true
+    if (typeof value === 'object' && value !== null && '$$typeof' in value) return true
+    return false
+}
+
+export function PluginClient({ packageName, component }: PluginClientProps) {
+    const loader = getPluginClientLoader(packageName)
+    if (!loader) {
+        return <div className='text-destructive p-6 text-sm'>Plugin client package not registered: {packageName}</div>
+    }
+
+    const Component = useMemo(
+        () =>
+            dynamic(
+                async () => {
+                    const mod = await loader()
+                    const resolved =
+                        (mod.components && mod.components[component]) ||
+                        (mod as Record<string, React.ComponentType<any>>)[component] ||
+                        mod.default
+
+                    if (!resolved || !isComponentType(resolved)) {
+                        return {
+                            default: () => (
+                                <div className='text-destructive p-6 text-sm'>
+                                    Plugin component not found: {component}
+                                </div>
+                            ),
+                        }
+                    }
+
+                    return { default: resolved }
+                },
+                { ssr: false },
+            ),
+        [component, loader],
+    )
+
+    return <Component trpc={trpc} />
+}
+
+export default PluginClient

package/templates/default/app/(rootLayout)/(plugins)/[...slug]/page.tsx

@@ -0,0 +1,41 @@
+import { notFound, redirect } from 'next/navigation'
+import { api, HydrateClient } from 'nextjs-cms/api/trpc/server'
+import { findPluginRouteByPath } from 'nextjs-cms/plugins/server'
+import PluginClient from './PluginClient'
+
+export const dynamic = 'force-dynamic'
+type Params = Promise<{ slug?: string[] }>
+
+export default async function Page(props: { params: Params }) {
+    const params = await props.params
+    const slug = params.slug ?? []
+
+    if (slug[0] === 'plugin') {
+        const rest = slug.slice(1)
+        if (rest.length === 0) {
+            const routes = await api.plugins.routes()
+            const target = routes[0]?.path
+            if (target) {
+                redirect(target)
+            }
+            notFound()
+        }
+        redirect(`/${rest.join('/')}`)
+    }
+
+    const path = `/${slug.join('/')}`
+    const route = await findPluginRouteByPath(path)
+    if (!route) {
+        notFound()
+    }
+
+    if (route.prefetch) {
+        await route.prefetch({ api })
+    }
+
+    return (
+        <HydrateClient>
+            <PluginClient packageName={route.pluginId} component={route.component} />
+        </HydrateClient>
+    )
+}

package/templates/default/app/(rootLayout)/(plugins)/[...slug]/plugin-registry.ts

@@ -0,0 +1,16 @@
+import type { ComponentType } from 'react'
+
+export type PluginClientComponent = ComponentType<any>
+
+export type PluginClientModule = {
+    components?: Record<string, PluginClientComponent>
+    default?: unknown
+    [key: string]: unknown
+}
+
+export type PluginClientLoader = () => Promise<PluginClientModule>
+
+// Keep this list in sync with cms.config.ts and apps/cms/package.json.
+const pluginClientLoaders: Record<string, PluginClientLoader> = {}
+
+export const getPluginClientLoader = (packageName: string) => pluginClientLoaders[packageName]

package/templates/default/app/(rootLayout)/page.tsx

@@ -1,9 +1,10 @@
-import React from 'react'
-
-import Dashboard from './dashboard/page'
+import { redirect } from 'next/navigation'
+import { getPluginRoutes } from 'nextjs-cms/plugins/server'
 
 export const dynamic = 'force-dynamic'
 
-export default function Home() {
-    return <Dashboard />
+export default async function Home() {
+    const routes = await getPluginRoutes()
+    const target = routes[0]?.path ?? '/admins'
+    redirect(target)
 }

package/templates/default/app/_trpc/client.ts

@@ -1,4 +1,4 @@
 import type { AppRouter } from 'nextjs-cms/api'
-import { createTRPCReact} from '@trpc/react-query'
+import { createTRPCReact } from '@trpc/react-query'
 
 export const trpc = createTRPCReact<AppRouter>()

package/templates/default/app/api/trpc/[trpc]/route.ts

@@ -1,5 +1,5 @@
 import { fetchRequestHandler } from '@trpc/server/adapters/fetch'
-import { appRouter, createTRPCContext } from 'nextjs-cms/api'
+import { createTRPCContext, getAppRouter } from 'nextjs-cms/api'
 import { NextRequest } from 'next/server'
 
 /**
@@ -13,11 +13,11 @@ const context = async (req: NextRequest) => {
     })
 }
 
-const handler = (req: NextRequest) =>
+const handler = async (req: NextRequest) =>
     fetchRequestHandler({
         endpoint: '/api/trpc',
         req,
-        router: appRouter,
+        router: await getAppRouter(),
         createContext: () => context(req),
         /*onError(opts) {
             return opts.error

package/templates/default/cms.config.ts

@@ -2,8 +2,7 @@ import type { CMSConfig } from 'nextjs-cms/core/config'
 import process from 'process'
 import { resolve } from 'path'
 
-export const config: CMSConfig = {
-    ui: {
+export const config: CMSConfig = {
         title: 'NEXT CMS Admin',
         defaultTheme: 'dark',
         logo: '/logo.svg',

package/templates/default/components/AdminCard.tsx

@@ -9,7 +9,7 @@ import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
 import { trpc } from '@/app/_trpc/client'
 import Image from 'next/image'
-import { RouterOutputs } from 'nextjs-cms/api'
+import type { RouterOutputs } from 'nextjs-cms/api'
 
 export default function AdminCard({
     admin,

package/templates/default/components/AdminPrivilegeCard.tsx

@@ -5,7 +5,7 @@ import React, { useEffect } from 'react'
 import getString from 'nextjs-cms/translations'
 import { Badge } from '@/components/ui/badge'
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
-import { RouterOutputs } from 'nextjs-cms/api'
+import type { RouterOutputs } from 'nextjs-cms/api'
 
 export default function AdminRoleCard({
     privilege,

package/templates/default/components/CategorySectionSelectInput.tsx

@@ -7,7 +7,7 @@ import SelectInputButtons from '@/components/SelectInputButtons'
 import getString from 'nextjs-cms/translations'
 import { trpc } from '@/app/_trpc/client'
 import { SelectOption } from 'nextjs-cms/core/fields'
-import { RouterOutputs } from 'nextjs-cms/api'
+import type { RouterOutputs } from 'nextjs-cms/api'
 import { nanoid } from 'nanoid'
 
 type CategorySelect = RouterOutputs['categorySections']['get']['data']

package/templates/default/components/DashboardPage.tsx

@@ -11,7 +11,7 @@ import { trpc } from '@/app/_trpc/client'
 ChartJS.register(ArcElement, Tooltip, Legend)
 
 const DashboardPage = () => {
-    const { isLoading, isError, data, error } = trpc.cpanel.getData.useQuery()
+    const { isLoading, isError, data, error } = trpc.cpanelDashboard.getData.useQuery()
 
     useEffect(() => {}, [])
 

package/templates/default/components/EmailCard.tsx

@@ -14,7 +14,7 @@ export default function EmailCard({ email, action }: { email: EmailItem; action:
     const { setModal, modal, modalResponse, setModalResponse } = useModal()
     const { toast } = useToast()
 
-    const deleteMutation = trpc.cpanel.deleteEmail.useMutation({
+    const deleteMutation = trpc.cpanelEmails.deleteEmail.useMutation({
         onError: (error) => {
             setModalResponse({
                 message: error.message,

package/templates/default/components/EmailPasswordForm.tsx

@@ -9,7 +9,7 @@ export default function EmailPasswordForm({ email, action }: { email: string; ac
     const { setModal, modal, modalResponse, setModalResponse } = useModal()
 
     const { toast } = useToast()
-    const quotaMutation = trpc.cpanel.passwordChange.useMutation({
+    const quotaMutation = trpc.cpanelEmails.passwordChange.useMutation({
         onError: (error) => {
             setModal({
                 title: getString('error'),

package/templates/default/components/EmailQuotaForm.tsx

@@ -10,7 +10,7 @@ export default function EmailQuotaForm({ email, action }: { email: string; actio
     const { setModal, modal, modalResponse, setModalResponse } = useModal()
     const { toast } = useToast()
 
-    const quotaMutation = trpc.cpanel.quotaChange.useMutation({
+    const quotaMutation = trpc.cpanelEmails.quotaChange.useMutation({
         onError: (error) => {
             setModal({
                 title: getString('error'),

package/templates/default/components/EmailsPage.tsx

@@ -11,7 +11,7 @@ import { trpc } from '@/app/_trpc/client'
 const EmailsPage = () => {
     const controller = new AbortController()
 
-    const { isLoading, isError, data, error, refetch } = trpc.cpanel.getEmails.useQuery()
+    const { isLoading, isError, data, error, refetch } = trpc.cpanelEmails.getEmails.useQuery()
 
     useEffect(() => {
         return () => {

package/templates/default/components/NewAdminForm.tsx

@@ -6,7 +6,7 @@ import { useToast } from '@/components/ui/use-toast'
 import { trpc } from '@/app/_trpc/client'
 import AdminRoleCard from '@/components/AdminPrivilegeCard'
 import { Button } from '@/components/ui/button'
-import { RouterOutputs } from 'nextjs-cms/api'
+import type { RouterOutputs } from 'nextjs-cms/api'
 
 export default function NewAdminForm({
     privileges,

package/templates/default/components/NewEmailForm.tsx

@@ -10,7 +10,7 @@ export default function NewEmailForm({ action }: { action: any }) {
     const { setModal, modal, modalResponse, setModalResponse } = useModal()
     const formRef = React.useRef<HTMLFormElement>(null)
     const { toast } = useToast()
-    const newEmailMutation = trpc.cpanel.createEmail.useMutation({
+    const newEmailMutation = trpc.cpanelEmails.createEmail.useMutation({
         onError: (error) => {
             setModal({
                 title: getString('error'),

package/templates/default/components/SectionItemCard.tsx

@@ -9,7 +9,7 @@ import { CardTitle, CardHeader, CardFooter, Card, CardContent } from '@/componen
 import { Button } from '@/components/ui/button'
 import { PersonIcon } from '@radix-ui/react-icons'
 import { trpc } from '@/app/_trpc/client'
-import { RouterOutputs } from 'nextjs-cms/api'
+import type { RouterOutputs } from 'nextjs-cms/api'
 
 // Used to get elements of array types as types
 type ArrElement<ArrType> = ArrType extends readonly (infer ElementType)[] ? ElementType : never