Upgrade and simplify

Author: samerbuna

.eslintrc.js

@@ -7,10 +7,18 @@ module.exports = {
     node: true,
     jest: true,
   },
-  extends: ['eslint:recommended', 'plugin:react/recommended'],
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  settings: {
+    react: {
+      version: 'detect',
+    },
+  },
   parserOptions: {
     ecmaFeatures: {
-      experimentalObjectRestSpread: true,
       jsx: true,
     },
     sourceType: 'module',
@@ -19,23 +27,16 @@ module.exports = {
   rules: {
     'react/prop-types': ['off'],
     'react/no-unescaped-entities': ['error', { forbid: ['>', '}'] }],
-    'react-hooks/rules-of-hooks': 'error',
-    indent: ['error', 2, { SwitchCase: 1 }],
-    'comma-dangle': ['error', 'always-multiline'],
-    'linebreak-style': ['error', 'unix'],
-    quotes: ['error', 'single'],
-    semi: ['error', 'always'],
     'no-console': ['warn', { allow: ['info', 'error'] }],
-    curly: 'error',
+    'curly': 'error',
     'no-else-return': 'error',
     'no-unneeded-ternary': 'error',
     'no-useless-return': 'error',
     'no-var': 'error',
     'one-var': ['error', 'never'],
-    'prefer-arrow-callback': 'error',
     'prefer-const': 'error',
-    strict: 'error',
+    'strict': 'error',
     'symbol-description': 'error',
-    yoda: ['error', 'never', { exceptRange: true }],
+    'yoda': ['error', 'never', { exceptRange: true }],
   },
 };

lerna.json

@@ -1,5 +1,5 @@
 {
   "lerna": "3.15.0",
   "packages": ["packages/*"],
-  "version": "2.0.6"
+  "version": "2.1.0"
 }

package.json

@@ -2,11 +2,11 @@
   "private": true,
   "license": "MIT",
   "devDependencies": {
-    "babel-eslint": "10.0.2",
-    "eslint": "^6.0.1",
-    "eslint-plugin-react": "^7.14.2",
-    "eslint-plugin-react-hooks": "^1.6.1",
-    "lerna": "^3.15.0",
-    "prettier": "^1.18.2"
+    "babel-eslint": "10.1.0",
+    "eslint": "^6.8.0",
+    "eslint-plugin-react": "^7.19.0",
+    "eslint-plugin-react-hooks": "^3.0.0",
+    "lerna": "^3.20.2",
+    "prettier": "^2.0.4"
   }
 }

packages/reactful/README.md

@@ -20,9 +20,6 @@ cd my-awesome-react-app
 # To start the app for development (watchers for node/webpack)
 npm start
 
-# To open the app in browser (default is localhost:4242)
-npx reactful open
-
 # To run all tests
 npm test
 

packages/reactful/bin/reactful.js

@@ -52,10 +52,7 @@ async function main() {
 
   if (firstArg === 'new') {
     config.appPath = otherArgs[0];
-    config.appName = otherArgs[0]
-      .replace(/\/$/, '')
-      .split('/')
-      .slice(-1)[0];
+    config.appName = otherArgs[0].replace(/\/$/, '').split('/').slice(-1)[0];
   }
 
   if (!['init', 'new'].includes(firstArg)) {
@@ -64,10 +61,7 @@ async function main() {
     }
 
     config.appPath = firstArg;
-    config.appName = firstArg
-      .replace(/\/$/, '')
-      .split('/')
-      .slice(-1)[0];
+    config.appName = firstArg.replace(/\/$/, '').split('/').slice(-1)[0];
   }
 
   reactfulCreate();

packages/reactful/lib/commandExists.js

@@ -8,11 +8,11 @@ module.exports = function commandExists(command) {
       shell: true,
     });
 
