Merge pull request #868 from ChainSafe/dev

Release TKey to Staging

.eslintrc.json

@@ -12,50 +12,56 @@
     "eslint:recommended",
     "plugin:@typescript-eslint/eslint-recommended",
     "plugin:@typescript-eslint/recommended",
-    "plugin:react/recommended"
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended"
   ],
   "settings": {
     "react": {
       "version": "detect"
     }
   },
   "rules": {
-    "indent": [
-      "error",
-      2,
-      {
-        "SwitchCase": 1
-      }
-    ],
+    "comma-spacing": ["error", { "before": false, "after": true }],
+    "indent": ["error", 2],
     "linebreak-style": ["error", "unix"],
     "quotes": ["error", "double"],
-    "semi": ["error", "off"],
+    "semi": ["error", "never"],
     "max-len": [
       "error",
       {
-        "code": 120
+        "code": 140
       }
     ],
-    "no-console": 2,
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn",
     "react/prop-types": 0,
-    "@typescript-eslint/no-unused-vars": [
-      2,
-      {
-        "vars": "all",
-        // "args": "all",
-        "varsIgnorePattern": "^jsx$",
-        "argsIgnorePattern": "[Ii]gnored$"
-      }
-    ],
+    "arrow-spacing": "error",
+    "space-infix-ops": "error",
+    "no-trailing-spaces": ["error", { "ignoreComments": true }],
+    "comma-dangle": ["error", "never"],
+    "object-curly-spacing": ["error", "always"],
+    "space-in-parens": ["error", "never"],
     "@typescript-eslint/no-use-before-define": "off",
     "@typescript-eslint/explicit-function-return-type": "off",
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/camelcase": "off",
-    "@typescript-eslint/interface-name-prefix": [
-      "error",
-      {
-        "prefixWithI": "always"
-      }
-    ]
-  }
+    "@typescript-eslint/interface-name-prefix": "off",
+    "@typescript-eslint/member-delimiter-style" : ["warn", {
+        "multiline": {
+            "delimiter": "none",
+            "requireLast": true
+        },
+        "singleline": {
+            "delimiter": "semi",
+            "requireLast": false
+        }
+    }]
+  },
+  "ignorePatterns": [
+    ".github/**",
+    ".vscode/**",
+    ".yarn/**",
+    "**/dist/*",
+    "**/node_modules/*"
+  ]
 }

.github/workflows/lingui_extract.yml

