fix prettier (#363)

* fix prettier

* merge with master

Author: berezh

.prettierrc

@@ -0,0 +1,21 @@
+{
+    "jsxBracketSameLine": true,
+    "singleQuote": true,
+    "overrides": [
+        {
+            "files": ["**/*.css", "**/*.scss", "**/*.pcss", "**/*.html"],
+            "options": {
+                "singleQuote": false,
+                "tabWidth": 4
+            }
+        }
+    ],
+    "jsxSingleQuote": false,
+    "printWidth": 120,
+    "tabWidth": 4,
+    "endOfLine": "auto",
+    "semi": true,
+    "tslintIntegration": true,
+    "stylelintIntegration": true,
+    "ignorePath": ".gitignore"
+}

package.json

@@ -119,6 +119,7 @@
     "postcss-hexrgba": "^1.0.1",
     "postcss-import": "^12.0.0",
     "postcss-nested": "^3.0.0",
+    "prettier": "1.9.0",
     "ramda": "^0.26.1",
     "react-app-rewired": "^2.1.5",
     "react-hot-loader": "^4.3.4",
@@ -128,7 +129,8 @@
     "source-map-explorer": "^1.7.0",
     "ts-jest": "^23.1.3",
     "ts-node": "^7.0.1",
-    "typescript": "3.4.5",
+    "tslint-plugin-prettier": "^2.3.0",
+    "typescript": "3.8.2",
     "webpack": "4.42.0",
     "webpack-obfuscator": "^2.3.0"
   },
@@ -138,16 +140,6 @@
       "pre-push": "yarn lint && CI=true yarn test --no-watch"
     }
   },
-  "prettier": {
-    "trailingComma": "es6",
-    "tabWidth": 4,
-    "printWidth": 130,
-    "semi": true,
-    "singleQuote": true,
-    "tslintIntegration": true,
-    "stylelintIntegration": true,
-    "ignorePath": ".gitignore"
-  },
   "browserslist": [
     ">0.2%",
     "not ie <= 11",

src/components/EmailForm/index.tsx

@@ -1,5 +1,5 @@
 import cr from 'classnames';
-import * as React from 'react';
+import React, { FormEvent } from 'react';
 import { Button } from 'react-bootstrap';
 import { useSelector } from 'react-redux';
 import { CustomInput } from '../';
@@ -79,7 +79,7 @@ const EmailForm = React.memo((props: EmailFormProps) => {
         return false;
     };
 
-    const handleClick = (label?: string, e?: React.FormEvent<HTMLInputElement>) => {
+    const handleClick = (e: FormEvent<HTMLInputElement>) => {
         if (e) {
             e.preventDefault();
         }
@@ -101,21 +101,20 @@ const EmailForm = React.memo((props: EmailFormProps) => {
     return (
         <form>
             <div className={emailFormClass}>
-                {!isMobileDevice && <div className="cr-email-form__options-group">
-                  <div className="cr-email-form__option">
-                    <div className="cr-email-form__option-inner">
-                        {title || 'Forgot password'}
-                      <div className="cr-email-form__cros-icon" onClick={handleCancel}>
-                        <CloseIcon className="close-icon"/>
-                      </div>
+                {!isMobileDevice && (
+                    <div className="cr-email-form__options-group">
+                        <div className="cr-email-form__option">
+                            <div className="cr-email-form__option-inner">
+                                {title || 'Forgot password'}
+                                <div className="cr-email-form__cros-icon" onClick={handleCancel}>
+                                    <CloseIcon className="close-icon" />
+                                </div>
+                            </div>
+                        </div>
                     </div>
-                  </div>
-                </div>
-                }
+                )}
                 <div className="cr-email-form__form-content">
-                    <div className="cr-email-form__header">
-                        {message}
-                    </div>
+                    <div className="cr-email-form__header">{message}</div>
                     <div className={emailGroupClass}>
                         <CustomInput
                             type="email"
@@ -137,10 +136,9 @@ const EmailForm = React.memo((props: EmailFormProps) => {
                             block={true}
                             type="button"
                             disabled={isButtonDisabled()}
-                            onClick={e => handleClick(undefined, e)}
+                            onClick={(e) => handleClick(e as any)}
                             size="lg"
-                            variant="primary"
-                        >
+                            variant="primary">
                             {isLoading ? 'Loading...' : buttonLabel ? buttonLabel : 'Send'}
                         </Button>
                     </div>
@@ -150,6 +148,4 @@ const EmailForm = React.memo((props: EmailFormProps) => {
     );
 });
 
-export {
-    EmailForm,
-};
+export { EmailForm };

src/components/SignUp/index.tsx

@@ -158,7 +158,7 @@ export const SignUpForm = (props: SignUpFormProps) => {
             (confirmPassword && isConfirmPasswordValid);
     };
 
-    const handleClick = (label?: string, e?: React.FormEvent<HTMLInputElement>) => {
+    const handleClick = (e?: React.FormEvent<HTMLInputElement>) => {
         if (e) {
             e.preventDefault();
         }
@@ -285,7 +285,7 @@ export const SignUpForm = (props: SignUpFormProps) => {
                             block={true}
                             type="button"
                             disabled={disableButton()}
-                            onClick={e => handleClick(undefined, e)}
+                            onClick={e => handleClick(e as any)}
                             size="lg"
                             variant="primary"
                         >

src/components/Tooltip/index.tsx

@@ -8,10 +8,10 @@ interface Props {
     className?: string;
 }
 
-export const Tooltip = (props: Props) => (
-    <BootstrapTooltip id="tooltip" className="tooltip" {...props}>
+export const Tooltip = ({ id = 'tooltip', ...rest }: Props) => (
+    <BootstrapTooltip id={`${id}`} className="tooltip" {...rest}>
         <div className="tooltip__content">
-            <FormattedMessage id={props.title} />
+            <FormattedMessage id={rest.title} />
         </div>
     </BootstrapTooltip>
 );

src/screens/ProfileTwoFactorAuthScreen/index.tsx

@@ -225,7 +225,7 @@ class ToggleTwoFactorAuthComponent extends React.Component<Props, State> {
     };
 
     private get2faAction = () => {
-        const routingState = this.props.history.location.state;
+        const routingState = this.props.history.location.state as any;
 
         return routingState ? routingState.enable2fa : false;
     };

tsconfig.prod.json

@@ -9,7 +9,7 @@
     "forceConsistentCasingInFileNames": true,
     "suppressImplicitAnyIndexErrors": false,
     "noUnusedLocals": true,
-    "allowSyntheticDefaultImports": false,
+    "allowSyntheticDefaultImports": true,
     "experimentalDecorators": true,
     "types": [
       "node",

tslint.json

@@ -1,4 +1,5 @@
 {
+  "extends": ["tslint-plugin-prettier"],
   "linterOptions": {
     "exclude": [
       "config/**/*.js",
@@ -167,10 +168,7 @@
     "use-isnan": true,
     "deprecation": true,
     "eofline": true,
-    "linebreak-style": [
-      true,
-      "LF"
-    ],
+    "linebreak-style": false,
     "max-classes-per-file": [
       true,
       1