Linting (#241)

* add rubocop

* use ruby-setup

* try

* add platform

* move gemfile to base

* start lint

* save

* move

* fix

* adding lint-staged running prettier --write

* save

* use precommit

* use pre-commit

* fix

* fix jest config

* fix lint-staged

* ignore vendored gems

* try this

* code-review

.changeset/config.json

@@ -8,4 +8,4 @@
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
   "ignore": []
-}
+}

.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+**/dist/**

.eslintrc.json

@@ -1,5 +1,65 @@
 {
+  "root": true,
+  "parser": "@babel/eslint-parser",
+  "plugins": ["react", "react-hooks"],
+  "extends": "next/core-web-vitals",
+  "env": {
+    "browser": true,
+    "commonjs": true,
+    "es6": true,
+    "node": true
+  },
+  "globals": {
+    "prisma": true
+  },
+  "parserOptions": {
+    "requireConfigFile": false,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "babelOptions": {
+      "presets": ["next/babel"],
+      "caller": {
+        // Eslint supports top level await when a parser for it is included. We enable the parser by default for Babel.
+        "supportsTopLevelAwait": true
+      }
+    }
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "overrides": [
+    {
+      "files": ["**/*.ts", "**/*.tsx"],
+      "parser": "@typescript-eslint/parser",
+      "plugins": ["@typescript-eslint"],
+      "extends": [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended"
+      ],
+      "rules": {
+        "no-unused-vars": "off",
+        "@typescript-eslint/no-explicit-any": "off",
+        "@typescript-eslint/no-unused-vars": [
+          "error",
+          {
+            "argsIgnorePattern": "^_",
+            "varsIgnorePattern": "^_",
+            "caughtErrorsIgnorePattern": "^_"
+          }
+        ],
+        "@typescript-eslint/no-empty-function": [
+          "error",
+          { "allow": ["arrowFunctions"] }
+        ]
+      }
+    }
+  ],
   "rules": {
-    "semi": "off"
+    "semi": "off",
+    "@next/next/google-font-display": "off"
   }
 }

.github/workflows/eslint.yml

@@ -0,0 +1,17 @@
+name: Eslint
+on:
+  push:
+jobs:
+  eslint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Use Node.js 18
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: "yarn"
+      - name: Install dependencies
+        run: yarn
+      - name: Lint
+        run: yarn lint

.github/workflows/jest.yml

@@ -1,4 +1,4 @@
-# This workflow will do a clean installation of node dependencies, cache/restore them, 
+# This workflow will do a clean installation of node dependencies, cache/restore them,
 # build the source code and run tests across different versions of node.
 # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
 
@@ -17,7 +17,7 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node-version }}
-          cache: 'yarn'
+          cache: "yarn"
       - name: Install dependencies
         run: yarn
       - name: Build the app
@@ -26,4 +26,3 @@ jobs:
         run: yarn ci:test
       - name: Run CI Next.js tests
         run: yarn ci:test:next
-

.github/workflows/rubocop.yml

@@ -0,0 +1,14 @@
+name: Rubocop
+on:
+  push:
+jobs:
+  rubocop:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: ruby/setup-ruby@v1
+        with:
+          ruby-version: 3.1.2
+          bundler-cache: true
+      - name: Run rubocop
+        run: bundle exec rubocop

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn lint-staged

.lintstagedrc

@@ -0,0 +1,4 @@
+{
+  "*.{js,jsx,ts,tsx}": "eslint --fix",
+  "*.rb": "rubocop --autocorrect"
+}

.rubocop.yml

@@ -0,0 +1,19 @@
+AllCops:
+  NewCops: enable
+  Exclude:
+    - 'vendor/**/*'
+    - '**/vendor/**/*'
+    - 'node_modules/**/*'
+    - '**/node_modules/**/*'
+
+Metrics/AbcSize:
+  Max: 50
+
+Metrics/MethodLength:
+  Max: 50
+
+Metrics/ClassLength:
+  Max: 200
+
+Style/Documentation:
+  Enabled: false

Gemfile

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+source 'https://rubygems.org'
+
+group :development, :test do
+  gem 'pry', '0.14.1'
+  gem 'rubocop', '1.36'
+end

Gemfile.lock