@@ -0,0 +1,23 @@
+name: Lingui extract
+on:
+  push:
+    branches:
+      - dev
+jobs:
+  # extract any new translatable string
+  # and commit if there are new ones
+  extract:
+    name: lingui-extract
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v2
+    - name: lingui-extract
+      env:
+        GITHUB_PACKAGES_AUTH_TOKEN: ${{ secrets.GH_PKG_AUTH_TOKEN }}
+      run: |
+        git config --global user.name 'GitHub Actions'
+        git config --global user.email 'actions@github.com'
+        yarn install --immutable
+        (cd packages/files-ui && yarn extract --clean)
+        git add packages/files-ui/src/locales/*
+        if git commit -m "lingui extract"; then git push; else echo 'exiting successfully without commit'; fi

.gitignore

@@ -52,4 +52,5 @@ storybook-static
 # IDE configs
 .vscode
 .idea
-.env
+.env
+.DS_Store

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-push

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

.npmrc

@@ -1,5 +1,6 @@
 registry=https://registry.yarnpkg.com/
 
-@imploy:registry=https://npm.pkg.github.com
+@chainsafe:registry=https://npm.pkg.github.com
 //npm.pkg.github.com/:_authToken=${GITHUB_PACKAGES_AUTH_TOKEN}
+//registry.npmjs.org
 always-auth=true 

CONTRIBUTING.md

@@ -0,0 +1,47 @@
+# Contributing
+
+When contributing to this repository, please first check whether the issue you encounter or the request you have has already been logged. If not please create a New Issue.
+
+## Logging an Issue
+
+1. Make sure this issue has not already been raised. If a relevant issue has been closed already please reopen it or make a reference to it in a new issue.
+1. Add appropriate labels to the issue (e.g. Documentation)
+1. For minor issues, it is acceptable to describe the problem and offer a potential route to fix it. For more involved feature requests or bugs, please include the following details at the minimum:
+
+##### For bugs:
+
+- current system OS
+- current browser user-agent and version
+- repository branch
+- steps to reproduce
+- stack trace or any console log. Those logs are accessible in most browsers by pressing Ctrl/cmd + shift + J. 
+
+##### For feature requests:
+
+- rationale
+- paint the feature step by step (in words)
+- mockup (optional)
+
+## Pull Request Process
+
+1. Pick an issue in the Issue tracker for the repository, and assign yourself before working on it so we don't have duplicated effort.
+1. Pull Request must be created against the `dev` branch.
+1. The name of the branch should be in lower case and follow the pattern: [fix,mnt,feat]/[free-text-summarizing-the-PR]-[issue-number] e.g feat/mygithubhandle-file-sharing-888
+    - "fix" should be used when the Pull Request fixes a bug or something that is broken
+    - "mnt" should be used for any chore, dependency upgrade, housekeeping
+    - "feat" should be used for a new feature
+
+    You can optionally add your GitHub handle to identify branches.
+1. If unsure about the specifics of implementing a particular issue, please make a Draft PR sooner rather than later, and start a discussion from there.
+1. When designing a new UI component, please make sure your changes are also reflected in the appropriate Storybook story.
+1. When merging a Pull Request, please make sure to squash and merge, to prevent having all the commit messages merged. Note: this is **not** the default behavior.
+1. You may merge the Pull Request in once you have the sign-off of 2 maintainers, or if you
+   do not have permission to do that, you may request the reviewer to merge it for you.
+
+## Commit Messages
+
+Please provide a meaningful message summarizing in a couple of words what the commit did.  
+
+## Styleguides
+
+All TypeScript code must adhere to the [eslint-recommended](https://eslint.org/docs/rules/). These rules are programmatically enforced by `eslint` in a pre-push hook.

package.json

@@ -1,10 +1,10 @@
 {
-  "name": "@imploy/ui-monorepo",
-  "version": "1.0.1",
-  "description": "Imploy UI monorepo",
+  "name": "@chaisnafe/files-ui-monorepo",
+  "version": "1.0.0",
+  "description": "Chainsafe Files UI monorepo",
   "main": "index.js",
-  "repository": "https://github.com/imploy/ui.git",
-  "author": "Michael Yankelev <michael@chainsafe.io>",
+  "repository": "https://github.com/chainsafe/files-ui.git",
+  "author": "Chainsafe Products Team",
   "license": "MIT",
   "private": true,
   "engines": {
@@ -15,16 +15,15 @@
   "devDependencies": {
     "@sentry/cli": "1.60.1",
     "chalk": "^4.1.0",
-    "husky": "^4.3.5",
-    "prettier": "2.2.1",
-    "pretty-quick": "^3.1.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "husky": "^5.1.1",
     "typescript": "^4.0.5",
     "wsrun": "^5.2.4"
   },
   "scripts": {
-    "postinstall": "yarn build:common",
+    "postinstall": "husky install && yarn build:common",
     "build:common": "yarn build:theme && yarn build:components && yarn build:contexts",
-    "build:contexts": "yarn wsrun -t -p @imploy/common-contexts -c build",
+    "build:contexts": "yarn wsrun -t -p @chainsafe/common-contexts -c build",
     "build:components": "yarn wsrun -t -p @chainsafe/common-components -c build",
     "build:theme": "yarn wsrun -t -p @chainsafe/common-theme -c build",
     "build:storybook": "yarn wsrun -p @chainsafe/common-components -c build:storybook",
@@ -41,8 +40,8 @@
     "clean:dependencies": "rm -rf ./node_modules && rm -rf ./*/**/node_modules",
     "clean:dist": "rm -rf ./*/**/dist && rm -rf ./*/**/build && rm -rf ./*/**/storybook-static",
     "clean": "yarn clean:dependencies && yarn clean:dist",
