diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 1bcb6a7..f67eced 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -5606,6 +5606,23 @@
}
}
},
+ "eslint-config-prettier": {
+ "version": "6.15.0",
+ "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-6.15.0.tgz",
+ "integrity": "sha512-a1+kOYLR8wMGustcgAjdydMsQ2A/2ipRPwRKUmfYaSxc9ZPcrku080Ctl6zrZzZNs/U82MjSv+qKREkoq3bJaw==",
+ "dev": true,
+ "requires": {
+ "get-stdin": "^6.0.0"
+ },
+ "dependencies": {
+ "get-stdin": {
+ "version": "6.0.0",
+ "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-6.0.0.tgz",
+ "integrity": "sha512-jp4tHawyV7+fkkSKyvjuLZswblUtz+SQKzSWnBbii16BuZksJlU1wuBYXY75r+duh/llF1ur6oNwi+2ZzjKZ7g==",
+ "dev": true
+ }
+ }
+ },
"eslint-config-react-app": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-6.0.0.tgz",
@@ -5799,6 +5816,15 @@
}
}
},
+ "eslint-plugin-prettier": {
+ "version": "3.4.0",
+ "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-3.4.0.tgz",
+ "integrity": "sha512-UDK6rJT6INSfcOo545jiaOwB701uAIt2/dR7WnFQoGCVl1/EMqdANBmwUaqqQ45aXprsTGzSa39LI1PyuRBxxw==",
+ "dev": true,
+ "requires": {
+ "prettier-linter-helpers": "^1.0.0"
+ }
+ },
"eslint-plugin-react": {
"version": "7.21.5",
"resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.21.5.tgz",
@@ -6296,6 +6322,12 @@
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
},
+ "fast-diff": {
+ "version": "1.2.0",
+ "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.2.0.tgz",
+ "integrity": "sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==",
+ "dev": true
+ },
"fast-glob": {
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.5.tgz",
@@ -11886,6 +11918,21 @@
"resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
"integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw="
},
+ "prettier": {
+ "version": "2.2.1",
+ "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.2.1.tgz",
+ "integrity": "sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==",
+ "dev": true
+ },
+ "prettier-linter-helpers": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
+ "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
+ "dev": true,
+ "requires": {
+ "fast-diff": "^1.1.2"
+ }
+ },
"pretty-bytes": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.5.0.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index f3aef06..4906724 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -32,8 +32,18 @@
"eslintConfig": {
"extends": [
"react-app",
- "react-app/jest"
- ]
+ "react-app/jest",
+ "prettier"
+ ],
+ "plugins": [
+ "prettier"
+ ],
+ "rules": {
+ "prettier/prettier": "error",
+ "standard/array-bracket-even-spacing": 0,
+ "standard/computed-property-even-spacing": 0,
+ "standard/object-curly-even-spacing": 0
+ }
},
"browserslist": {
"production": [
@@ -62,6 +72,17 @@
"@types/react-dom": "^17.0.0",
"@types/redux-localstorage": "^1.0.8",
"@types/react-redux": "^7.1.16",
- "@types/react-router-dom": "^5.1.7"
+ "@types/react-router-dom": "^5.1.7",
+ "eslint-config-prettier": "^6.15.0",
+ "eslint-plugin-prettier": "^3.3.1",
+ "prettier": "^2.2.1"
+ },
+ "prettier": {
+ "useTabs": false,
+ "trailingComma": "all",
+ "tabWidth": 2,
+ "semi": true,
+ "singleQuote": true,
+ "printWidth": 120
}
}
diff --git a/frontend/src/components/RegistrationForm.tsx b/frontend/src/components/RegistrationForm.tsx
index 236c99e..b9c197e 100644
--- a/frontend/src/components/RegistrationForm.tsx
+++ b/frontend/src/components/RegistrationForm.tsx
@@ -1,28 +1,32 @@
-import React from 'react'
-import {Form, Button} from 'semantic-ui-react'
+import React from 'react';
+import { Form, Button } from 'semantic-ui-react';
type RegistrationFormSubmit = {
- username: string | null,
- email: string | null,
- password: string | null
-}
+ username: string | null;
+ email: string | null;
+ password: string | null;
+};
-export default function RegistrationForm({onSubmit: onSubmitOuter}: {onSubmit: (data: RegistrationFormSubmit) => void}) {
- const [username, setUsername] = React.useState(null)
- const [email, setEmail] = React.useState(null)
- const [password, setPassword] = React.useState(null)
- const [password2, setPassword2] = React.useState(null)
+export default function RegistrationForm({
+ onSubmit: onSubmitOuter,
+}: {
+ onSubmit: (data: RegistrationFormSubmit) => void;
+}) {
+ const [username, setUsername] = React.useState(null);
+ const [email, setEmail] = React.useState(null);
+ const [password, setPassword] = React.useState(null);
+ const [password2, setPassword2] = React.useState(null);
- const onChangeUsername = React.useCallback((e) => setUsername(e.target.value), [])
- const onChangeEmail = React.useCallback((e) => setEmail(e.target.value), [])
- const onChangePassword = React.useCallback((e) => setPassword(e.target.value), [])
- const onChangePassword2 = React.useCallback((e) => setPassword2(e.target.value), [])
+ const onChangeUsername = React.useCallback((e) => setUsername(e.target.value), []);
+ const onChangeEmail = React.useCallback((e) => setEmail(e.target.value), []);
+ const onChangePassword = React.useCallback((e) => setPassword(e.target.value), []);
+ const onChangePassword2 = React.useCallback((e) => setPassword2(e.target.value), []);
const onSubmit = React.useCallback(() => {
if (username && email && password && password2 === password) {
- onSubmitOuter({username, email, password})
+ onSubmitOuter({ username, email, password });
}
- }, [username, email, password, password2, onSubmitOuter])
+ }, [username, email, password, password2, onSubmitOuter]);
return (
<Form onSubmit={onSubmit}>
@@ -39,5 +43,5 @@ export default function RegistrationForm({onSubmit: onSubmitOuter}: {onSubmit: (
/>
<Button type="submit">Submit</Button>
</Form>
- )
+ );
}
diff --git a/frontend/src/pages/RegistrationPage.tsx b/frontend/src/pages/RegistrationPage.tsx
index 5963859..e007151 100644
--- a/frontend/src/pages/RegistrationPage.tsx
+++ b/frontend/src/pages/RegistrationPage.tsx
@@ -1,18 +1,19 @@
-import React from 'react'
-import {connect} from 'react-redux'
-import {Redirect} from 'react-router-dom'
+import React from 'react';
+import { connect } from 'react-redux';
+import { Redirect } from 'react-router-dom';
-import api from 'api'
-import {Page, RegistrationForm} from 'components'
+import api from 'api';
+import { Page, RegistrationForm } from 'components';
import type { RootState } from '../store';
-const RegistrationPage = connect((state: RootState) => ({loggedIn: Boolean(state.login)}))(function RegistrationPage({loggedIn}) {
- const onSubmit = React.useCallback(async ({username, email, password}) => {
+const RegistrationPage = connect((state: RootState) => ({ loggedIn: Boolean(state.login) }))(function RegistrationPage({
+ loggedIn,
+}) {
+ const onSubmit = React.useCallback(async ({ username, email, password }) => {
const response = await api.post(`/accounts/register`, {
- body: {username, email, password, confirmPassword: password},
+ body: { username, email, password, confirmPassword: password },
});
-
console.log('response', response);
}, []);
@@ -21,9 +22,9 @@ const RegistrationPage = connect((state: RootState) => ({loggedIn: Boolean(state
) : (
<Page small>
<h2>Register</h2>
- <RegistrationForm onSubmit={onSubmit}/>
+ <RegistrationForm onSubmit={onSubmit} />
</Page>
- )
-})
+ );
+});
-export default RegistrationPage
+export default RegistrationPage;
diff --git a/frontend/src/store.ts b/frontend/src/store.ts
index da1a8d4..39d03f9 100644
--- a/frontend/src/store.ts
+++ b/frontend/src/store.ts
@@ -1,7 +1,7 @@
-import {applyMiddleware, createStore, compose } from 'redux'
-import { save, load } from "redux-localstorage-simple"
+import { applyMiddleware, createStore, compose } from 'redux';
+import { save, load } from 'redux-localstorage-simple';
-import rootReducer from './reducers'
+import rootReducer from './reducers';
declare global {
interface Window {
@@ -13,8 +13,8 @@ const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
export const store = createStore(
rootReducer,
- load({ states: ["login"], disableWarnings: true }),
- composeEnhancers(applyMiddleware(save({ states: ["login"] })))
+ load({ states: ['login'], disableWarnings: true }),
+ composeEnhancers(applyMiddleware(save({ states: ['login'] }))),
);
export type AppDispatch = typeof store.dispatch;