fix: 🐛 eslint plugins

.eslintignore

@@ -0,0 +1,2 @@
+node_modules
+.next

.eslintrc.js

@@ -0,0 +1,42 @@
+module.exports = {
+  root: true,
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaFeatures: { jsx: true },
+  },
+  plugins: ['react', 'jest', 'import', 'prettier'],
+  settings: {
+    react: {
+      createClass: 'createReactClass',
+      pragma: 'React',
+      version: 'detect',
+      flowVersion: '0.53',
+    },
+    propWrapperFunctions: [
+      'forbidExtraProps',
+      { property: 'freeze', object: 'Object' },
+      { property: 'myFavoriteWrapper' },
+    ],
+    linkComponents: ['Hyperlink', { name: 'Link', linkAttribute: 'to' }],
+  },
+  extends: [
+    "eslint:recommended",
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+    'plugin:jsx-a11y/recommended',
+    'plugin:import/errors',
+    'plugin:import/warnings',
+    'plugin:jest/recommended',
+    'prettier/@typescript-eslint',
+    'plugin:prettier/recommended',
+  ],
+  rules: {
+    'import/no-unresolved': 'off',
+    camelcase: 'off',
+    '@typescript-eslint/camelcase': 'off',
+    'prettier/prettier': 'error',
+    'react/prop-types': 'off',
+  },
+};

.vscode/settings.json

@@ -1,6 +1,6 @@
 {
-  "editor.formatOnSave": false,
+  "editor.formatOnSave": true,
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": true
   }
-}
+}

Dockerfile

@@ -12,21 +12,21 @@ RUN apk add --update --no-cache \
 # Install app dependencies
 COPY package.json .
 COPY yarn.lock .
-RUN yarn install --silent --production=true
+RUN yarn install --silent --prod
 RUN yarn add --dev cross-env
 
 # ---------------
 # Build App
 # ---------------
 FROM node:12-alpine
 
+WORKDIR /app
+
 # Copy dependencies from build stage
 COPY --from=build node_modules node_modules
 
 # Bundle app source
 COPY . .
-RUN yarn lint
-RUN yarn test
 RUN yarn build
 EXPOSE 3000
 

package.json

@@ -86,6 +86,8 @@
     "@testing-library/react": "^10.0.4",
     "@types/node": "^13.13.4",
     "@types/react": "^16.9.34",
+    "@types/styled-components": "^5.1.0",
+    "@types/styled-theming": "^2.2.2",
     "@typescript-eslint/eslint-plugin": "^2.31.0",
     "@typescript-eslint/parser": "^2.31.0",
     "babel-jest": "^25.5.1",
@@ -97,10 +99,13 @@
     "devmoji": "^2.1.9",
     "eslint": "^6.8.0",
     "eslint-config-prettier": "^6.11.0",
+    "eslint-plugin-import": "^2.20.2",
+    "eslint-plugin-jest": "^23.9.0",
     "eslint-plugin-jsx-a11y": "^6.2.3",
     "eslint-plugin-prettier": "^3.1.3",
     "eslint-plugin-react": "^7.19.0",
     "eslint-plugin-react-hooks": "^4.0.0",
+    "fast-diff": "^1.2.0",
     "husky": "^4.2.5",
     "jest": "^25.5.4",
     "lint-staged": "^10.2.2",
@@ -122,4 +127,4 @@
       "eslint --fix"
     ]
   }
-}
+}

src/components/input/Input.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import styled, { css, ThemeSet } from 'styled-components';
+import styled, { css } from 'styled-components';
+import { ThemeSet } from 'styled-theming';
 import {
   textColor,
   colorButtonBorder,

src/views/chat/Chat.styled.ts

@@ -1,4 +1,5 @@
-import styled, { css, ThemeSet } from 'styled-components';
+import styled, { css } from 'styled-components';
+import { ThemeSet } from 'styled-theming';
 import { DarkSubTitle, SubCard, Card } from '../../components/generic/Styled';
 import {
   cardBorderColor,