-    child.on('close', code => {
+    child.on('close', (code) => {
       resolve(code === 0);
     });
 
-    child.on('error', err => {
+    child.on('error', (err) => {
       reject(err);
     });
   });

packages/reactful/lib/commands/text.js

@@ -1,54 +1,52 @@
 /* eslint indent: 'off' */
 
-exports.rcc = componentName => `import React from 'react';
+exports.rcc = (componentName) => `import * as React from 'react';
 
-export class ${componentName} extends React.Component {
+export default class ${componentName} extends React.Component {
   render() {
     return (
       <div>
-        {${componentName}}...
+        ${componentName}...
       </div>
     );
   }
 }`;
 
-exports.rpc = componentName => `import React from 'react';
+exports.rpc = (componentName) => `import * as React from 'react';
 
-export class ${componentName} extends React.PureComponent {
+export default class ${componentName} extends React.PureComponent {
   render() {
     return (
       <div>
-        {${componentName}}...
+        ${componentName}...
       </div>
     );
   }
 }`;
 
-exports.rfc = componentName => `import React from 'react';
+exports.rfc = (componentName) => `import * as React from 'react';
 
-export function ${componentName}({}) {
+export default function ${componentName}() {
   return (
     <div>
-      {${componentName}}...
+      ${componentName}...
     </div>
   );
 }`;
 
 exports.jest = {};
 
-exports.jest.default = componentName => `import React from 'react';
-import renderer from 'react-test-renderer';
+exports.jest.default = (componentName) => `import * as React from 'react';
+import { render, cleanup } from '@testing-library/react';
 
 import ${componentName} from './${componentName}';
 
-describe('${componentName}', () => {
+afterEach(cleanup);
 
-  it('renders correctly', () => {
-    const tree = renderer.create(
-      <${componentName} />
-    ).toJSON();
+describe('${componentName}', () => {
+  it('renders', () => {
+    const { asFragment } = render(<${componentName} />);
 
-    expect(tree).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
-
 });`;

packages/reactful/lib/dependencies.json

@@ -15,12 +15,10 @@
     "express@4",
     "mini-css-extract-plugin",
     "morgan",
-    "node-sass",
     "pm2",
     "react@16",
     "react-dom@16",
     "regenerator-runtime",
-    "sass-loader",
     "serialize-javascript",
     "style-loader",
     "webpack@4",
@@ -29,16 +27,16 @@
   ],
   "dev": [
     "@babel/node",
-    "babel-core@^7.0.0-bridge.0",
     "babel-jest",
     "babel-eslint",
     "concurrently",
-    "enzyme",
-    "enzyme-adapter-react-16",
     "eslint",
     "eslint-plugin-react",
     "eslint-plugin-react-hooks",
     "jest",
+    "@testing-library/react",
+    "@testing-library/jest-dom",
+    "@testing-library/user-event",
     "nodemon",
     "reactful"
   ]

packages/reactful/lib/init.js

@@ -11,24 +11,24 @@ module.exports = function reactfulInit(config) {
       version: '1.0.0',
       private: true,
       scripts: {
-        eslint: 'eslint "src/**/*.js"',
-        start: `concurrently "${pmCommand} run dev-server" "${pmCommand} run dev-bundle"`,
-        test: 'jest',
+        'eslint': 'eslint "src/**/*.js"',
+        'start': `concurrently "${pmCommand} run dev:server" "${pmCommand} run dev:bundle"`,
+        'test': 'jest',
 
-        'dev-server':
+        'dev:server':
           'cross-env NODE_PATH=./src nodemon --exec "babel-node src/server/server.js" --ignore .reactful.json --ignore public/',
-        'dev-bundle': 'webpack -wd',
+        'dev:bundle': 'webpack -wd',
         'verify-tests': 'jest --coverage',
 
-        'build-react': 'cross-env NODE_ENV=production webpack --progress -p',
-        'build-node':
+        'build:react': 'cross-env NODE_ENV=production webpack --progress -p',
+        'build:node':
           'babel src -d build --config-file ./babel-node.config.js --copy-files',
-        'build-all': `${pmCommand} install && ${pmCommand} run build-react && ${pmCommand} run build-node`,
+        'build:all': `${pmCommand} install && ${pmCommand} run build:react && ${pmCommand} run build:node`,
 
-        'prod-start': `cross-env NODE_ENV=production NODE_PATH=./build pm2 start -i max build/server/server.js --update-env --name ${appName}Prod`,
-        'prod-stop': `pm2 stop ${appName}Prod`,
-        'prod-reload': `pm2 reload --update-env ${appName}Prod`,
-        'prod-logs': `pm2 logs --update-env ${appName}Prod`,
+        'prod:start': `cross-env NODE_ENV=production NODE_PATH=./build pm2 start -i max build/server/server.js --update-env --name ${appName}Prod`,
+        'prod:stop': `pm2 stop ${appName}Prod`,
+        'prod:reload': `pm2 reload --update-env ${appName}Prod`,
+        'prod:logs': `pm2 logs --update-env ${appName}Prod`,
       },
       jest: {
         modulePaths: ['./src'],

packages/reactful/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactful",
-  "version": "2.0.6",
+  "version": "2.1.0",
   "description": "An opinionated CLI for full-stack server-rendered React applications",
   "repository": "jscomplete/reactful",
   "author": "Samer Buna <[email protected]>",
@@ -9,7 +9,7 @@
     "reactful": "bin/reactful.js"
   },
   "dependencies": {
-    "fs-jetpack": "^2.2.2",
-    "prompt-sync": "^4.1.6"
+    "fs-jetpack": "^2.2.3",
+    "prompt-sync": "^4.2.0"
   }
 }