chore: remove create react app template (#3440)

* chore: remove cra template and move nextjs template to templates

* chore: tsconfig prettier

.codesandbox/ci.json

@@ -110,7 +110,7 @@
     "/packages/paste-core/components/visual-picker"
   ],
   "sandboxes": [
-    "/packages/paste-nextjs-template",
+    "/templates/paste-nextjs-template",
     "/packages/paste-token-contrast-checker"
   ]
 }

.danger/changesets-that-need-core-check.ts

@@ -11,7 +11,6 @@ const IGNORE_LIST = [
   '@twilio-paste/icons',
   '@twilio-paste/website',
   '@twilio-paste/codemods',
-  '@twilio-paste/cra-template',
   '@twilio-paste/nextjs-template',
   '@twilio-paste/theme-designer',
   '@twilio-paste/color-contrast-utils',

.danger/utils.ts

@@ -92,7 +92,6 @@ export const getChangesetsFromFiles = (fileList: string[]) =>
 
 export const IGNORE_LIST = [
   'paste-website',
-  'paste-cra-template',
   'paste-nextjs-template',
   'paste-theme-designer',
   'paste-color-contrast-utils',

.eslintrc.repo.js

@@ -14,8 +14,7 @@ module.exports = {
     'packages/paste-theme-designer',
     'packages/paste-token-contrast-checker',
     'packages/paste-website',
-    'packages/paste-nextjs-template',
-    'packages/paste-cra-template',
+    'templates/paste-nextjs-template',
     'apps/vs-code-intellisense',
     'cypress',
   ],

README.md

@@ -17,7 +17,6 @@ For usage guidelines, please see our [documentation website](https://paste.twili
 Clone the repo then run the following commands from within the repo's folder:
 
 ```
-yarn # bootstraps the repo and downloads packages
 yarn build # builds all of Paste
 ```
 

internal-docs/engineering/developing-locally.md

@@ -226,83 +226,77 @@ For example, our Button depends on our Box package. Box depends on Theme, and Th
 
 We use [Nx](https://nx.dev/) and [Yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces/) to link all the internal dependencies together whilst working locally.
 
-All packages and projects that rely on the latest version of components, live under the packages directory.
+All packages and projects that rely on the latest version of components, live under the packages, apps, and templates directory.
 
 <table>
   <tr>
-   <td>paste-core
+   <td>packages/paste-core
    </td>
    <td>All React components, split into layout, primitives, and components
    </td>
   </tr>
   <tr>
-   <td>paste-codemods
+   <td>packages/paste-codemods
    </td>
    <td><a href="https://github.com/facebook/codemod">Codemods</a> that allow the Paste team to write scripts that can be run on a consuming code base, that automatically make code changes.
    </td>
   </tr>
   <tr>
-   <td>paste-cra-template
-   </td>
-   <td>A create-react-app template to get started with Paste
-   </td>
-  </tr>
-  <tr>
-   <td>paste-customization
+   <td>packages/paste-customization
    </td>
    <td>Customization provider will allow customers to change the look and feel of their Paste apps
    </td>
   </tr>
   <tr>
-   <td>paste-design-tokens
+   <td>packages/paste-design-tokens
    </td>
    <td>Paste Design Language
    </td>
   </tr>
   <tr>
-   <td>paste-icons
+   <td>packages/paste-icons
    </td>
    <td>Paste icons
    </td>
   </tr>
   <tr>
-   <td>paste-libraries
+   <td>packages/paste-libraries
    </td>
    <td>Third party libraries that Paste uses
    </td>
   </tr>
   <tr>
-   <td>paste-nextjs-template
+   <td>templates/paste-nextjs-template
    </td>
    <td>A create-next-app template to get started with Paste
    </td>
   </tr>
   <tr>
-   <td>paste-style-props
+   <td>packages/paste-style-props
    </td>
    <td>Paste style props
    </td>
   </tr>
   <tr>
-   <td>paste-theme
+   <td>packages/paste-theme
    </td>
    <td>Paste theme provider and default themes
    </td>
   </tr>
   <tr>
-   <td>paste-theme-designer
+   <td>packages/paste-theme-designer
    </td>
    <td>A web app to help Paste consumers design a custom theme
    </td>
   </tr>
   <tr>
-   <td>paste-types
+   <td>packages/paste-types
    </td>
    <td>Typescript types for the Paste project
    </td>
   </tr>
   <tr>
-   <td>paste-website
+   <td>packages/paste-website
    </td>
    <td>Paste documentation site
    </td>

jest.config.js

@@ -10,9 +10,9 @@ module.exports = {
     '<rootDir>/packages/(?:.+?)/dist/',
     '<rootDir>/packages/(?:.+?)/.cache/',
     '<rootDir>/cypress/',
-    '<rootDir>/packages/paste-cra-template/',
     '<rootDir>/apps/',
     '<rootDir>/packages/(?:.+?)/.next/',
+    '<rootDir>/templates/(?:.+?)/.next/',
     '<rootDir>/packages/(?:.+?)/.netlify/',
   ],
   cacheDirectory: '.jest-cache',

lerna.json

@@ -1,5 +1,5 @@
 {
-  "packages": ["packages/**"],
+  "packages": ["packages/**", "templates/**"],
   "version": "independent",
   "npmClient": "yarn",
   "command": {

package.json

@@ -9,6 +9,7 @@
     "packages": [
       "apps/**/*",
       "packages/**/*",
+      "templates/**/*",
       "!packages/paste-core/core-bundle/**/*"
     ]
   },
@@ -61,14 +62,14 @@
     "start:test:storybook": "start-server-and-test 'NODE_ENV=test yarn start:storybook' http://localhost:9001 'yarn test:storybook'",
     "serve:website": "yarn workspace @twilio-paste/website start",
     "package-size-action-build": "yarn build",
-    "prettier": "prettier --list-different '{.storybook,packages}/**/*.{ts,tsx}'",
-    "prettier-clean": "prettier --write '{.storybook,packages}/**/*.{ts,tsx}'",
+    "prettier": "prettier --list-different '{.storybook,packages,templates}/**/*.{ts,tsx}'",
+    "prettier-clean": "prettier --write '{.storybook,packages,templates}/**/*.{ts,tsx}'",
     "lint": "yarn pre-test && yarn lint:repo && yarn lint:core && yarn lint:website && yarn lint:remix && yarn lint:contrast-checker && yarn lint:nextjs-template && yarn lint:vscode-intellisense",
     "lint:core": "eslint -c .eslintrc.core.js --ext .tsx,.ts ./packages/{paste-color-contrast-utils,paste-core,paste-customization,paste-design-tokens,paste-icons,paste-libraries,paste-style-props,paste-theme,paste-types,paste-utils}/**/src",
     "lint:website": "eslint -c ./packages/paste-website/.eslintrc --ext .tsx,.ts ./packages/paste-website",
     "lint:remix": "eslint -c ./packages/paste-theme-designer/.eslintrc.json --ext .tsx,.ts ./packages/paste-theme-designer",
     "lint:contrast-checker": "eslint -c ./packages/paste-token-contrast-checker/.eslintrc.json --ext .tsx,.ts ./packages/paste-token-contrast-checker",
-    "lint:nextjs-template": "eslint -c ./packages/paste-nextjs-template/.eslintrc.json --ext .tsx,.ts ./packages/paste-nextjs-template",
+    "lint:nextjs-template": "eslint -c ./templates/paste-nextjs-template/.eslintrc.json --ext .tsx,.ts ./templates/paste-nextjs-template",
     "lint:vscode-intellisense": "eslint -c ./apps/vs-code-intellisense/.eslintrc.json --ext .tsx,.ts ./apps/vs-code-intellisense",
     "lint:repo": "eslint -c .eslintrc.repo.js --ext .tsx,.ts .",
     "type-check": "yarn nx run-many --target=tsc",

packages/paste-core/core-bundle/tools/constants.ts

@@ -6,19 +6,13 @@ import type {PackageShape} from './types';
  * Adding the website package for redundancy only, because
  * it's a private package and won't be included anyways
  */
-const BLOCKLIST = [
-  '@twilio-paste/core',
-  '@twilio-paste/icons',
-  '@twilio-paste/website',
-  '@twilio-paste/codemods',
-  '@twilio-paste/cra-template',
-];
+const BLOCKLIST = ['@twilio-paste/core', '@twilio-paste/icons', '@twilio-paste/website', '@twilio-paste/codemods'];
 
 const BASE_CODESANDBOX_CI = {
   buildCommand: 'build',
   node: '16',
   packages: ['/packages/paste-icons', '/packages/paste-core/core-bundle'],
-  sandboxes: ['/packages/paste-nextjs-template', '/packages/paste-token-contrast-checker'],
+  sandboxes: ['/templates/paste-nextjs-template', '/packages/paste-token-contrast-checker'],
 };
 
 const PACKAGES_ROOT_PATH = join(__dirname, '../../../..');