Rename project from thoughtbelt to Belt (#32)

[Ticket](https://trello.com/c/uzf7Yj1p/31-finalize-name-of-the-thoughtbelt-tool).
This is currently in a private Trello board, will be migrating this
project to GitHub as the repo becomes public.

* [x] Rename repo to "belt"
* [x] Publish npm package "create-belt-app"
* [x] Update references to thoughtbelt in the code
* [x] Test the published package to ensure it works as expected
  * [x] `npx create-belt-app MyApp` then `npx belt <cmd>` works
* [x] `npx create-belt-app MyApp --yarn` (bundles with yarn), then `yarn
belt <cmd>` works
* [x] [solution in comment] `yarn create belt-app MyApp` (bundles with
yarn), then `yarn belt <cmd>` works
* This currently results in an error when run with yarn 1.22.19 (I
believe v1 is now deprecated though...) (output below)
* [x] [solution in comment] `bunx create belt-app MyApp`, then `bunx
belt <cmd>` works
* Results in same error as yarn, even references `~/.config/yarn/global`
🤔

<details>
<summary>❌ yarn create belt-app error</summary>

```
success Installed "[email protected]" with binaries:
      - create-belt-app
      - belt


        👖 Belt 👖

Perform project setup and redundant tasks
    without your pants falling down!


/Users/shanson/.config/yarn/global/node_modules/wrap-ansi/index.js:2
const stringWidth = require('string-width');
                    ^

Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/shanson/.config/yarn/global/node_modules/string-width/index.js from /Users/shanson/.config/yarn/global/node_modules/wrap-ansi/index.js not supported.
Instead change the require of /Users/shanson/.config/yarn/global/node_modules/string-width/index.js in /Users/shanson/.config/yarn/global/node_modules/wrap-ansi/index.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/Users/shanson/.config/yarn/global/node_modules/wrap-ansi/index.js:2:21) {
  code: 'ERR_REQUIRE_ESM'
}

Node.js v21.1.0
error Command failed.
Exit code: 1
Command: /Users/shanson/.yarn/bin/create-belt-app
Arguments: NewApp0202-yarn-create
Directory: /Users/shanson/dev
```

</details>

.github/workflows/ci.yml

@@ -1,4 +1,4 @@
-name: thoughtbelt CI
+name: Belt CI
 
 on:
   push:

CONTRIBUTING.md

@@ -24,7 +24,7 @@ yarn dev
 
 ## Test changes locally
 
-In thoughtbelt directory:
+In Belt project directory:
 
 ```bash
 yarn link
@@ -33,11 +33,11 @@ yarn link
 In some other directory:
 
 ```bash
-yarn add thoughtbelt
-yarn link thoughtbelt
+yarn add create-belt-app
+yarn link create-belt-app
 
 # or whatever command
-yarn thoughtbelt NewApp
+yarn belt NewApp
 ```
 
 ## Creating a pull request
@@ -65,11 +65,3 @@ Push to your fork. Write a [good commit message][commit]. Submit a pull request.
 Others will give constructive feedback. This is a time for discussion and
 improvements, and making the necessary changes will be required before we can
 merge the contribution.
-
-## Running the project locally
-
-To run a local version of the codebase locally against a project, follow these steps:
-
-- [in thoughtbelt directory] `yarn link`
-- [in project directory] `yarn link thoughtbelt`
-- Run CLI, eg; `yarn thoughtbelt`

README.md

@@ -14,45 +14,52 @@ Here are some of what gets configured when you start a new Belt app:
 - Custom test "render" function to facilitate testing
 - MSW for mocking
 - Directory structure
-- Tanstack Query (for REST APIs) or Apollo Client (for GraphQL)
+- React Navigation
+- Tanstack Query (for REST APIs) or Apollo Client (for GraphQL) (coming soon!)
 - Redux for global state (coming soon!)
 
 ## Usage
 
-Create a new React Native, Expo app using Belt with:
+Create a new React Native Expo app using Belt with:
 
-```
+```sh
 # With NPM
 npx create-belt-app
 
 # With Yarn
-yarn create belt-app
+npx create-belt-app --yarn
 
 # With pnpm (experimental)
-pnpm create belt-app
+npx create-belt-app --pnpm
 
 # With Bun (experimental)
-bunx create-belt-app
+npx create-belt-app --bun
 ```
 
-Or, if you already have an app and want to configure ESLint, Prettier, TypeScript, React Native Testing Library, etc, run:
+Or, if you already have an app and want to use Belt, run:
 
-```
+```sh
 # with NPM
 npm install --save-dev create-belt-app
 
 # with Yarn
-yarn install --dev create-belt-app
+yarn add --dev create-belt-app
+
+# with PNPM
+pnpm install --save-dev create-belt-app
 ```
 
 then run the command you'd like to perform:
 
-```
+```sh
 # eg. add TypeScript to the project
 yarn belt typescript
 
 # or, with NPM
-npm belt typescript
+npx belt typescript
+
+# or, with PNPM
+pnpm belt typescript
 ```
 
 ## Contributing
@@ -61,14 +68,14 @@ See the [CONTRIBUTING](./CONTRIBUTING.md) document. Thank you, [contributors](ht
 
 ## License
 
-thoughtbelt is Copyright © 2024 thoughtbot. It is free software, and may be
+Belt is Copyright © 2024 thoughtbot. It is free software, and may be
 redistributed under the terms specified in the [LICENSE](/LICENSE) file.
 
 ### About thoughtbot
 
 <img src="https://thoughtbot.com/thoughtbot-logo-for-readmes.svg" width="375" />
 
-thoughtbelt is maintained and funded by thoughtbot, inc.
+Belt is maintained and funded by thoughtbot, inc.
 The names and logos for thoughtbot are trademarks of thoughtbot, inc.
 
 We love open source software! See [our other projects][community] or

package.json

@@ -1,13 +1,13 @@
 {
-  "name": "thoughtbelt",
+  "name": "create-belt-app",
   "author": "thoughtbot, Inc.",
   "license": "MIT",
-  "version": "0.1.9",
-  "description": "React Native project starter and generator CLI",
+  "version": "0.2.1",
+  "description": "React Native Expo project starter and generator CLI",
   "type": "module",
   "exports": "./dist/index.js",
   "bin": {
-    "thoughtbelt": "./dist/index.js",
+    "create-belt-app": "./dist/index.js",
     "belt": "./dist/index.js"
   },
   "files": [

src/cli.ts

@@ -4,7 +4,7 @@ import printWelcome from './util/print/printWelcome';
 
 export default function runCli() {
   program
-    .name('thoughtbelt')
+    .name('Belt')
     .description(
       'Perform React Native and Expo setup and redundant tasks without your pants falling down!',
     )

src/commands/createApp.ts

@@ -1,5 +1,6 @@
 import { confirm, input } from '@inquirer/prompts';
 import chalk from 'chalk';
+import fs from 'fs-extra';
 import ora from 'ora';
 import { globals } from '../constants';
 import addDependency from '../util/addDependency';
@@ -35,9 +36,10 @@ export async function createApp(name: string | undefined, options: Options) {
   globals.isCreateApp = true;
 
   const appName = name || (await getAppName());
-  await printIntro();
 
-  const spinner = ora('Creating new app with create-expo-app').start();
+  await ensureDirectoryDoesNotExist(appName);
+  await printIntro();
+  const spinner = ora('Creating new app with create-expo').start();
   await createExpoApp(appName, options);
   spinner.succeed('Created new app with Expo');
 
@@ -55,7 +57,7 @@ export async function createApp(name: string | undefined, options: Options) {
     'npx expo install @react-native-async-storage/async-storage react-native-safe-area-context',
   );
   await addDependency('react-native-keyboard-aware-scrollview');
-  await addDependency('thoughtbelt', { dev: true });
+  await addDependency('create-belt-app', { dev: true });
   await commit('Add dependencies');
   spinner.succeed('Added dependencies');
 
@@ -69,7 +71,7 @@ export async function createApp(name: string | undefined, options: Options) {
   await addEslint();
   await commit('Add and configure ESLint');
 
-  await exec('yarn fix:prettier');
+  await exec('npm run fix:prettier');
   await commit('Run Prettier on project');
 
   await addDependency('npm-run-all', { dev: true });
@@ -96,7 +98,7 @@ export async function createApp(name: string | undefined, options: Options) {
   print(`
 Your pants are now secure! Each tool was configured as an individual commit.
 Take a look at the commits to understand what all was done. For more information
-about thoughtbelt, visit https://github.com/thoughtbot/thoughtbelt.
+about Belt, visit https://github.com/thoughtbot/belt.
 `);
 }
 
@@ -153,7 +155,7 @@ async function commit(message: string) {
 }
 // Installs Expo using the specified package manager, or if no package manager
 // option specified, try to determine based on which packager is running
-// thoughtbelt eg. `npx thoughtbelt` vs. `bunx thoughtbelt`
+// create-belt-app eg. `npx create-belt-app` vs. `bunx create-belt-app`
 async function createExpoApp(appName: string, options: Options) {
   const mgr = options.bun
     ? 'bun'
@@ -179,3 +181,14 @@ async function createExpoApp(appName: string, options: Options) {
   const fullCommand = `${command} ${appName}`;
   await exec(fullCommand);
 }
+
+async function ensureDirectoryDoesNotExist(appName: string) {
+  if (await fs.exists(appName)) {
+    print(
+      chalk.yellow(
+        `Whoopsy. The directory ${process.cwd()}/${appName} already exists. Please choose a different name or delete the existing directory.\n`,
+      ),
+    );
+    process.exit(0);
+  }
+}

src/util/print/printWelcome.ts

@@ -2,7 +2,7 @@ import chalk from 'chalk';
 import print from '../print';
 
 export default function printWelcome() {
-  print(chalk.bold('\n\n\t👖 thoughtbelt 👖\n'));
+  print(chalk.bold('\n\n\t👖 Belt 👖\n'));
   print(
     'Perform project setup and redundant tasks\n    without your pants falling down!\n\n',
   );