chore: add prettier

This commit is contained in:
Tobias Mahnke 2021-04-20 17:00:09 +02:00
parent f821ff2722
commit 8b70740186
5 changed files with 112 additions and 39 deletions

View file

@ -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",

View file

@ -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
}
}

View file

@ -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>
)
);
}

View file

@ -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;

View file

@ -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;