🎁 create-lz-oapp improvements (#25)

.changeset/loud-poets-remember.md

@@ -0,0 +1,5 @@
+---
+"create-lz-oapp": patch
+---
+
+Only show available package managers when using create-lz-oapp

.changeset/plenty-tools-breathe.md

@@ -0,0 +1,5 @@
+---
+"create-lz-oapp": patch
+---
+
+Add project directory validation

package.json

@@ -5,6 +5,7 @@
     "scripts": {
         "clean": "npx turbo run clean",
         "build": "npx turbo run build",
+        "dev": "npx turbo run dev",
         "lint": "npx turbo run lint",
         "test": "npx turbo run test",
         "prepare": "husky install"

packages/create-lz-oapp/package.json

@@ -42,6 +42,7 @@
         "@tanstack/react-query": "^5.8.3",
         "@types/prompts": "^2.4.8",
         "@types/react": "^18.0.32",
+        "@types/which": "~3.0.2",
         "commander": "^11.1.0",
         "eslint-plugin-react": "^7.32.2",
         "eslint-plugin-react-hooks": "^4.6.0",
@@ -55,6 +56,7 @@
         "react-devtools-core": "^4.28.5",
         "tiged": "^2.12.5",
         "ts-node": "^10.9.1",
-        "typescript": "^5.2.2"
+        "typescript": "^5.2.2",
+        "which": "~4.0.0"
     }
 }

packages/create-lz-oapp/src/components/config.tsx

@@ -9,7 +9,7 @@ interface Props {
 
 export const ConfigSummary: React.FC<Props> = ({ value }) => {
     return (
-        <Box flexDirection="column">
+        <Box flexDirection="column" marginTop={1} marginBottom={1}>
             <Text>
                 Will create a project in <Text bold>{value.destination || "current"}</Text> directory (
                 <Text bold>{resolve(value.destination)}</Text>)

packages/create-lz-oapp/src/utilities/filesystem.ts

@@ -0,0 +1,9 @@
+import { lstatSync } from "fs"
+
+export const isDirectory = (path: string) => {
+    try {
+        return lstatSync(path).isDirectory()
+    } catch {
+        return false
+    }
+}

packages/create-lz-oapp/src/utilities/installation.ts

@@ -1,5 +1,6 @@
-import { Config } from "@/types.js"
+import type { Config, PackageManager } from "@/types.js"
 import { spawn } from "child_process"
+import which from "which"
 
 export const installDependencies = (config: Config) =>
     new Promise<void>((resolve, reject) => {
@@ -24,3 +25,5 @@ export const installDependencies = (config: Config) =>
             } else resolve()
         })
     })
+
+export const isPackageManagerAvailable = ({ command }: PackageManager): boolean => !!which.sync(command, { nothrow: true })

packages/create-lz-oapp/src/utilities/prompts.ts

@@ -1,5 +1,8 @@
 import { EXAMPLES, PACKAGE_MANAGERS } from "@/config.js"
 import prompts from "prompts"
+import { isPackageManagerAvailable } from "./installation.js"
+import { isDirectory } from "./filesystem.js"
+import { resolve } from "path"
 
 const handlePromptState = (state: any) => {
     if (state.aborted) {
@@ -16,6 +19,7 @@ export const promptForContinue = async () =>
         type: "confirm",
         name: "pleasecontinue",
         message: "Would you like to continue?",
+        initial: true,
     }).then(({ pleasecontinue }): boolean => pleasecontinue)
 
 export const promptForConfig = () =>
@@ -26,7 +30,7 @@ export const promptForConfig = () =>
             name: "destination",
             message: "Where do you want to start your project?",
             initial: "./my-lz-oapp",
-            // FIXME Check whether the directory is empty or does not exist
+            validate: (path: string) => (isDirectory(path) ? `Directory '${resolve(path)}' already exists` : true),
         },
         {
             onState: handlePromptState,
@@ -39,7 +43,10 @@ export const promptForConfig = () =>
             onState: handlePromptState,
             type: "select",
             name: "packageManager",
-            choices: PACKAGE_MANAGERS.map((packageManager) => ({ title: packageManager.label, value: packageManager })),
+            choices: PACKAGE_MANAGERS.filter(isPackageManagerAvailable).map((packageManager) => ({
+                title: packageManager.label,
+                value: packageManager,
+            })),
             message: "What package manager would you like to use in your project?",
         },
     ])

yarn.lock

@@ -1632,6 +1632,11 @@
   resolved "https://registry.npmjs.org/@types/triple-beam/-/triple-beam-1.3.5.tgz"
   integrity sha512-6WaYesThRMCl19iryMYP7/x2OVgCtbIVflDGFpWnb9irXI3UjYE4AzmYuiUKY1AJstGijoY+MgUszMgRxIYTYw==
 
+"@types/which@~3.0.2":
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/@types/which/-/which-3.0.2.tgz#bb478af6c5dc1d1e902e7bd25c308075e7cc8d42"
+  integrity sha512-UqCG7NjNyume6e+BHcFkOQOS8of/E18V2z/jTRkiD98YiiryYOFBVvPxqA/8PQCwkn7icKqz/hFflMIRN2HGhQ==
+
 "@typescript-eslint/eslint-plugin@^6.9.0":
   version "6.10.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.10.0.tgz"
@@ -4687,6 +4692,11 @@ isexe@^2.0.0:
   resolved "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
   integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
 
+isexe@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/isexe/-/isexe-3.1.1.tgz#4a407e2bd78ddfb14bea0c27c6f7072dde775f0d"
+  integrity sha512-LpB/54B+/2J5hqQ7imZHfdU31OlgQqx7ZicVlkm9kzg9/w8GKLEcFfJl/t7DCEDueOyBAD6zCCwTO6Fzs0NoEQ==
+
 iterator.prototype@^1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.2.tgz"
@@ -7407,6 +7417,13 @@ which@^2.0.1:
   dependencies:
     isexe "^2.0.0"
 
+which@~4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/which/-/which-4.0.0.tgz#cd60b5e74503a3fbcfbf6cd6b4138a8bae644c1a"
+  integrity sha512-GlaYyEb07DPxYCKhKzplCWBJtvxZcZMrL+4UkrTSJHHPyZU4mYYTv3qaOe77H7EODLSSopAUFAc6W8U4yqvscg==
+  dependencies:
+    isexe "^3.1.1"
+
 widest-line@^3.1.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/widest-line/-/widest-line-3.1.0.tgz"