mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-10-01 15:57:46 +05:30
#305: fix linting errors after installing flow plugin for eslint.
Improve Authflow#run() typing
This commit is contained in:
parent
d1b19a2285
commit
82744f9300
@ -284,7 +284,7 @@ export function oAuthValidate(oauthData: {
|
|||||||
responseType: string,
|
responseType: string,
|
||||||
description: string,
|
description: string,
|
||||||
scope: string,
|
scope: string,
|
||||||
prompt: 'none'|'consent'|'select_account',
|
prompt: 'none' | 'consent' | 'select_account',
|
||||||
loginHint?: string,
|
loginHint?: string,
|
||||||
state?: string
|
state?: string
|
||||||
}) {
|
}) {
|
||||||
@ -387,7 +387,7 @@ export function setClient({
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function resetOAuth() {
|
export function resetOAuth() {
|
||||||
return (dispatch: (Function|Object) => void) => {
|
return (dispatch: (Function | Object) => void) => {
|
||||||
localStorage.removeItem('oauthData');
|
localStorage.removeItem('oauthData');
|
||||||
dispatch(setOAuthRequest({}));
|
dispatch(setOAuthRequest({}));
|
||||||
};
|
};
|
||||||
@ -399,7 +399,7 @@ export function resetOAuth() {
|
|||||||
* @return {function}
|
* @return {function}
|
||||||
*/
|
*/
|
||||||
export function resetAuth() {
|
export function resetAuth() {
|
||||||
return (dispatch: (Function|Object) => void) => {
|
return (dispatch: (Function | Object) => void) => {
|
||||||
dispatch(setLogin(null));
|
dispatch(setLogin(null));
|
||||||
dispatch(resetOAuth());
|
dispatch(resetOAuth());
|
||||||
};
|
};
|
||||||
@ -474,7 +474,7 @@ export function setLoadingState(isLoading: bool) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function wrapInLoader(fn) {
|
function wrapInLoader(fn) {
|
||||||
return (dispatch: (Function|Object) => void, getState: Object) => {
|
return (dispatch: (Function | Object) => void, getState: Object) => {
|
||||||
dispatch(setLoadingState(true));
|
dispatch(setLoadingState(true));
|
||||||
const endLoading = () => dispatch(setLoadingState(false));
|
const endLoading = () => dispatch(setLoadingState(false));
|
||||||
|
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
// @flow
|
||||||
import { combineReducers } from 'redux';
|
import { combineReducers } from 'redux';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
@ -17,7 +17,7 @@ import type { Form } from 'components/ui/form';
|
|||||||
|
|
||||||
const STEPS_TOTAL = 3;
|
const STEPS_TOTAL = 3;
|
||||||
|
|
||||||
export type MfaStep = 0|1|2;
|
export type MfaStep = 0 | 1 | 2;
|
||||||
type Props = {
|
type Props = {
|
||||||
onChangeStep: Function,
|
onChangeStep: Function,
|
||||||
confirmationForm: FormModel,
|
confirmationForm: FormModel,
|
||||||
|
@ -1,2 +1,3 @@
|
|||||||
|
// @flow
|
||||||
export { default } from './MultiFactorAuth';
|
export { default } from './MultiFactorAuth';
|
||||||
export type { MfaStep } from './MfaEnable';
|
export type { MfaStep } from './MfaEnable';
|
||||||
|
@ -15,10 +15,10 @@ import appleLogo from './images/apple.svg';
|
|||||||
import windowsLogo from './images/windows.svg';
|
import windowsLogo from './images/windows.svg';
|
||||||
|
|
||||||
export default class Instructions extends Component<{}, {
|
export default class Instructions extends Component<{}, {
|
||||||
activeOs: null|'android'|'ios'|'windows'
|
activeOs: null | 'android' | 'ios' | 'windows'
|
||||||
}> {
|
}> {
|
||||||
state: {
|
state: {
|
||||||
activeOs: null|'android'|'ios'|'windows'
|
activeOs: null | 'android' | 'ios' | 'windows'
|
||||||
} = {
|
} = {
|
||||||
activeOs: null
|
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();
|
event.preventDefault();
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
|
@ -6,7 +6,7 @@ import { FormattedMessage as Message } from 'react-intl';
|
|||||||
import messages from '../MultiFactorAuth.intl.json';
|
import messages from '../MultiFactorAuth.intl.json';
|
||||||
import styles from './instructions.scss';
|
import styles from './instructions.scss';
|
||||||
|
|
||||||
type OS = 'android'|'ios'|'windows';
|
type OS = 'android' | 'ios' | 'windows';
|
||||||
|
|
||||||
const linksByOs: {
|
const linksByOs: {
|
||||||
[key: OS]: {
|
[key: OS]: {
|
||||||
|
@ -8,7 +8,7 @@ import icons from 'components/ui/icons.scss';
|
|||||||
import messages from '../MultiFactorAuth.intl.json';
|
import messages from '../MultiFactorAuth.intl.json';
|
||||||
import mfaStyles from '../mfa.scss';
|
import mfaStyles from '../mfa.scss';
|
||||||
|
|
||||||
export default function MfaStatus({onProceed} : {
|
export default function MfaStatus({onProceed}: {
|
||||||
onProceed: Function
|
onProceed: Function
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
|
@ -72,7 +72,7 @@ export function PanelFooter(props: {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export class PanelBodyHeader extends Component<{
|
export class PanelBodyHeader extends Component<{
|
||||||
type: 'default'|'error',
|
type: 'default' | 'error',
|
||||||
onClose: Function,
|
onClose: Function,
|
||||||
children: *
|
children: *
|
||||||
}, {
|
}, {
|
||||||
|
@ -8,7 +8,7 @@ const ABORT_ERR = 20;
|
|||||||
|
|
||||||
export default function BsodMiddleware(dispatchBsod: Function, logger: Logger) {
|
export default function BsodMiddleware(dispatchBsod: Function, logger: Logger) {
|
||||||
return {
|
return {
|
||||||
catch<T: Resp<*>|InternalServerError>(resp?: T): Promise<T> {
|
catch<T: Resp<*> | InternalServerError>(resp?: T): Promise<T> {
|
||||||
if (resp && (
|
if (resp && (
|
||||||
(resp instanceof InternalServerError
|
(resp instanceof InternalServerError
|
||||||
&& resp.error.code !== ABORT_ERR
|
&& resp.error.code !== ABORT_ERR
|
||||||
|
@ -21,7 +21,7 @@ type State = {
|
|||||||
isTouched: bool,
|
isTouched: bool,
|
||||||
isLoading: bool
|
isLoading: bool
|
||||||
};
|
};
|
||||||
type InputElement = HTMLInputElement|HTMLTextAreaElement;
|
type InputElement = HTMLInputElement | HTMLTextAreaElement;
|
||||||
|
|
||||||
export default class Form extends Component<Props, State> {
|
export default class Form extends Component<Props, State> {
|
||||||
static defaultProps = {
|
static defaultProps = {
|
||||||
|
@ -1,15 +1,15 @@
|
|||||||
// @flow
|
// @flow
|
||||||
export type Color = 'green'
|
export type Color = 'green'
|
||||||
|'blue'
|
| 'blue'
|
||||||
|'darkBlue'
|
| 'darkBlue'
|
||||||
|'violet'
|
| 'violet'
|
||||||
|'lightViolet'
|
| 'lightViolet'
|
||||||
|'orange'
|
| 'orange'
|
||||||
|'red'
|
| 'red'
|
||||||
|'black'
|
| 'black'
|
||||||
|'white';
|
| 'white';
|
||||||
|
|
||||||
export type Skin = 'dark'|'light';
|
export type Skin = 'dark' | 'light';
|
||||||
|
|
||||||
export const COLOR_GREEN: Color = 'green';
|
export const COLOR_GREEN: Color = 'green';
|
||||||
export const COLOR_BLUE: Color = 'blue';
|
export const COLOR_BLUE: Color = 'blue';
|
||||||
|
@ -13,7 +13,7 @@ export default function Stepper({
|
|||||||
totalSteps,
|
totalSteps,
|
||||||
activeStep,
|
activeStep,
|
||||||
color = COLOR_GREEN
|
color = COLOR_GREEN
|
||||||
} : {
|
}: {
|
||||||
totalSteps: number,
|
totalSteps: number,
|
||||||
activeStep: number,
|
activeStep: number,
|
||||||
color: Color
|
color: Color
|
||||||
|
@ -18,7 +18,7 @@ export default class LoggedInPanel extends Component<{
|
|||||||
isAccountSwitcherActive: false
|
isAccountSwitcherActive: false
|
||||||
};
|
};
|
||||||
|
|
||||||
_isMounted: boolean = false;
|
_isMounted: bool = false;
|
||||||
el: ?HTMLElement;
|
el: ?HTMLElement;
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
@ -95,7 +95,7 @@ export default class LoggedInPanel extends Component<{
|
|||||||
*/
|
*/
|
||||||
function createOnOutsideComponentClickHandler(
|
function createOnOutsideComponentClickHandler(
|
||||||
getEl: () => ?HTMLElement,
|
getEl: () => ?HTMLElement,
|
||||||
isActive: () => boolean,
|
isActive: () => bool,
|
||||||
callback: Function
|
callback: Function
|
||||||
) {
|
) {
|
||||||
// TODO: we have the same logic in LangMenu
|
// TODO: we have the same logic in LangMenu
|
||||||
|
@ -42,20 +42,32 @@ class MultiFactorAuthPage extends Component<{
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const step = (parseInt(this.props.match.params.step, 10) || 1) - 1;
|
|
||||||
const {user} = this.props;
|
const {user} = this.props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<MultiFactorAuth
|
<MultiFactorAuth
|
||||||
isMfaEnabled={user.isOtpEnabled}
|
isMfaEnabled={user.isOtpEnabled}
|
||||||
onSubmit={this.onSubmit}
|
onSubmit={this.onSubmit}
|
||||||
step={step}
|
step={this.getStep()}
|
||||||
onChangeStep={this.onChangeStep}
|
onChangeStep={this.onChangeStep}
|
||||||
onComplete={this.onComplete}
|
onComplete={this.onComplete}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
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) => {
|
onChangeStep = (step: MfaStep) => {
|
||||||
this.props.history.push(`/profile/mfa/step${step + 1}`);
|
this.props.history.push(`/profile/mfa/step${step + 1}`);
|
||||||
};
|
};
|
||||||
|
@ -32,7 +32,7 @@ if (process.env.NODE_ENV === 'production') {
|
|||||||
|
|
||||||
class RootPage extends Component<{
|
class RootPage extends Component<{
|
||||||
user: User,
|
user: User,
|
||||||
isPopupActive: boolean,
|
isPopupActive: bool,
|
||||||
onLogoClick: Function,
|
onLogoClick: Function,
|
||||||
location: {
|
location: {
|
||||||
pathname: string
|
pathname: string
|
||||||
|
@ -19,9 +19,40 @@ type Request = {
|
|||||||
query: URLSearchParams,
|
query: URLSearchParams,
|
||||||
params: Object
|
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 {
|
export interface AuthContext {
|
||||||
run(actionId: string, payload: *): *;
|
run(actionId: ActionId, payload?: ?Object): *;
|
||||||
setState(newState: AbstractState): Promise<*>|void;
|
setState(newState: AbstractState): Promise<*> | void;
|
||||||
getState(): Object;
|
getState(): Object;
|
||||||
navigate(route: string): void;
|
navigate(route: string): void;
|
||||||
getRequest(): Request;
|
getRequest(): Request;
|
||||||
@ -94,7 +125,7 @@ export default class AuthFlow implements AuthContext {
|
|||||||
this.state.goBack(this);
|
this.state.goBack(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
run(actionId: string, payload: Object): Promise<*> {
|
run(actionId: ActionId, payload?: ?Object): Promise<*> {
|
||||||
if (!this.actions[actionId]) {
|
if (!this.actions[actionId]) {
|
||||||
throw new Error(`Action ${actionId} does not exists`);
|
throw new Error(`Action ${actionId} does not exists`);
|
||||||
}
|
}
|
||||||
|
@ -1,10 +1,37 @@
|
|||||||
|
// @flow
|
||||||
import AuthFlow from './AuthFlow';
|
import AuthFlow from './AuthFlow';
|
||||||
export type {AuthContext} from './AuthFlow';
|
export type {AuthContext} from './AuthFlow';
|
||||||
|
|
||||||
import * as actions from 'components/auth/actions';
|
import * as actions from 'components/auth/actions';
|
||||||
|
|
||||||
const availableActions = {
|
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);
|
export default new AuthFlow(availableActions);
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
// @flow
|
// @flow
|
||||||
function InternalServerError(error: Error|string|Object, resp?: Response|Object) {
|
function InternalServerError(error: Error | string | Object, resp?: Response | Object) {
|
||||||
error = error || {};
|
error = error || {};
|
||||||
|
|
||||||
this.name = 'InternalServerError';
|
this.name = 'InternalServerError';
|
||||||
|
Loading…
Reference in New Issue
Block a user