-    "prettier": "prettier --config .prettierrc 'packages/**/src/**/*.{ts,tsx,js,jsx,md}' --write",
-    "start:tunnel": "./ngrok http https://localhost:3000"
+    "start:tunnel": "./ngrok http https://localhost:3000",
+    "lint": "eslint 'packages/**/src/**/*.{js,jsx,ts,tsx}'"
   },
   "workspaces": {
     "packages": [
@@ -52,10 +51,5 @@
       "**/webpack-dev-server",
       "**/react-scripts"
     ]
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "pretty-quick 'packages/**/src/**/*.{ts,tsx,js,jsx,md}' --staged"
-    }
   }
 }

packages/chainsafex/package.json

@@ -12,15 +12,15 @@
     "yup": "^0.32.8"
   },
   "devDependencies": {
+    "@craco/craco": "^5.9.0",
     "@testing-library/jest-dom": "^5.11.6",
     "@testing-library/react": "^11.2.2",
     "@testing-library/user-event": "^12.5.0",
     "@types/jest": "^26.0.16",
     "@types/node": "^14.14.10",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^16.9.10",
-    "@types/react-pdf": "^5.0.0",
-    "craco": "^0.0.3"
+    "@types/react-pdf": "^5.0.0"
   },
   "scripts": {
     "start": "craco --max_old_space_size=4096 start",

packages/chainsafex/src/App.tsx

@@ -2,7 +2,7 @@ import React, { useEffect } from "react"
 import {
   init as initSentry,
   ErrorBoundary,
-  showReportDialog,
+  showReportDialog
 } from "@sentry/react"
 import { ThemeSwitcher } from "@chainsafe/common-theme"
 import { CssBaseline, Router } from "@chainsafe/common-components"
@@ -19,16 +19,16 @@ if (
 ) {
   initSentry({
     dsn: process.env.REACT_APP_SENTRY_DSN_URL,
-    release: process.env.REACT_APP_SENTRY_RELEASE,
+    release: process.env.REACT_APP_SENTRY_RELEASE
   })
 }
 
 const App: React.FC<{}> = () => {
   const { initHotjar } = useHotjar()
   const hotjarId = process.env.REACT_APP_HOTJAR_ID
 
-  const apiUrl =
-    process.env.REACT_APP_API_URL || "http://3.236.79.100:8000/api/v1"
+  // const apiUrl =
+  //   process.env.REACT_APP_API_URL || "http://3.236.79.100:8000/api/v1"
 
   useEffect(() => {
     if (hotjarId && process.env.NODE_ENV === "production") {

packages/chainsafex/src/Components/Layouts/AppWrapper.tsx

@@ -1,14 +1,14 @@
-import { createStyles, ITheme, makeStyles } from "@chainsafe/common-theme"
+import { createStyles, makeStyles } from "@chainsafe/common-theme"
 import React from "react"
 import { ReactNode } from "react"
 
 interface IAppWrapper {
   children: ReactNode | ReactNode[]
 }
 
-const useStyles = makeStyles(({}: ITheme) => {
+const useStyles = makeStyles(() => {
   return createStyles({
-    root: {},
+    root: {}
   })
 })
 

packages/chainsafex/src/Components/Routes.tsx

@@ -3,7 +3,7 @@ import { Switch, ConditionalRoute } from "@chainsafe/common-components"
 import HomePage from "./Pages/HomePage"
 
 export const ROUTE_LINKS = {
-  Landing: "/",
+  Landing: "/"
 }
 
 const Routes = () => {

packages/chainsafex/src/Themes/DarkTheme.ts

@@ -4,11 +4,11 @@ export const darkTheme = createTheme({
   themeConfig: {
     palette: {
       primary: {
-        main: "#FFF",
+        main: "#FFF"
       },
       secondary: {
-        main: "#000",
-      },
-    },
-  },
+        main: "#000"
+      }
+    }
+  }
 })

packages/chainsafex/src/Themes/LightTheme.ts

@@ -5,17 +5,17 @@ export const lightTheme = createTheme({
     palette: {
       primary: {
         main: "#262626",
-        hover: "#FFF",
+        hover: "#FFF"
       },
       secondary: {
         main: "#FFF",
-        hover: "#000",
-      },
+        hover: "#000"
+      }
     },
     constants: {},
     overrides: {
       Typography: {},
-      Button: {},
-    },
-  },
+      Button: {}
+    }
+  }
 })