@@ -0,0 +1,42 @@
+GEM
+  remote: https://rubygems.org/
+  specs:
+    ast (2.4.2)
+    coderay (1.1.3)
+    json (2.6.2)
+    method_source (1.0.0)
+    parallel (1.22.1)
+    parser (3.1.2.1)
+      ast (~> 2.4.1)
+    pry (0.14.1)
+      coderay (~> 1.1)
+      method_source (~> 1.0)
+    rainbow (3.1.1)
+    regexp_parser (2.6.0)
+    rexml (3.2.5)
+    rubocop (1.36.0)
+      json (~> 2.3)
+      parallel (~> 1.10)
+      parser (>= 3.1.2.1)
+      rainbow (>= 2.2.2, < 4.0)
+      regexp_parser (>= 1.8, < 3.0)
+      rexml (>= 3.2.5, < 4.0)
+      rubocop-ast (>= 1.20.1, < 2.0)
+      ruby-progressbar (~> 1.7)
+      unicode-display_width (>= 1.4.0, < 3.0)
+    rubocop-ast (1.21.0)
+      parser (>= 3.1.1.0)
+    ruby-progressbar (1.11.0)
+    unicode-display_width (2.3.0)
+
+PLATFORMS
+  arm64-darwin-21
+  x86_64-darwin-21
+  x86_64-linux
+
+DEPENDENCIES
+  pry (= 0.14.1)
+  rubocop (= 1.36)
+
+BUNDLED WITH
+   2.3.7

docs/CONTRIBUTING.md

@@ -44,12 +44,15 @@ For development, you may want to have a demo next app that pulls in your changes
 - cd into packages/cli and run `yarn cypress run`
 
 ### Run embedded jest tests for the preview server
-During the smoke test process described below, the jest tests in `scripts/e2e_test/jest_tests` are copied into the directory where each target framework is installed and run.  Before testing them in the framework install context, however, you will want to make sure they pass on the latest build by running `yarn build` and then `yarn e2e:jest` in the mailing project root.
+
+During the smoke test process described below, the jest tests in `scripts/e2e_test/jest_tests` are copied into the directory where each target framework is installed and run. Before testing them in the framework install context, however, you will want to make sure they pass on the latest build by running `yarn build` and then `yarn e2e:jest` in the mailing project root.
 
 ## Smoke tests
-The directory `scripts/e2e_test` contains smoke tests targeting supported frameworks that should be run before every public npm release. Each test uses the `yarn create` command to create new projects from their `create-*` starter kits and then runs the cypress cli tests contained in `packages/cli/cypress` and the jest tests contained in `scripts/e2e_test/jest_tests`. 
+
+The directory `scripts/e2e_test` contains smoke tests targeting supported frameworks that should be run before every public npm release. Each test uses the `yarn create` command to create new projects from their `create-*` starter kits and then runs the cypress cli tests contained in `packages/cli/cypress` and the jest tests contained in `scripts/e2e_test/jest_tests`.
 
 The frameworks currently covered by the tests are:
+
 - standalone (no framework)
 - turbo (Turbo monorepo)
 - next_ts (Next.js with Typescript)
@@ -78,4 +81,4 @@ The script supports some options for running:
 
 **Cache the framework installs for faster runs**
 
-- Use the `--save-cache` flag to save each framework install (before mailing is added) to the `cache` directory. Subsequent test runs will use the cache instead of running `yarn create` and `yarn install`, which will speed things up 🏎  If you need to reset the cache, e.g. if you want to test a newer version of the framework or if the framework install process changes, you can delete the cache directory or the subdirectory containing the specific framework you are targeting.
+- Use the `--save-cache` flag to save each framework install (before mailing is added) to the `cache` directory. Subsequent test runs will use the cache instead of running `yarn create` and `yarn install`, which will speed things up 🏎 If you need to reset the cache, e.g. if you want to test a newer version of the framework or if the framework install process changes, you can delete the cache directory or the subdirectory containing the specific framework you are targeting.

docs/DEPLOY.md

@@ -15,11 +15,10 @@ Here’s a working Vercel configuration:
 
 <img width="793" alt="Screen Shot 2022-09-26 at 11 57 06 AM" src="https://user-images.githubusercontent.com/282016/192357879-a19ec556-00c3-49b6-883c-6ae55e8eff7f.png">
 
-
 #### CLI
 
 Alternatively, `mailing deploy` deploys your server to Vercel via their interactive CLI.
 
 ### Other hosts
 
-If you want to deploy somewhere else, you can use `mailing server build` to build the production next app and `mailing server start` to boot it on localhost. The first command runs `next build .mailing` and the second command runs `next start .mailing`. 
+If you want to deploy somewhere else, you can use `mailing server build` to build the production next app and `mailing server start` to boot it on localhost. The first command runs `next build .mailing` and the second command runs `next start .mailing`.

jest.next.config.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 import type { Config } from "jest";
 
 const nextJest = require("next/jest");

package.json

