From 82744f93007b48aeda013042fb250f2f3bc148de Mon Sep 17 00:00:00 2001 From: SleepWalker Date: Sat, 9 Sep 2017 18:04:26 +0300 Subject: [PATCH] #305: fix linting errors after installing flow plugin for eslint. Improve Authflow#run() typing --- src/components/auth/actions.js | 8 ++-- src/components/auth/reducer.js | 1 + .../profile/multiFactorAuth/MfaEnable.js | 2 +- .../profile/multiFactorAuth/index.js | 1 + .../instructions/Instructions.js | 6 +-- .../instructions/OsInstruction.js | 2 +- .../multiFactorAuth/status/MfaStatus.js | 2 +- src/components/ui/Panel.js | 2 +- src/components/ui/bsod/BsodMiddleware.js | 2 +- src/components/ui/form/Form.js | 2 +- src/components/ui/index.js | 18 ++++----- src/components/ui/stepper/Stepper.js | 2 +- src/components/userbar/LoggedInPanel.js | 4 +- src/pages/profile/MultiFactorAuthPage.js | 16 +++++++- src/pages/root/RootPage.js | 2 +- src/services/authFlow/AuthFlow.js | 37 +++++++++++++++++-- src/services/authFlow/index.js | 29 ++++++++++++++- src/services/request/InternalServerError.js | 2 +- 18 files changed, 105 insertions(+), 33 deletions(-) diff --git a/src/components/auth/actions.js b/src/components/auth/actions.js index 655d3a0..2eb119a 100644 --- a/src/components/auth/actions.js +++ b/src/components/auth/actions.js @@ -284,7 +284,7 @@ export function oAuthValidate(oauthData: { responseType: string, description: string, scope: string, - prompt: 'none'|'consent'|'select_account', + prompt: 'none' | 'consent' | 'select_account', loginHint?: string, state?: string }) { @@ -387,7 +387,7 @@ export function setClient({ } export function resetOAuth() { - return (dispatch: (Function|Object) => void) => { + return (dispatch: (Function | Object) => void) => { localStorage.removeItem('oauthData'); dispatch(setOAuthRequest({})); }; @@ -399,7 +399,7 @@ export function resetOAuth() { * @return {function} */ export function resetAuth() { - return (dispatch: (Function|Object) => void) => { + return (dispatch: (Function | Object) => void) => { dispatch(setLogin(null)); dispatch(resetOAuth()); }; @@ -474,7 +474,7 @@ export function setLoadingState(isLoading: bool) { } function wrapInLoader(fn) { - return (dispatch: (Function|Object) => void, getState: Object) => { + return (dispatch: (Function | Object) => void, getState: Object) => { dispatch(setLoadingState(true)); const endLoading = () => dispatch(setLoadingState(false)); diff --git a/src/components/auth/reducer.js b/src/components/auth/reducer.js index 468865f..5e1ab8d 100644 --- a/src/components/auth/reducer.js +++ b/src/components/auth/reducer.js @@ -1,3 +1,4 @@ +// @flow import { combineReducers } from 'redux'; import { diff --git a/src/components/profile/multiFactorAuth/MfaEnable.js b/src/components/profile/multiFactorAuth/MfaEnable.js index a51a6f1..0dff363 100644 --- a/src/components/profile/multiFactorAuth/MfaEnable.js +++ b/src/components/profile/multiFactorAuth/MfaEnable.js @@ -17,7 +17,7 @@ import type { Form } from 'components/ui/form'; const STEPS_TOTAL = 3; -export type MfaStep = 0|1|2; +export type MfaStep = 0 | 1 | 2; type Props = { onChangeStep: Function, confirmationForm: FormModel, diff --git a/src/components/profile/multiFactorAuth/index.js b/src/components/profile/multiFactorAuth/index.js index c803ff4..ba6b0c9 100644 --- a/src/components/profile/multiFactorAuth/index.js +++ b/src/components/profile/multiFactorAuth/index.js @@ -1,2 +1,3 @@ +// @flow export { default } from './MultiFactorAuth'; export type { MfaStep } from './MfaEnable'; diff --git a/src/components/profile/multiFactorAuth/instructions/Instructions.js b/src/components/profile/multiFactorAuth/instructions/Instructions.js index 88aec76..42d593d 100644 --- a/src/components/profile/multiFactorAuth/instructions/Instructions.js +++ b/src/components/profile/multiFactorAuth/instructions/Instructions.js @@ -15,10 +15,10 @@ import appleLogo from './images/apple.svg'; import windowsLogo from './images/windows.svg'; export default class Instructions extends Component<{}, { - activeOs: null|'android'|'ios'|'windows' + activeOs: null | 'android' | 'ios' | 'windows' }> { state: { - activeOs: null|'android'|'ios'|'windows' + activeOs: null | 'android' | 'ios' | 'windows' } = { activeOs: null }; @@ -74,7 +74,7 @@ export default class Instructions extends Component<{}, { ); } - onChangeOs(event: MouseEvent, osName: 'android'|'ios'|'windows') { + onChangeOs(event: MouseEvent, osName: 'android' | 'ios' | 'windows') { event.preventDefault(); this.setState({ diff --git a/src/components/profile/multiFactorAuth/instructions/OsInstruction.js b/src/components/profile/multiFactorAuth/instructions/OsInstruction.js index 57560a5..86ba530 100644 --- a/src/components/profile/multiFactorAuth/instructions/OsInstruction.js +++ b/src/components/profile/multiFactorAuth/instructions/OsInstruction.js @@ -6,7 +6,7 @@ import { FormattedMessage as Message } from 'react-intl'; import messages from '../MultiFactorAuth.intl.json'; import styles from './instructions.scss'; -type OS = 'android'|'ios'|'windows'; +type OS = 'android' | 'ios' | 'windows'; const linksByOs: { [key: OS]: { diff --git a/src/components/profile/multiFactorAuth/status/MfaStatus.js b/src/components/profile/multiFactorAuth/status/MfaStatus.js index 76aa8b5..3fea65e 100644 --- a/src/components/profile/multiFactorAuth/status/MfaStatus.js +++ b/src/components/profile/multiFactorAuth/status/MfaStatus.js @@ -8,7 +8,7 @@ import icons from 'components/ui/icons.scss'; import messages from '../MultiFactorAuth.intl.json'; import mfaStyles from '../mfa.scss'; -export default function MfaStatus({onProceed} : { +export default function MfaStatus({onProceed}: { onProceed: Function }) { return ( diff --git a/src/components/ui/Panel.js b/src/components/ui/Panel.js index a921dcc..e250053 100644 --- a/src/components/ui/Panel.js +++ b/src/components/ui/Panel.js @@ -72,7 +72,7 @@ export function PanelFooter(props: { } export class PanelBodyHeader extends Component<{ - type: 'default'|'error', + type: 'default' | 'error', onClose: Function, children: * }, { diff --git a/src/components/ui/bsod/BsodMiddleware.js b/src/components/ui/bsod/BsodMiddleware.js index 2e354a2..355a487 100644 --- a/src/components/ui/bsod/BsodMiddleware.js +++ b/src/components/ui/bsod/BsodMiddleware.js @@ -8,7 +8,7 @@ const ABORT_ERR = 20; export default function BsodMiddleware(dispatchBsod: Function, logger: Logger) { return { - catch|InternalServerError>(resp?: T): Promise { + catch | InternalServerError>(resp?: T): Promise { if (resp && ( (resp instanceof InternalServerError && resp.error.code !== ABORT_ERR diff --git a/src/components/ui/form/Form.js b/src/components/ui/form/Form.js index ff1db01..b928853 100644 --- a/src/components/ui/form/Form.js +++ b/src/components/ui/form/Form.js @@ -21,7 +21,7 @@ type State = { isTouched: bool, isLoading: bool }; -type InputElement = HTMLInputElement|HTMLTextAreaElement; +type InputElement = HTMLInputElement | HTMLTextAreaElement; export default class Form extends Component { static defaultProps = { diff --git a/src/components/ui/index.js b/src/components/ui/index.js index c1947a5..813e7b5 100644 --- a/src/components/ui/index.js +++ b/src/components/ui/index.js @@ -1,15 +1,15 @@ // @flow export type Color = 'green' - |'blue' - |'darkBlue' - |'violet' - |'lightViolet' - |'orange' - |'red' - |'black' - |'white'; + | 'blue' + | 'darkBlue' + | 'violet' + | 'lightViolet' + | 'orange' + | 'red' + | 'black' + | 'white'; -export type Skin = 'dark'|'light'; +export type Skin = 'dark' | 'light'; export const COLOR_GREEN: Color = 'green'; export const COLOR_BLUE: Color = 'blue'; diff --git a/src/components/ui/stepper/Stepper.js b/src/components/ui/stepper/Stepper.js index d143363..d4e4b0d 100644 --- a/src/components/ui/stepper/Stepper.js +++ b/src/components/ui/stepper/Stepper.js @@ -13,7 +13,7 @@ export default function Stepper({ totalSteps, activeStep, color = COLOR_GREEN -} : { +}: { totalSteps: number, activeStep: number, color: Color diff --git a/src/components/userbar/LoggedInPanel.js b/src/components/userbar/LoggedInPanel.js index 38f3483..5dffcd9 100644 --- a/src/components/userbar/LoggedInPanel.js +++ b/src/components/userbar/LoggedInPanel.js @@ -18,7 +18,7 @@ export default class LoggedInPanel extends Component<{ isAccountSwitcherActive: false }; - _isMounted: boolean = false; + _isMounted: bool = false; el: ?HTMLElement; componentDidMount() { @@ -95,7 +95,7 @@ export default class LoggedInPanel extends Component<{ */ function createOnOutsideComponentClickHandler( getEl: () => ?HTMLElement, - isActive: () => boolean, + isActive: () => bool, callback: Function ) { // TODO: we have the same logic in LangMenu diff --git a/src/pages/profile/MultiFactorAuthPage.js b/src/pages/profile/MultiFactorAuthPage.js index ec01fef..09a2da3 100644 --- a/src/pages/profile/MultiFactorAuthPage.js +++ b/src/pages/profile/MultiFactorAuthPage.js @@ -42,20 +42,32 @@ class MultiFactorAuthPage extends Component<{ } render() { - const step = (parseInt(this.props.match.params.step, 10) || 1) - 1; const {user} = this.props; return ( ); } + getStep(): MfaStep { + const step = (parseInt(this.props.match.params.step, 10) || 1) - 1; + + if (step !== 0 + && step !== 1 + && step !== 2 + ) { // NOTE: flow does not understand Array.includes() + return 1; + } + + return step; + } + onChangeStep = (step: MfaStep) => { this.props.history.push(`/profile/mfa/step${step + 1}`); }; diff --git a/src/pages/root/RootPage.js b/src/pages/root/RootPage.js index e993de4..a939e49 100644 --- a/src/pages/root/RootPage.js +++ b/src/pages/root/RootPage.js @@ -32,7 +32,7 @@ if (process.env.NODE_ENV === 'production') { class RootPage extends Component<{ user: User, - isPopupActive: boolean, + isPopupActive: bool, onLogoClick: Function, location: { pathname: string diff --git a/src/services/authFlow/AuthFlow.js b/src/services/authFlow/AuthFlow.js index e7533e4..b00cd14 100644 --- a/src/services/authFlow/AuthFlow.js +++ b/src/services/authFlow/AuthFlow.js @@ -19,9 +19,40 @@ type Request = { query: URLSearchParams, params: Object }; + +// TODO: temporary added to improve typing without major refactoring +type ActionId = + | 'updateUser' + | 'authenticate' + | 'logout' + | 'goBack' + | 'redirect' + | 'login' + | 'acceptRules' + | 'forgotPassword' + | 'recoverPassword' + | 'register' + | 'activate' + | 'resendActivation' + | 'contactUs' + | 'setLogin' + | 'setAccountSwitcher' + | 'setErrors' + | 'clearErrors' + | 'oAuthValidate' + | 'oAuthComplete' + | 'setClient' + | 'resetOAuth' + | 'resetAuth' + | 'setOAuthRequest' + | 'setOAuthCode' + | 'requirePermissionsAccept' + | 'setScopes' + | 'setLoadingState'; + export interface AuthContext { - run(actionId: string, payload: *): *; - setState(newState: AbstractState): Promise<*>|void; + run(actionId: ActionId, payload?: ?Object): *; + setState(newState: AbstractState): Promise<*> | void; getState(): Object; navigate(route: string): void; getRequest(): Request; @@ -94,7 +125,7 @@ export default class AuthFlow implements AuthContext { this.state.goBack(this); } - run(actionId: string, payload: Object): Promise<*> { + run(actionId: ActionId, payload?: ?Object): Promise<*> { if (!this.actions[actionId]) { throw new Error(`Action ${actionId} does not exists`); } diff --git a/src/services/authFlow/index.js b/src/services/authFlow/index.js index a6d17cf..4cf624c 100644 --- a/src/services/authFlow/index.js +++ b/src/services/authFlow/index.js @@ -1,10 +1,37 @@ +// @flow import AuthFlow from './AuthFlow'; export type {AuthContext} from './AuthFlow'; import * as actions from 'components/auth/actions'; const availableActions = { - ...actions + updateUser: actions.updateUser, + authenticate: actions.authenticate, + logout: actions.logout, + goBack: actions.goBack, + redirect: actions.redirect, + login: actions.login, + acceptRules: actions.acceptRules, + forgotPassword: actions.forgotPassword, + recoverPassword: actions.recoverPassword, + register: actions.register, + activate: actions.activate, + resendActivation: actions.resendActivation, + contactUs: actions.contactUs, + setLogin: actions.setLogin, + setAccountSwitcher: actions.setAccountSwitcher, + setErrors: actions.setErrors, + clearErrors: actions.clearErrors, + oAuthValidate: actions.oAuthValidate, + oAuthComplete: actions.oAuthComplete, + setClient: actions.setClient, + resetOAuth: actions.resetOAuth, + resetAuth: actions.resetAuth, + setOAuthRequest: actions.setOAuthRequest, + setOAuthCode: actions.setOAuthCode, + requirePermissionsAccept: actions.requirePermissionsAccept, + setScopes: actions.setScopes, + setLoadingState: actions.setLoadingState }; export default new AuthFlow(availableActions); diff --git a/src/services/request/InternalServerError.js b/src/services/request/InternalServerError.js index e262a4c..ebde179 100644 --- a/src/services/request/InternalServerError.js +++ b/src/services/request/InternalServerError.js @@ -1,5 +1,5 @@ // @flow -function InternalServerError(error: Error|string|Object, resp?: Response|Object) { +function InternalServerError(error: Error | string | Object, resp?: Response | Object) { error = error || {}; this.name = 'InternalServerError';