cognite-create 0.1.7 → 0.2.0

package/bin/index.js

@@ -1,37 +1,41 @@
 #!/usr/bin/env node
 
 // eslint-disable-next-line @typescript-eslint/no-require-imports
-const { spawn } = require('node:child_process');
+const { spawn } = require("node:child_process");
 // eslint-disable-next-line @typescript-eslint/no-require-imports
-const fs = require('node:fs/promises');
+const fs = require("node:fs/promises");
 // eslint-disable-next-line @typescript-eslint/no-require-imports
-const path = require('node:path');
+const path = require("node:path");
 
-const TW_ANIMATE_PACKAGE = 'tw-animate-css';
-const TW_ANIMATE_VERSION = '^1.3.8';
+const REQUIRED_DEPENDENCIES = [
+  { name: "tw-animate-css", version: "^1.3.8" },
+  { name: "clsx", version: "^2.1.1" },
+];
 
 async function main() {
   const args = process.argv.slice(2);
 
-  if (args.length === 0 || args[0].startsWith('-')) {
-    console.error('Usage: cognite-create <project-name> [create-next-app options]');
+  if (args.length === 0 || args[0].startsWith("-")) {
+    console.error(
+      "Usage: cognite-create <project-name> [create-next-app options]"
+    );
     process.exit(1);
   }
 
   const projectDir = args[0];
-  const createArgs = ['create-next-app@latest', ...args];
+  const createArgs = ["create-next-app@latest", ...args];
   await runCreateNextApp(createArgs);
   await addCogniteTemplates(projectDir);
 }
 
 function runCreateNextApp(cliArgs) {
-  const command = process.platform === 'win32' ? 'npx.cmd' : 'npx';
+  const command = process.platform === "win32" ? "npx.cmd" : "npx";
 
   return new Promise((resolve, reject) => {
-    const child = spawn(command, cliArgs, { stdio: 'inherit' });
+    const child = spawn(command, cliArgs, { stdio: "inherit" });
 
-    child.on('error', reject);
-    child.on('close', (code) => {
+    child.on("error", reject);
+    child.on("close", (code) => {
       if (code !== 0) {
         const error = new Error(`create-next-app exited with code ${code}`);
         error.exitCode = code;
@@ -45,24 +49,24 @@ function runCreateNextApp(cliArgs) {
 
 async function addCogniteTemplates(projectDir) {
   const targetRoot = path.resolve(process.cwd(), projectDir);
-  const templateRoot = path.resolve(__dirname, '..', 'templates');
+  const templateRoot = path.resolve(__dirname, "..", "templates");
 
   try {
     await fs.access(targetRoot);
   } catch (error) {
-    if (error.code === 'ENOENT') {
+    if (error.code === "ENOENT") {
       throw new Error(
         `Expected to find the newly created project at "${projectDir}", but it was not found. ` +
-          'Check the create-next-app output for more details.'
+          "Check the create-next-app output for more details."
       );
     }
 
     throw error;
   }
 
-  await ensureTwAnimateCssInstalled(targetRoot);
+  await ensureDependenciesInstalled(targetRoot);
 
-  const srcDirectory = path.join(targetRoot, 'src');
+  const srcDirectory = path.join(targetRoot, "src");
   const templateFiles = await collectTemplateFiles(templateRoot);
 
   await fs.mkdir(srcDirectory, { recursive: true });
@@ -71,12 +75,14 @@ async function addCogniteTemplates(projectDir) {
     const normalizedPath = normalizeRelativePath(relativePath);
     const source = path.join(templateRoot, relativePath);
 
-    const pathSegments = normalizedPath.split('/');
+    const pathSegments = normalizedPath.split("/");
 
-    if (pathSegments[0] === 'app' || pathSegments[0] === 'lib') {
+    if (pathSegments[0] === "app" || pathSegments[0] === "lib") {
       const target = path.join(srcDirectory, ...pathSegments);
       const isGlobalsCss =
-        pathSegments[0] === 'app' && pathSegments.length === 2 && pathSegments[1] === 'globals.css';
+        pathSegments[0] === "app" &&
+        pathSegments.length === 2 &&
+        pathSegments[1] === "globals.css";
 
       if (isGlobalsCss) {
         await copyFileWithOverwrite(source, target);
@@ -91,7 +97,7 @@ async function addCogniteTemplates(projectDir) {
     await copyFileIfMissing(source, target);
   }
 
-  console.log('\nCognite templates copied successfully.');
+  console.log("\nCognite templates copied successfully.");
 }
 
 async function copyFileIfMissing(source, target) {
@@ -101,7 +107,7 @@ async function copyFileIfMissing(source, target) {
     await fs.access(target);
     console.warn(`Skipped existing ${path.relative(process.cwd(), target)}`);
   } catch (error) {
-    if (error.code !== 'ENOENT') {
+    if (error.code !== "ENOENT") {
       throw error;
     }
 
@@ -142,30 +148,43 @@ async function collectTemplateFiles(rootDir) {
 }
 
 function normalizeRelativePath(relativePath) {
-  return relativePath.split(path.sep).join('/');
+  return relativePath.split(path.sep).join("/");
+}
+
+function formatDependencySummary(dependencies) {
+  return dependencies
+    .map((dependency) =>
+      dependency.version ? `${dependency.name}@${dependency.version}` : dependency.name
+    )
+    .join(", ");
 }
 
-async function ensureTwAnimateCssInstalled(targetRoot) {
-  const packageJsonPath = path.join(targetRoot, 'package.json');
+async function ensureDependenciesInstalled(targetRoot) {
+  const packageJsonPath = path.join(targetRoot, "package.json");
   let packageJson;
 
   try {
-    const packageJsonContent = await fs.readFile(packageJsonPath, 'utf8');
+    const packageJsonContent = await fs.readFile(packageJsonPath, "utf8");
     packageJson = JSON.parse(packageJsonContent);
-  } catch (error) {
+  } catch {
     console.warn(
-      `\nUnable to read or parse ${path.relative(process.cwd(), packageJsonPath)}. ` +
-        `Install ${TW_ANIMATE_PACKAGE}@${TW_ANIMATE_VERSION} manually.`
+      `\nUnable to read or parse ${path.relative(
+        process.cwd(),
+        packageJsonPath
+      )}. Install ${formatDependencySummary(REQUIRED_DEPENDENCIES)} manually.`
     );
     return false;
   }
 
-  const hasDependency = Boolean(
-    (packageJson.dependencies && packageJson.dependencies[TW_ANIMATE_PACKAGE]) ||
-      (packageJson.devDependencies && packageJson.devDependencies[TW_ANIMATE_PACKAGE])
+  const missingDependencies = REQUIRED_DEPENDENCIES.filter(
+    (dependency) =>
+      !(
+        (packageJson.dependencies && packageJson.dependencies[dependency.name]) ||
+        (packageJson.devDependencies && packageJson.devDependencies[dependency.name])
+      )
   );
 
-  if (hasDependency) {
+  if (missingDependencies.length === 0) {
     return false;
   }
 
@@ -173,23 +192,27 @@ async function ensureTwAnimateCssInstalled(targetRoot) {
 
   if (!packageManager) {
     console.warn(
-      `\nCould not determine package manager for ${path.relative(process.cwd(), targetRoot)}. ` +
-        `Install ${TW_ANIMATE_PACKAGE}@${TW_ANIMATE_VERSION} manually.`
+      `\nCould not determine package manager for ${path.relative(
+        process.cwd(),
+        targetRoot
+      )}. Install ${formatDependencySummary(missingDependencies)} manually.`
     );
     return false;
   }
 
-  console.log(
-    `\nInstalling ${TW_ANIMATE_PACKAGE}@${TW_ANIMATE_VERSION} using ${packageManager}...`
-  );
-  await installDependency(packageManager, targetRoot, `${TW_ANIMATE_PACKAGE}@${TW_ANIMATE_VERSION}`);
+  const dependencySummary = formatDependencySummary(missingDependencies);
+  console.log(`\nInstalling ${dependencySummary} using ${packageManager}...`);
+  await installDependencies(packageManager, targetRoot, missingDependencies);
 
   return true;
 }
 
 async function detectPackageManager(packageJson, targetRoot) {
-  if (packageJson.packageManager && typeof packageJson.packageManager === 'string') {
-    const [name] = packageJson.packageManager.split('@');
+  if (
+    packageJson.packageManager &&
+    typeof packageJson.packageManager === "string"
+  ) {
+    const [name] = packageJson.packageManager.split("@");
 
     if (name) {
       return name;
@@ -197,10 +220,10 @@ async function detectPackageManager(packageJson, targetRoot) {
   }
 
   const candidates = [
-    { name: 'pnpm', lockFile: 'pnpm-lock.yaml' },
-    { name: 'yarn', lockFile: 'yarn.lock' },
-    { name: 'bun', lockFile: 'bun.lockb' },
-    { name: 'npm', lockFile: 'package-lock.json' },
+    { name: "pnpm", lockFile: "pnpm-lock.yaml" },
+    { name: "yarn", lockFile: "yarn.lock" },
+    { name: "bun", lockFile: "bun.lockb" },
+    { name: "npm", lockFile: "package-lock.json" },
   ];
 
   for (const candidate of candidates) {
@@ -214,21 +237,24 @@ async function detectPackageManager(packageJson, targetRoot) {
   return null;
 }
 
-async function installDependency(packageManager, cwd, dependencySpec) {
-  const { command, args } = getInstallCommand(packageManager, dependencySpec);
+async function installDependencies(packageManager, cwd, dependencies) {
+  const dependencySpecs = dependencies.map((dependency) =>
+    dependency.version ? `${dependency.name}@${dependency.version}` : dependency.name
+  );
+  const { command, args } = getInstallCommand(packageManager, dependencySpecs);
 
   if (!command) {
     throw new Error(`Unsupported package manager: ${packageManager}`);
   }
 
   return new Promise((resolve, reject) => {
-    const child = spawn(command, args, { stdio: 'inherit', cwd });
+    const child = spawn(command, args, { stdio: "inherit", cwd });
 
-    child.on('error', reject);
-    child.on('close', (code) => {
+    child.on("error", reject);
+    child.on("close", (code) => {
       if (code !== 0) {
         const error = new Error(
-          `${packageManager} exited with code ${code} while installing ${dependencySpec}`
+          `${packageManager} exited with code ${code} while installing ${dependencySpecs.join(", ")}`
         );
         error.exitCode = code;
         return reject(error);
@@ -239,25 +265,25 @@ async function installDependency(packageManager, cwd, dependencySpec) {
   });
 }
 
-function getInstallCommand(packageManager, dependencySpec) {
+function getInstallCommand(packageManager, dependencySpecs) {
   const normalized = normalizeCommand(packageManager);
 
   switch (packageManager) {
-    case 'npm':
-      return { command: normalized, args: ['install', dependencySpec] };
-    case 'pnpm':
-      return { command: normalized, args: ['add', dependencySpec] };
-    case 'yarn':
-      return { command: normalized, args: ['add', dependencySpec] };
-    case 'bun':
-      return { command: normalized, args: ['add', dependencySpec] };
+    case "npm":
+      return { command: normalized, args: ["install", ...dependencySpecs] };
+    case "pnpm":
+      return { command: normalized, args: ["add", ...dependencySpecs] };
+    case "yarn":
+      return { command: normalized, args: ["add", ...dependencySpecs] };
+    case "bun":
+      return { command: normalized, args: ["add", ...dependencySpecs] };
     default:
       return { command: null, args: [] };
   }
 }
 
 function normalizeCommand(command) {
-  if (process.platform === 'win32' && command !== 'bun') {
+  if (process.platform === "win32" && command !== "bun") {
     return `${command}.cmd`;
   }
 
@@ -269,7 +295,7 @@ async function pathExists(filePath) {
     await fs.access(filePath);
     return true;
   } catch (error) {
-    if (error && error.code === 'ENOENT') {
+    if (error && error.code === "ENOENT") {
       return false;
     }
 
@@ -278,7 +304,7 @@ async function pathExists(filePath) {
 }
 
 main().catch((error) => {
-  if (error && typeof error.exitCode === 'number') {
+  if (error && typeof error.exitCode === "number") {
     process.exit(error.exitCode);
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cognite-create",
-  "version": "0.1.7",
+  "version": "0.2.0",
   "description": "Create a Next.js app preconfigured with Cognite defaults.",
   "private": false,
   "bin": {

package/templates/.cursor/rules/general.mdc

@@ -4,4 +4,6 @@ globs:
 alwaysApply: true
 ---
 
-Use the ShadCN MCP server to check the Cognite registry for components you could use before making your own. If there are Cognite components available for what you are trying to do you must always use them over alternatives. We want to make sure our app aligns with the Cognite design system.
+Use the ShadCN MCP server to check the Cognite registry for components you could use before making your own. If there are Cognite components available for what you are trying to do you must always use them over alternatives. We want to make sure our app aligns with the Cognite design system. If there are no Cognite components you can fallback to the default ShadCN ones just make sure they align with the consistent style of the Cognite ones.
+
+Make sure to check the globals.css file for styling.