@@ -1,9 +1,15 @@
 {
   "name": "mailing-monorepo",
+  "homepage": "https://github.com/sofn-xyz/mailing#readme",
   "version": "0.1.0",
   "private": true,
   "type": "module",
+  "license": "MIT",
+  "workspaces": [
+    "packages/*"
+  ],
   "scripts": {
+    "lint": "eslint .",
     "dev": "cd packages/cli && rm -rf .mailing && src/dev.js",
     "dev:js": "yarn link:emails:js && yarn dev",
     "dev:init": "cd packages/cli && rm -rf previews_html; rm -rf .mailing emails mailing.config.json; src/dev.js",
@@ -18,18 +24,16 @@
     "ci:test:next": "start-server-and-test ci:server http://localhost:3883 test:next",
     "ci:server": "cd packages/cli && rm -rf .mailing && src/dev.js --quiet",
     "prepublish": "yarn build",
+    "postinstall": "husky install && preconstruct dev",
     "watch": "preconstruct watch",
     "release": "yarn build && ./scripts/prepare-release && yarn changeset publish",
-    "postinstall": "preconstruct dev",
     "e2e": "cd scripts/e2e_test/ && bundle && bundle exec ruby e2e_test.rb",
     "e2e:jest": "yarn jest --rootDir=scripts/e2e_test/jest_tests -c scripts/e2e_test/jest_tests/jest.config.js"
   },
-  "license": "MIT",
-  "workspaces": [
-    "packages/*"
-  ],
-  "homepage": "https://github.com/sofn-xyz/mailing#readme",
   "devDependencies": {
+    "@babel/core": "^7.18.5",
+    "@babel/eslint-parser": "^7.19.1",
+    "@babel/preset-env": "^7.18.2",
     "@babel/preset-react": "^7.17.12",
     "@babel/preset-typescript": "^7.17.12",
     "@changesets/cli": "^2.23.0",
@@ -39,25 +43,27 @@
     "@types/jest": "^28.1.6",
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
+    "@typescript-eslint/parser": "^5.39.0",
+    "@typescript-eslint/eslint-plugin": "^5.39.0",
+    "eslint": "8.20.0",
+    "husky": "^8.0.1",
     "jest": "^29.0.3",
     "jest-environment-jsdom": "^29.0.3",
+    "lint-staged": "^13.0.3",
     "next-router-mock": "^0.7.4",
     "prettier": "^2.7.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "start-server-and-test": "^1.14.0",
     "ts-jest": "29",
-    "ts-node": "^10.9.1"
+    "ts-node": "^10.9.1",
+    "yalc": "^1.0.0-pre.53"
   },
   "preconstruct": {
     "packages": [
       "packages/cli",
       "packages/core"
     ]
   },
-  "dependencies": {
-    "@babel/core": "^7.18.5",
-    "@babel/preset-env": "^7.18.2",
-    "start-server-and-test": "^1.14.0",
-    "yalc": "^1.0.0-pre.53"
-  }
+  "dependencies": {}
 }

packages/cli/README.md

@@ -5,7 +5,6 @@
 [![Featured on Openbase](https://badges.openbase.com/js/featured/mailing.svg?token=A6xfdFmUU161m5Jns1Aqf4SwwIMSQBipWCm7HCdl1wc=)](https://openbase.com/js/mailing?utm_source=embedded&utm_medium=badge&utm_campaign=rate-badge)
 [![](https://dcbadge.vercel.app/api/server/fdSzmY46wY?style=flat)](https://discord.gg/fdSzmY46wY)
 
-
 <h2>●&nbsp;&nbsp;Build, test, send emails with React</h2>
 
 - Email templates with React components

packages/cli/cypress.config.ts

@@ -4,7 +4,7 @@ export default defineConfig({
   e2e: {
     defaultCommandTimeout: 10000,
     baseUrl: "http://localhost:3883",
-    setupNodeEvents(on, config) {
+    setupNodeEvents(_on, _config) {
       // implement node event listeners here
     },
   },

packages/cli/cypress/support/commands.ts

@@ -34,4 +34,4 @@
 //       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
 //     }
 //   }
-// }
+// }

packages/cli/cypress/support/e2e.ts

@@ -14,7 +14,7 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import "./commands";
 
 // Alternatively you can use CommonJS syntax:
-// require('./commands')
+// require('./commands')

packages/cli/cypress/tsconfig.json

@@ -6,4 +6,3 @@
   },
   "include": ["**/*.ts"]
 }
-

packages/cli/src/commands/__test__/deploy.test.ts

@@ -1,7 +1,3 @@
-import prompts from "prompts";
-import fsExtra, { removeSync } from "fs-extra";
-import { handler, InitArguments } from "../init";
-import { log } from "../../util/log";
 import { execCli } from "./execCli";
 
 jest.mock("../../util/log");

packages/cli/src/commands/__test__/execCli.ts

@@ -29,6 +29,6 @@ export async function execCli(command: string, opts?: { debug: boolean }) {
   });
 }
 
-export function execCliChild(command: string, opts?: { debug: boolean }) {
+export function execCliChild(command: string, _opts?: { debug: boolean }) {
   return exec(`FORCE_COLOR=0 ${__dirname}/../../dev.js ${command}`);
 }