Add ESLint Curly Rule

.eslintrc.js

@@ -1,4 +1,5 @@
 module.exports = {
+  root: true,
   env: {
     commonjs: true,
     browser: true,
@@ -46,6 +47,7 @@ module.exports = {
     "@typescript-eslint/type-annotation-spacing": "error",
     "@typescript-eslint/no-unused-vars": "error",
     "@typescript-eslint/ban-ts-ignore": "off",
+    "curly": ["error", "all"],
     "eqeqeq": ["error", "smart"],
     "default-case": "off",
     "no-caller": "error",
@@ -61,13 +63,11 @@ module.exports = {
     "no-unused-expressions": "error",
     "radix": ["error", "as-needed"],
     "no-restricted-syntax": [
-      "error",
-      {
+      "error", {
         "selector": "CallExpression[callee.name!='parseInt'] > Identifier[name='parseInt']",
         "message": "Call parseInt directly to guarantee radix param is not incorrectly provided"
       },
-      "error",
-      {
+      "error", {
         "selector": "CallExpression[callee.name!='parseFloat'] > Identifier[name='parseFloat']",
         "message": "Call parseFloat directly to guarantee radix param is not incorrectly provided"
       }

examples/react/.eslintrc.js

@@ -4,11 +4,11 @@ module.exports = {
   },
 
   extends: [
-    "../.eslintrc.js",
+    "../../.eslintrc.js",
   ],
 
   rules: {
-    "prettier/prettier": [ "error", require("./../prettier.config") ],
+    "prettier/prettier": ["error", require("../../prettier.config")],
     "no-console": "off",
   }
 }

examples/react/package.json

@@ -14,6 +14,7 @@
     "@babel/core": "^7.14.0",
     "@babel/preset-env": "^7.16.4",
     "@babel/preset-react": "^7.13.13",
+    "@types/big.js": "^6.1.3",
     "nodemon": "^2.0.7",
     "parcel-bundler": "^1.12.5",
     "sass": "^1.44.0",
@@ -28,7 +29,7 @@
     "regenerator-runtime": "^0.13.9"
   },
   "resolutions": {
-     "@babel/preset-env": "7.13.8"
+    "@babel/preset-env": "7.13.8"
   },
   "browserslist": {
     "production": [

examples/react/src/App.tsx

@@ -1,10 +1,5 @@
 import "regenerator-runtime/runtime";
-import React, {
-  useState,
-  useEffect,
-  Fragment,
-  useRef
-} from "react";
+import React, { useState, useEffect, Fragment, useRef } from "react";
 import NearWalletSelector from "near-wallet-selector";
 
 import getConfig from "./config";
@@ -35,11 +30,10 @@ const App: React.FC = () => {
       },
     });
 
-    nearWalletSelector.init()
-      .then(() => {
-        selectorRef.current = nearWalletSelector;
-        setLoaded(true);
-      });
+    nearWalletSelector.init().then(() => {
+      selectorRef.current = nearWalletSelector;
+      setLoaded(true);
+    });
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
@@ -51,7 +45,7 @@ const App: React.FC = () => {
   return (
     <Fragment>
       <h1>NEAR Guest Book</h1>
-      <Content selector={selectorRef.current} />
+      <Content selector={selectorRef.current!} />
     </Fragment>
   );
 };

examples/react/src/components/Content.tsx

@@ -21,9 +21,11 @@ const Content: React.FC<ContentProps> = ({ selector }) => {
   useEffect(() => {
     // TODO: don't just fetch once; subscribe!
     Promise.all([
-      selector.contract.view({ methodName: "getMessages" }),
+      selector.contract.view({
+        methodName: "getMessages",
+      }) as Promise<Array<Message>>,
       selector.getAccount(),
-    ]).then(([ nextMessages, nextAccount ]) => {
+    ]).then(([nextMessages, nextAccount]) => {
       setMessages(nextMessages);
       setAccount(nextAccount);
     });
@@ -74,7 +76,7 @@ const Content: React.FC<ContentProps> = ({ selector }) => {
 
   const handleSwitchProvider = () => {
     selector.show();
-  }
+  };
 
   const handleSubmit = (e: SubmitEvent) => {
     // TODO: Fix the typing so that target.elements exists..
@@ -86,17 +88,20 @@ const Content: React.FC<ContentProps> = ({ selector }) => {
     // TODO: optimistically update page with new message,
     // update blockchain data in background
     // add uuid to each message, so we know which one is already known
-    selector.contract.signAndSendTransaction({
-      actions: [{
-        type: "FunctionCall",
-        params: {
-          methodName: "addMessage",
-          args: { text: message.value },
-          gas: BOATLOAD_OF_GAS,
-          deposit: utils.format.parseNearAmount(donation.value || "0")!
-        }
-      }]
-    })
+    selector.contract
+      .signAndSendTransaction({
+        actions: [
+          {
+            type: "FunctionCall",
+            params: {
+              methodName: "addMessage",
+              args: { text: message.value },
+              gas: BOATLOAD_OF_GAS,
+              deposit: utils.format.parseNearAmount(donation.value || "0")!,
+            },
+          },
+        ],
+      })
       .catch((err) => {
         alert("Failed to add message");
         console.log("Failed to add message");
@@ -106,7 +111,7 @@ const Content: React.FC<ContentProps> = ({ selector }) => {
       .then(() => {
         return selector.contract
           .view({ methodName: "getMessages" })
-          .then((nextMessages) => {
+          .then((nextMessages: Array<Message>) => {
             setMessages(nextMessages);
             message.value = "";
             donation.value = SUGGESTED_DONATION;
@@ -148,6 +153,6 @@ const Content: React.FC<ContentProps> = ({ selector }) => {
       <Messages messages={messages} />
     </Fragment>
   );
-}
+};
 
-export default Content;
+export default Content;

examples/react/src/main.tsx

@@ -3,4 +3,4 @@ import ReactDOM from "react-dom";
 
 import App from "./App";
 
-ReactDOM.render(<App />, document.getElementById("root"));
+ReactDOM.render(<App />, document.getElementById("root"));

examples/react/tsconfig.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.json",
+  "extends": "../../tsconfig.json",
   "compilerOptions": {
     "module": "commonjs",
     "jsx": "react"

examples/react/yarn.lock

@@ -1188,6 +1188,11 @@
   dependencies:
     defer-to-connect "^1.0.1"
 
+"@types/big.js@^6.1.3":
+  version "6.1.3"
+  resolved "https://registry.yarnpkg.com/@types/big.js/-/big.js-6.1.3.tgz#c008dec4dae24c7a338ebb4521c46e9609020807"
+  integrity sha512-fHh2h1cFlvGP0kFCqoAsnuQoM0n3xHB6HxgZvELt7dji+BtK/j938MRL0nG5AA45EgibuFcPjgLlkqfUPCyoKw==
+
 "@types/prop-types@*":
   version "15.7.4"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"

package.json

@@ -40,17 +40,17 @@
     "@types/react-dom": "^17.0.11",
     "@types/w3c-web-hid": "^1.0.2",
     "@types/w3c-web-usb": "^1.0.5",
-    "@typescript-eslint/eslint-plugin": "^5.10.1",
-    "@typescript-eslint/parser": "^5.10.1",
-    "eslint": "^8.7.0",
-    "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.28.0",
-    "eslint-plugin-react-hooks": "^4.3.0",
+    "@typescript-eslint/eslint-plugin": "5.13.0",
+    "@typescript-eslint/parser": "5.13.0",
+    "eslint": "8.10.0",
+    "eslint-config-prettier": "8.4.0",
+    "eslint-plugin-prettier": "4.0.0",
+    "eslint-plugin-react": "7.29.2",
+    "eslint-plugin-react-hooks": "4.3.0",
     "jest": "^27.4.7",
     "jest-mock-extended": "^2.0.4",
     "playwright": "^1.18.0",
-    "prettier": "^2.5.1",
+    "prettier": "2.5.1",
     "ts-jest": "^27.1.3",
     "ts-node": "^10.4.0",
     "typescript": "^4.5.3"

src/modal/Modal.tsx

@@ -56,7 +56,9 @@ const Modal: React.FC<ModalProps> = ({ options, wallets }) => {
   };
 
   const handleDismissClick = () => {
-    if (isLoading) return;
+    if (isLoading) {
+      return;
+    }
 
     updateState((prevState) => ({
       ...prevState,

src/services/logging.service.ts

@@ -27,7 +27,10 @@ export class Logger
   }
 
   private trigger(method: keyof Console, ...args: unknown[]) {
-    if (!Logger.debug) return;
+    if (!Logger.debug) {
+      return;
+    }
+
     this.logger[method].apply(console, args);
   }
 }