From d8d2df070233078e7259da6e78341d08abc3ab56 Mon Sep 17 00:00:00 2001
From: SleepWalker <mybox@udf.su>
Date: Sat, 7 Dec 2019 13:28:52 +0200
Subject: [PATCH] Migrate from flow to typescript

---
 .eslintrc.js                                  |  73 ++---
 .flowconfig                                   |  20 --
 @types/webpack-loaders.d.ts                   |  61 ++++
 babel.config.js                               |  12 +-
 flow-typed/Promise.js                         |  29 --
 flow-typed/npm/react-intl_v2.x.x.js           | 278 ------------------
 flow-typed/npm/react-motion_vx.x.x.js         | 123 --------
 flow-typed/npm/react-redux_v5.x.x.js          | 276 -----------------
 flow-typed/npm/react-router-dom_v5.x.x.js     | 176 -----------
 flow-typed/npm/redux_v4.x.x.js                | 100 -------
 jest/__mocks__/intlMock.js                    |   3 +-
 package.json                                  |  16 +-
 postcss.config.js                             |   1 +
 scripts/build-dll.js                          |   1 +
 scripts/{i18n-collect.js => i18n-collect.ts}  |  34 ++-
 scripts/{i18n-crowdin.js => i18n-crowdin.ts}  |  67 +++--
 src/{App.js => App.tsx}                       |  10 +-
 .../{MeasureHeight.js => MeasureHeight.tsx}   |  28 +-
 ...AccountSwitcher.js => AccountSwitcher.tsx} |  51 ++--
 .../{actions.test.js => actions.test.ts}      | 122 ++++----
 .../accounts/{actions.js => actions.ts}       | 100 +++----
 .../{pure-actions.js => pure-actions.ts}      |  11 +-
 src/components/accounts/index.js              |   3 -
 src/components/accounts/index.ts              |   2 +
 .../{reducer.test.js => reducer.test.ts}      |  32 +-
 .../accounts/{reducer.js => reducer.ts}       |  40 ++-
 .../auth/{AuthTitle.js => AuthTitle.tsx}      |   6 +-
 .../{BaseAuthBody.js => BaseAuthBody.tsx}     |  20 +-
 ...PanelTransition.js => PanelTransition.tsx} | 213 ++++++--------
 .../{RejectionLink.js => RejectionLink.tsx}   |  31 +-
 .../{AcceptRules.js => AcceptRules.ts}        |   3 +-
 .../auth/{actions.test.js => actions.test.ts} |  32 +-
 .../auth/{actions.js => actions.ts}           | 184 ++++++------
 .../{Activation.js => Activation.ts}          |   3 +-
 .../auth/appInfo/{AppInfo.js => AppInfo.tsx}  |  13 +-
 .../{ChooseAccount.js => ChooseAccount.ts}    |   2 +-
 src/components/auth/factory.js                |  33 ---
 src/components/auth/factory.tsx               |  50 ++++
 .../auth/finish/{Finish.js => Finish.tsx}     |  56 ++--
 .../{ForgotPassword.js => ForgotPassword.ts}  |   3 +-
 src/components/auth/index.ts                  |   1 +
 .../auth/login/{Login.js => Login.ts}         |   3 +-
 src/components/auth/mfa/{Mfa.js => Mfa.tsx}   |   4 +-
 .../auth/mfa/{MfaBody.js => MfaBody.tsx}      |   3 -
 .../password/{Password.js => Password.ts}     |   3 +-
 .../{Permissions.js => Permissions.ts}        |   2 +-
 ...{RecoverPassword.js => RecoverPassword.ts} |   3 +-
 .../auth/{reducer.test.js => reducer.test.ts} |   7 +-
 .../auth/{reducer.js => reducer.ts}           |  62 +++-
 .../register/{Register.js => Register.ts}     |   7 +-
 ...esendActivation.js => ResendActivation.ts} |   5 +-
 ...ntactForm.test.js => ContactForm.test.tsx} |  35 ++-
 .../{ContactForm.js => ContactForm.tsx}       |  29 +-
 .../{ContactLink.js => ContactLink.tsx}       |  11 +-
 src/components/contact/{index.js => index.ts} |   2 -
 ...icationsIndex.js => ApplicationsIndex.tsx} |  21 +-
 .../dev/apps/{actions.js => actions.ts}       |  19 +-
 ...ApplicationForm.js => ApplicationForm.tsx} |  47 +--
 ...witcher.js => ApplicationTypeSwitcher.tsx} |  13 +-
 ...tServerType.js => MinecraftServerType.tsx} |   9 +-
 .../{WebsiteType.js => WebsiteType.tsx}       |   7 +-
 .../dev/apps/{index.js => index.ts}           |   1 -
 ...ApplicationItem.js => ApplicationItem.tsx} |  44 +--
 ...plicationsList.js => ApplicationsList.tsx} |  17 +-
 .../dev/apps/list/{index.js => index.ts}      |   2 -
 .../dev/apps/{reducer.js => reducer.ts}       |  16 +-
 .../{FooterMenu.js => FooterMenu.tsx}         |  18 +-
 .../footerMenu/{index.js => index.ts}         |   0
 .../{IntlProvider.js => IntlProvider.tsx}     |  16 +-
 .../i18n/{actions.js => actions.ts}           |   5 +-
 src/components/i18n/{index.js => index.ts}    |   1 -
 .../i18n/{localeFlags.js => localeFlags.ts}   |   7 +-
 .../i18n/{reducer.js => reducer.ts}           |   5 +-
 .../{LanguageList.js => LanguageList.tsx}     |  18 +-
 ...nguageSwitcher.js => LanguageSwitcher.tsx} |  60 ++--
 .../{LocaleItem.js => LocaleItem.tsx}         |   5 +-
 ...LanguageLink.js => ChangeLanguageLink.tsx} |  17 +-
 .../languageSwitcher/{index.js => index.ts}   |   1 -
 .../profile/{Profile.js => Profile.tsx}       |  29 +-
 src/components/profile/ProfileField.js        |   6 +-
 .../{ProfileForm.js => ProfileForm.tsx}       |   8 +-
 .../profile/changeEmail/ChangeEmail.js        |   3 +-
 .../{MfaDisable.js => MfaDisable.tsx}         |  25 +-
 .../{MfaEnable.js => MfaEnable.tsx}           |  23 +-
 ...MultiFactorAuth.js => MultiFactorAuth.tsx} |  21 +-
 .../{Confirmation.js => Confirmation.tsx}     |  11 +-
 .../confirmation/{index.js => index.ts}       |   1 -
 .../{MfaDisableForm.js => MfaDisableForm.tsx} |   8 +-
 .../profile/multiFactorAuth/index.js          |   3 -
 .../profile/multiFactorAuth/index.ts          |   2 +
 .../{Instructions.js => Instructions.tsx}     |  24 +-
 .../{OsInstruction.js => OsInstruction.tsx}   |  10 +-
 .../instructions/{OsTile.js => OsTile.tsx}    |  10 +-
 .../instructions/{index.js => index.ts}       |   1 -
 .../keyForm/{KeyForm.js => KeyForm.tsx}       |  10 +-
 .../keyForm/{index.js => index.ts}            |   1 -
 .../status/{MfaStatus.js => MfaStatus.tsx}    |   6 +-
 src/components/ui/{Panel.js => Panel.tsx}     |  52 ++--
 .../ui/{RelativeTime.js => RelativeTime.tsx}  |   3 +-
 src/components/ui/bsod/{BSoD.js => BSoD.tsx}  |  23 +-
 src/components/ui/bsod/Box.js                 |   1 +
 src/components/ui/bsod/BoxesField.js          |  10 +-
 src/components/ui/bsod/BsodMiddleware.js      |  36 ---
 ...dleware.test.js => BsodMiddleware.test.ts} |  12 +-
 src/components/ui/bsod/BsodMiddleware.ts      |  49 +++
 src/components/ui/bsod/dispatchBsod.js        |   2 +-
 .../ui/collapse/{Collapse.js => Collapse.tsx} |  14 +-
 .../ui/collapse/{index.js => index.ts}        |   1 -
 .../ui/form/{Button.js => Button.tsx}         |  42 ++-
 .../ui/form/{Captcha.js => Captcha.tsx}       |  13 +-
 .../ui/form/{Checkbox.js => Checkbox.tsx}     |  12 +-
 src/components/ui/form/Dropdown.js            |   9 +-
 src/components/ui/form/{Form.js => Form.tsx}  |  50 ++--
 src/components/ui/form/FormComponent.js       |  41 ---
 src/components/ui/form/FormComponent.tsx      |  41 +++
 .../ui/form/{FormError.js => FormError.tsx}   |  15 +-
 ...putComponent.js => FormInputComponent.tsx} |  12 +-
 .../ui/form/{FormModel.js => FormModel.ts}    |  32 +-
 .../ui/form/{Input.test.js => Input.test.tsx} |   3 +-
 .../ui/form/{Input.js => Input.tsx}           |  82 ++++--
 src/components/ui/form/LinkButton.js          |  15 -
 src/components/ui/form/LinkButton.tsx         |  18 ++
 .../ui/form/{Radio.js => Radio.tsx}           |  17 +-
 .../ui/form/{TextArea.js => TextArea.tsx}     |  52 ++--
 src/components/ui/form/{index.js => index.ts} |   0
 src/components/ui/{index.js => index.ts}      |   1 -
 ...ComponentLoader.js => ComponentLoader.tsx} |   9 +-
 .../{ImageLoader.js => ImageLoader.tsx}       |  13 +-
 .../ui/loader/{index.js => index.ts}          |   2 -
 .../{SlideMotion.js => SlideMotion.tsx}       |  27 +-
 .../ui/motion/{index.js => index.ts}          |   1 -
 src/components/ui/popup/PopupStack.test.js    |   5 +-
 .../popup/{PopupStack.js => PopupStack.tsx}   |  34 +--
 src/components/ui/popup/actions.js            |  29 --
 src/components/ui/popup/actions.ts            |  17 ++
 src/components/ui/popup/reducer.js            |  24 --
 src/components/ui/popup/reducer.test.js       |  17 +-
 src/components/ui/popup/reducer.ts            |  36 +++
 .../{ScrollIntoView.js => ScrollIntoView.tsx} |  12 +-
 .../ui/scroll/{index.js => index.ts}          |   2 -
 .../ui/scroll/{scroll.js => scroll.ts}        |  10 +-
 .../ui/stepper/{Stepper.js => Stepper.tsx}    |  13 +-
 .../ui/stepper/{index.js => index.ts}         |   0
 src/components/user/{User.js => User.ts}      |   0
 .../user/{actions.js => actions.ts}           |  36 ++-
 .../user/{factory.js => factory.ts}           |  18 +-
 src/components/user/index.js                  |   2 -
 src/components/user/index.ts                  |   1 +
 ...test.js => bearerHeaderMiddleware.test.ts} |  52 ++--
 ...iddleware.js => bearerHeaderMiddleware.ts} |  20 +-
 ...test.js => refreshTokenMiddleware.test.ts} |  26 +-
 ...iddleware.js => refreshTokenMiddleware.ts} |  22 +-
 .../user/{reducer.js => reducer.ts}           |  37 ++-
 .../{LoggedInPanel.js => LoggedInPanel.tsx}   |  19 +-
 .../userbar/{Userbar.js => Userbar.tsx}       |  14 +-
 src/containers/AuthFlowRoute.js               |  18 --
 src/containers/AuthFlowRoute.tsx              |  20 ++
 ...test.js => AuthFlowRouteContents.test.tsx} |   4 +-
 ...eContents.js => AuthFlowRouteContents.tsx} |  15 +-
 src/containers/PrivateRoute.js                |  35 ---
 src/containers/PrivateRoute.tsx               |  29 ++
 src/{functions.js => functions.ts}            |  16 +-
 src/i18n/index.js                             |  86 ++++++
 src/i18n/index.json                           |  86 ------
 src/{index.js => index.tsx}                   |  33 ++-
 src/pages/auth/{AuthPage.js => AuthPage.tsx}  |  29 +-
 ...ccessOauthPage.js => SuccessOauthPage.tsx} |  15 +-
 ...nsListPage.js => ApplicationsListPage.tsx} |  41 ++-
 ...onPage.js => CreateNewApplicationPage.tsx} |  18 +-
 src/pages/dev/{DevPage.js => DevPage.tsx}     |   1 -
 ...ationPage.js => UpdateApplicationPage.tsx} |  43 ++-
 ...ChangeEmailPage.js => ChangeEmailPage.tsx} |  41 +--
 ...PasswordPage.js => ChangePasswordPage.tsx} |  24 +-
 ...UsernamePage.js => ChangeUsernamePage.tsx} |  22 +-
 ...torAuthPage.js => MultiFactorAuthPage.tsx} |  43 +--
 .../{ProfilePage.js => ProfilePage.tsx}       |  36 ++-
 src/pages/root/{RootPage.js => RootPage.tsx}  |  20 +-
 .../{RulesPage.test.js => RulesPage.test.tsx} |   6 +-
 .../rules/{RulesPage.js => RulesPage.tsx}     |  18 +-
 src/reducers.js                               |  19 --
 src/reducers.ts                               |  50 ++++
 src/services/api/{accounts.js => accounts.ts} |  41 ++-
 .../{activate.test.js => activate.test.ts}    |   4 +-
 ...ication.test.js => authentication.test.ts} |  44 +--
 .../{authentication.js => authentication.ts}  |  40 +--
 src/services/api/{feedback.js => feedback.ts} |   0
 src/services/api/{mfa.js => mfa.ts}           |  16 +-
 src/services/api/{oauth.js => oauth.ts}       | 117 ++++----
 src/services/api/options.js                   |  18 --
 .../api/{options.test.js => options.test.ts}  |   2 +-
 src/services/api/options.ts                   |  23 ++
 src/services/api/{signup.js => signup.ts}     |   8 +-
 src/services/authFlow/AbstractState.js        |  13 -
 src/services/authFlow/AbstractState.ts        |  12 +
 ...State.test.js => AcceptRulesState.test.ts} |   0
 ...cceptRulesState.js => AcceptRulesState.ts} |   0
 ...nState.test.js => ActivationState.test.ts} |   0
 ...{ActivationState.js => ActivationState.ts} |   5 +-
 ...al.test.js => AuthFlow.functional.test.ts} |   6 +-
 .../{AuthFlow.test.js => AuthFlow.test.ts}    |   1 +
 .../authFlow/{AuthFlow.js => AuthFlow.ts}     |  57 ++--
 ...ate.test.js => ChooseAccountState.test.ts} |   0
 ...eAccountState.js => ChooseAccountState.ts} |   0
 ...eteState.test.js => CompleteState.test.ts} |   0
 .../{CompleteState.js => CompleteState.ts}    |  44 +--
 ...inishState.test.js => FinishState.test.ts} |   0
 .../{FinishState.js => FinishState.ts}        |   0
 ...te.test.js => ForgotPasswordState.test.ts} |   0
 ...asswordState.js => ForgotPasswordState.ts} |   7 +-
 ...{LoginState.test.js => LoginState.test.ts} |   0
 .../authFlow/{LoginState.js => LoginState.ts} |   6 +-
 .../{MfaState.test.js => MfaState.test.ts}    |   0
 .../authFlow/{MfaState.js => MfaState.ts}     |   4 +-
 ...{OAuthState.test.js => OAuthState.test.ts} |   2 +-
 .../authFlow/{OAuthState.js => OAuthState.ts} |   0
 ...ordState.test.js => PasswordState.test.ts} |   0
 .../{PasswordState.js => PasswordState.ts}    |   8 +-
 ...State.test.js => PermissionsState.test.ts} |   0
 ...ermissionsState.js => PermissionsState.ts} |   0
 ...e.test.js => RecoverPasswordState.test.ts} |   0
 ...sswordState.js => RecoverPasswordState.ts} |   0
 ...terState.test.js => RegisterState.test.ts} |   0
 .../{RegisterState.js => RegisterState.ts}    |   0
 ....test.js => ResendActivationState.test.ts} |   0
 ...ationState.js => ResendActivationState.ts} |   5 +-
 .../authFlow/{helpers.js => helpers.ts}       |   6 +-
 src/services/authFlow/{index.js => index.ts}  |   7 +-
 src/services/{captcha.js => captcha.ts}       |  15 +-
 src/services/{copy.js => copy.ts}             |   4 +-
 src/services/errorsDict/errorsDict.js         |   2 +-
 src/services/{font.js => font.ts}             |  11 +-
 src/services/history.js                       |   2 +-
 src/services/i18n/{i18n.js => i18n.ts}        |  26 +-
 src/services/i18n/{index.js => index.ts}      |   1 -
 .../i18n/{intlPolyfill.js => intlPolyfill.ts} |   4 +-
 src/services/loader.js                        |  18 +-
 src/services/localStorage.js                  |  22 +-
 src/services/logger/abbreviate.js             |   6 +-
 src/services/logger/index.js                  |   3 -
 src/services/logger/index.ts                  |   1 +
 src/services/logger/{logger.js => logger.ts}  |  20 +-
 src/services/request/InternalServerError.js   |  32 --
 src/services/request/InternalServerError.ts   |  36 +++
 .../request/PromiseMiddlewareLayer.js         |  49 ---
 ...test.js => PromiseMiddlewareLayer.test.ts} |  51 ++--
 .../request/PromiseMiddlewareLayer.ts         |  98 ++++++
 ...AbortedError.js => RequestAbortedError.ts} |   9 +-
 src/services/request/{index.js => index.ts}   |  11 +-
 .../{request.test.js => request.test.ts}      |  10 +-
 .../request/{request.js => request.ts}        |  84 ++++--
 src/storeFactory.js                           |   2 -
 src/test/unexpected.js                        |   1 +
 .../dev/{guest.test.js => guest.test.ts}      |   1 +
 .../dev/{user.test.js => user.test.ts}        |   4 +-
 ...n.test.js => invalid-refreshToken.test.ts} |   8 +-
 .../{sign-in.test.js => sign-in.test.ts}      |   5 +-
 .../cypress/plugins/{index.js => index.ts}    |   4 +-
 .../support/{commands.js => commands.ts}      |   0
 tests-e2e/cypress/support/index.d.ts          |  14 +
 .../cypress/support/{index.js => index.ts}    |   0
 tests-e2e/cypress/tsconfig.json               |  11 +
 tsconfig.json                                 |  18 ++
 webpack-utils/fontgen-loader.js               |   2 +
 webpack-utils/intl-loader.js                  |   1 +
 webpack.config.js                             |  12 +-
 webpack.dll.config.js                         |   4 +-
 yarn.lock                                     | 273 +++++++++--------
 267 files changed, 2806 insertions(+), 3535 deletions(-)
 delete mode 100644 .flowconfig
 create mode 100644 @types/webpack-loaders.d.ts
 delete mode 100644 flow-typed/Promise.js
 delete mode 100644 flow-typed/npm/react-intl_v2.x.x.js
 delete mode 100644 flow-typed/npm/react-motion_vx.x.x.js
 delete mode 100644 flow-typed/npm/react-redux_v5.x.x.js
 delete mode 100644 flow-typed/npm/react-router-dom_v5.x.x.js
 delete mode 100644 flow-typed/npm/redux_v4.x.x.js
 rename scripts/{i18n-collect.js => i18n-collect.ts} (89%)
 rename scripts/{i18n-crowdin.js => i18n-crowdin.ts} (86%)
 rename src/{App.js => App.tsx} (87%)
 rename src/components/{MeasureHeight.js => MeasureHeight.tsx} (78%)
 rename src/components/accounts/{AccountSwitcher.js => AccountSwitcher.tsx} (80%)
 rename src/components/accounts/{actions.test.js => actions.test.ts} (77%)
 rename src/components/accounts/{actions.js => actions.ts} (79%)
 rename src/components/accounts/actions/{pure-actions.js => pure-actions.ts} (93%)
 delete mode 100644 src/components/accounts/index.js
 create mode 100644 src/components/accounts/index.ts
 rename src/components/accounts/{reducer.test.js => reducer.test.ts} (82%)
 rename src/components/accounts/{reducer.js => reducer.ts} (80%)
 rename src/components/auth/{AuthTitle.js => AuthTitle.tsx} (59%)
 rename src/components/auth/{BaseAuthBody.js => BaseAuthBody.tsx} (75%)
 rename src/components/auth/{PanelTransition.js => PanelTransition.tsx} (79%)
 rename src/components/auth/{RejectionLink.js => RejectionLink.tsx} (56%)
 rename src/components/auth/acceptRules/{AcceptRules.js => AcceptRules.ts} (86%)
 rename src/components/auth/{actions.test.js => actions.test.ts} (85%)
 rename src/components/auth/{actions.js => actions.ts} (82%)
 rename src/components/auth/activation/{Activation.js => Activation.ts} (86%)
 rename src/components/auth/appInfo/{AppInfo.js => AppInfo.tsx} (90%)
 rename src/components/auth/chooseAccount/{ChooseAccount.js => ChooseAccount.ts} (85%)
 delete mode 100644 src/components/auth/factory.js
 create mode 100644 src/components/auth/factory.tsx
 rename src/components/auth/finish/{Finish.js => Finish.tsx} (73%)
 rename src/components/auth/forgotPassword/{ForgotPassword.js => ForgotPassword.ts} (86%)
 create mode 100644 src/components/auth/index.ts
 rename src/components/auth/login/{Login.js => Login.ts} (86%)
 rename src/components/auth/mfa/{Mfa.js => Mfa.tsx} (83%)
 rename src/components/auth/mfa/{MfaBody.js => MfaBody.tsx} (98%)
 rename src/components/auth/password/{Password.js => Password.ts} (85%)
 rename src/components/auth/permissions/{Permissions.js => Permissions.ts} (86%)
 rename src/components/auth/recoverPassword/{RecoverPassword.js => RecoverPassword.ts} (85%)
 rename src/components/auth/{reducer.test.js => reducer.test.ts} (88%)
 rename src/components/auth/{reducer.js => reducer.ts} (67%)
 rename src/components/auth/register/{Register.js => Register.ts} (64%)
 rename src/components/auth/resendActivation/{ResendActivation.js => ResendActivation.ts} (68%)
 rename src/components/contact/{ContactForm.test.js => ContactForm.test.tsx} (85%)
 rename src/components/contact/{ContactForm.js => ContactForm.tsx} (92%)
 rename src/components/contact/{ContactLink.js => ContactLink.tsx} (70%)
 rename src/components/contact/{index.js => index.ts} (84%)
 rename src/components/dev/apps/{ApplicationsIndex.js => ApplicationsIndex.tsx} (89%)
 rename src/components/dev/apps/{actions.js => actions.ts} (80%)
 rename src/components/dev/apps/applicationForm/{ApplicationForm.js => ApplicationForm.tsx} (80%)
 rename src/components/dev/apps/applicationForm/{ApplicationTypeSwitcher.js => ApplicationTypeSwitcher.tsx} (72%)
 rename src/components/dev/apps/applicationForm/{MinecraftServerType.js => MinecraftServerType.tsx} (92%)
 rename src/components/dev/apps/applicationForm/{WebsiteType.js => WebsiteType.tsx} (94%)
 rename src/components/dev/apps/{index.js => index.ts} (95%)
 rename src/components/dev/apps/list/{ApplicationItem.js => ApplicationItem.tsx} (90%)
 rename src/components/dev/apps/list/{ApplicationsList.js => ApplicationsList.tsx} (88%)
 rename src/components/dev/apps/list/{index.js => index.ts} (82%)
 rename src/components/dev/apps/{reducer.js => reducer.ts} (78%)
 rename src/components/footerMenu/{FooterMenu.js => FooterMenu.tsx} (79%)
 rename src/components/footerMenu/{index.js => index.ts} (100%)
 rename src/components/i18n/{IntlProvider.js => IntlProvider.tsx} (62%)
 rename src/components/i18n/{actions.js => actions.ts} (78%)
 rename src/components/i18n/{index.js => index.ts} (92%)
 rename src/components/i18n/{localeFlags.js => localeFlags.ts} (80%)
 rename src/components/i18n/{reducer.js => reducer.ts} (73%)
 rename src/components/languageSwitcher/{LanguageList.js => LanguageList.tsx} (93%)
 rename src/components/languageSwitcher/{LanguageSwitcher.js => LanguageSwitcher.tsx} (82%)
 rename src/components/languageSwitcher/{LocaleItem.js => LocaleItem.tsx} (94%)
 rename src/components/languageSwitcher/changeLanguageLink/{ChangeLanguageLink.js => ChangeLanguageLink.tsx} (82%)
 rename src/components/languageSwitcher/{index.js => index.ts} (93%)
 rename src/components/profile/{Profile.js => Profile.tsx} (93%)
 rename src/components/profile/{ProfileForm.js => ProfileForm.tsx} (92%)
 rename src/components/profile/multiFactorAuth/{MfaDisable.js => MfaDisable.tsx} (69%)
 rename src/components/profile/multiFactorAuth/{MfaEnable.js => MfaEnable.tsx} (90%)
 rename src/components/profile/multiFactorAuth/{MultiFactorAuth.js => MultiFactorAuth.tsx} (80%)
 rename src/components/profile/multiFactorAuth/confirmation/{Confirmation.js => Confirmation.tsx} (88%)
 rename src/components/profile/multiFactorAuth/confirmation/{index.js => index.ts} (82%)
 rename src/components/profile/multiFactorAuth/disableForm/{MfaDisableForm.js => MfaDisableForm.tsx} (89%)
 delete mode 100644 src/components/profile/multiFactorAuth/index.js
 create mode 100644 src/components/profile/multiFactorAuth/index.ts
 rename src/components/profile/multiFactorAuth/instructions/{Instructions.js => Instructions.tsx} (87%)
 rename src/components/profile/multiFactorAuth/instructions/{OsInstruction.js => OsInstruction.tsx} (96%)
 rename src/components/profile/multiFactorAuth/instructions/{OsTile.js => OsTile.tsx} (79%)
 rename src/components/profile/multiFactorAuth/instructions/{index.js => index.ts} (82%)
 rename src/components/profile/multiFactorAuth/keyForm/{KeyForm.js => KeyForm.tsx} (96%)
 rename src/components/profile/multiFactorAuth/keyForm/{index.js => index.ts} (80%)
 rename src/components/profile/multiFactorAuth/status/{MfaStatus.js => MfaStatus.tsx} (93%)
 rename src/components/ui/{Panel.js => Panel.tsx} (64%)
 rename src/components/ui/{RelativeTime.js => RelativeTime.tsx} (86%)
 rename src/components/ui/bsod/{BSoD.js => BSoD.tsx} (86%)
 delete mode 100644 src/components/ui/bsod/BsodMiddleware.js
 rename src/components/ui/bsod/{BsodMiddleware.test.js => BsodMiddleware.test.ts} (75%)
 create mode 100644 src/components/ui/bsod/BsodMiddleware.ts
 rename src/components/ui/collapse/{Collapse.js => Collapse.tsx} (91%)
 rename src/components/ui/collapse/{index.js => index.ts} (80%)
 rename src/components/ui/form/{Button.js => Button.tsx} (51%)
 rename src/components/ui/form/{Captcha.js => Captcha.tsx} (90%)
 rename src/components/ui/form/{Checkbox.js => Checkbox.tsx} (84%)
 rename src/components/ui/form/{Form.js => Form.tsx} (79%)
 delete mode 100644 src/components/ui/form/FormComponent.js
 create mode 100644 src/components/ui/form/FormComponent.tsx
 rename src/components/ui/form/{FormError.js => FormError.tsx} (71%)
 rename src/components/ui/form/{FormInputComponent.js => FormInputComponent.tsx} (75%)
 rename src/components/ui/form/{FormModel.js => FormModel.ts} (89%)
 rename src/components/ui/form/{Input.test.js => Input.test.tsx} (96%)
 rename src/components/ui/form/{Input.js => Input.tsx} (61%)
 delete mode 100644 src/components/ui/form/LinkButton.js
 create mode 100644 src/components/ui/form/LinkButton.tsx
 rename src/components/ui/form/{Radio.js => Radio.tsx} (81%)
 rename src/components/ui/form/{TextArea.js => TextArea.tsx} (59%)
 rename src/components/ui/form/{index.js => index.ts} (100%)
 rename src/components/ui/{index.js => index.ts} (99%)
 rename src/components/ui/loader/{ComponentLoader.js => ComponentLoader.tsx} (74%)
 rename src/components/ui/loader/{ImageLoader.js => ImageLoader.tsx} (90%)
 rename src/components/ui/loader/{index.js => index.ts} (92%)
 rename src/components/ui/motion/{SlideMotion.js => SlideMotion.tsx} (86%)
 rename src/components/ui/motion/{index.js => index.ts} (86%)
 rename src/components/ui/popup/{PopupStack.js => PopupStack.tsx} (76%)
 delete mode 100644 src/components/ui/popup/actions.js
 create mode 100644 src/components/ui/popup/actions.ts
 delete mode 100644 src/components/ui/popup/reducer.js
 create mode 100644 src/components/ui/popup/reducer.ts
 rename src/components/ui/scroll/{ScrollIntoView.js => ScrollIntoView.tsx} (70%)
 rename src/components/ui/scroll/{index.js => index.ts} (86%)
 rename src/components/ui/scroll/{scroll.js => scroll.ts} (95%)
 rename src/components/ui/stepper/{Stepper.js => Stepper.tsx} (76%)
 rename src/components/ui/stepper/{index.js => index.ts} (100%)
 rename src/components/user/{User.js => User.ts} (100%)
 rename src/components/user/{actions.js => actions.ts} (67%)
 rename src/components/user/{factory.js => factory.ts} (76%)
 delete mode 100644 src/components/user/index.js
 create mode 100644 src/components/user/index.ts
 rename src/components/user/middlewares/{bearerHeaderMiddleware.test.js => bearerHeaderMiddleware.test.ts} (52%)
 rename src/components/user/middlewares/{bearerHeaderMiddleware.js => bearerHeaderMiddleware.ts} (66%)
 rename src/components/user/middlewares/{refreshTokenMiddleware.test.js => refreshTokenMiddleware.test.ts} (92%)
 rename src/components/user/middlewares/{refreshTokenMiddleware.js => refreshTokenMiddleware.ts} (77%)
 rename src/components/user/{reducer.js => reducer.ts} (73%)
 rename src/components/userbar/{LoggedInPanel.js => LoggedInPanel.tsx} (90%)
 rename src/components/userbar/{Userbar.js => Userbar.tsx} (80%)
 delete mode 100644 src/containers/AuthFlowRoute.js
 create mode 100644 src/containers/AuthFlowRoute.tsx
 rename src/containers/{AuthFlowRouteContents.test.js => AuthFlowRouteContents.test.tsx} (92%)
 rename src/containers/{AuthFlowRouteContents.js => AuthFlowRouteContents.tsx} (86%)
 delete mode 100644 src/containers/PrivateRoute.js
 create mode 100644 src/containers/PrivateRoute.tsx
 rename src/{functions.js => functions.ts} (88%)
 create mode 100644 src/i18n/index.js
 delete mode 100644 src/i18n/index.json
 rename src/{index.js => index.tsx} (84%)
 rename src/pages/auth/{AuthPage.js => AuthPage.tsx} (92%)
 rename src/pages/auth/{SuccessOauthPage.js => SuccessOauthPage.tsx} (90%)
 rename src/pages/dev/{ApplicationsListPage.js => ApplicationsListPage.tsx} (68%)
 rename src/pages/dev/{CreateNewApplicationPage.js => CreateNewApplicationPage.tsx} (87%)
 rename src/pages/dev/{DevPage.js => DevPage.tsx} (99%)
 rename src/pages/dev/{UpdateApplicationPage.js => UpdateApplicationPage.tsx} (76%)
 rename src/pages/profile/{ChangeEmailPage.js => ChangeEmailPage.tsx} (79%)
 rename src/pages/profile/{ChangePasswordPage.js => ChangePasswordPage.tsx} (73%)
 rename src/pages/profile/{ChangeUsernamePage.js => ChangeUsernamePage.tsx} (86%)
 rename src/pages/profile/{MultiFactorAuthPage.js => MultiFactorAuthPage.tsx} (58%)
 rename src/pages/profile/{ProfilePage.js => ProfilePage.tsx} (90%)
 rename src/pages/root/{RootPage.js => RootPage.tsx} (90%)
 rename src/pages/rules/{RulesPage.test.js => RulesPage.test.tsx} (93%)
 rename src/pages/rules/{RulesPage.js => RulesPage.tsx} (96%)
 delete mode 100644 src/reducers.js
 create mode 100644 src/reducers.ts
 rename src/services/api/{accounts.js => accounts.ts} (76%)
 rename src/services/api/{activate.test.js => activate.test.ts} (95%)
 rename src/services/api/{authentication.test.js => authentication.test.ts} (86%)
 rename src/services/api/{authentication.js => authentication.ts} (86%)
 rename src/services/api/{feedback.js => feedback.ts} (100%)
 rename src/services/api/{mfa.js => mfa.ts} (70%)
 rename src/services/api/{oauth.js => oauth.ts} (67%)
 delete mode 100644 src/services/api/options.js
 rename src/services/api/{options.test.js => options.test.ts} (96%)
 create mode 100644 src/services/api/options.ts
 rename src/services/api/{signup.js => signup.ts} (76%)
 delete mode 100644 src/services/authFlow/AbstractState.js
 create mode 100644 src/services/authFlow/AbstractState.ts
 rename src/services/authFlow/{AcceptRulesState.test.js => AcceptRulesState.test.ts} (100%)
 rename src/services/authFlow/{AcceptRulesState.js => AcceptRulesState.ts} (100%)
 rename src/services/authFlow/{ActivationState.test.js => ActivationState.test.ts} (100%)
 rename src/services/authFlow/{ActivationState.js => ActivationState.ts} (86%)
 rename src/services/authFlow/{AuthFlow.functional.test.js => AuthFlow.functional.test.ts} (97%)
 rename src/services/authFlow/{AuthFlow.test.js => AuthFlow.test.ts} (99%)
 rename src/services/authFlow/{AuthFlow.js => AuthFlow.ts} (83%)
 rename src/services/authFlow/{ChooseAccountState.test.js => ChooseAccountState.test.ts} (100%)
 rename src/services/authFlow/{ChooseAccountState.js => ChooseAccountState.ts} (100%)
 rename src/services/authFlow/{CompleteState.test.js => CompleteState.test.ts} (100%)
 rename src/services/authFlow/{CompleteState.js => CompleteState.ts} (79%)
 rename src/services/authFlow/{FinishState.test.js => FinishState.test.ts} (100%)
 rename src/services/authFlow/{FinishState.js => FinishState.ts} (100%)
 rename src/services/authFlow/{ForgotPasswordState.test.js => ForgotPasswordState.test.ts} (100%)
 rename src/services/authFlow/{ForgotPasswordState.js => ForgotPasswordState.ts} (90%)
 rename src/services/authFlow/{LoginState.test.js => LoginState.test.ts} (100%)
 rename src/services/authFlow/{LoginState.js => LoginState.ts} (94%)
 rename src/services/authFlow/{MfaState.test.js => MfaState.test.ts} (100%)
 rename src/services/authFlow/{MfaState.js => MfaState.ts} (94%)
 rename src/services/authFlow/{OAuthState.test.js => OAuthState.test.ts} (98%)
 rename src/services/authFlow/{OAuthState.js => OAuthState.ts} (100%)
 rename src/services/authFlow/{PasswordState.test.js => PasswordState.test.ts} (100%)
 rename src/services/authFlow/{PasswordState.js => PasswordState.ts} (95%)
 rename src/services/authFlow/{PermissionsState.test.js => PermissionsState.test.ts} (100%)
 rename src/services/authFlow/{PermissionsState.js => PermissionsState.ts} (100%)
 rename src/services/authFlow/{RecoverPasswordState.test.js => RecoverPasswordState.test.ts} (100%)
 rename src/services/authFlow/{RecoverPasswordState.js => RecoverPasswordState.ts} (100%)
 rename src/services/authFlow/{RegisterState.test.js => RegisterState.test.ts} (100%)
 rename src/services/authFlow/{RegisterState.js => RegisterState.ts} (100%)
 rename src/services/authFlow/{ResendActivationState.test.js => ResendActivationState.test.ts} (100%)
 rename src/services/authFlow/{ResendActivationState.js => ResendActivationState.ts} (87%)
 rename src/services/authFlow/{helpers.js => helpers.ts} (90%)
 rename src/services/authFlow/{index.js => index.ts} (88%)
 rename src/services/{captcha.js => captcha.ts} (84%)
 rename src/services/{copy.js => copy.ts} (78%)
 rename src/services/{font.js => font.ts} (69%)
 rename src/services/i18n/{i18n.js => i18n.ts} (77%)
 rename src/services/i18n/{index.js => index.ts} (79%)
 rename src/services/i18n/{intlPolyfill.js => intlPolyfill.ts} (96%)
 delete mode 100644 src/services/logger/index.js
 create mode 100644 src/services/logger/index.ts
 rename src/services/logger/{logger.js => logger.ts} (87%)
 delete mode 100644 src/services/request/InternalServerError.js
 create mode 100644 src/services/request/InternalServerError.ts
 delete mode 100644 src/services/request/PromiseMiddlewareLayer.js
 rename src/services/request/{PromiseMiddlewareLayer.test.js => PromiseMiddlewareLayer.test.ts} (74%)
 create mode 100644 src/services/request/PromiseMiddlewareLayer.ts
 rename src/services/request/{RequestAbortedError.js => RequestAbortedError.ts} (87%)
 rename src/services/request/{index.js => index.ts} (56%)
 rename src/services/request/{request.test.js => request.test.ts} (89%)
 rename src/services/request/{request.js => request.ts} (71%)
 rename tests-e2e/cypress/integration/dev/{guest.test.js => guest.test.ts} (95%)
 rename tests-e2e/cypress/integration/dev/{user.test.js => user.test.ts} (91%)
 rename tests-e2e/cypress/integration/{invalid-refreshToken.test.js => invalid-refreshToken.test.ts} (97%)
 rename tests-e2e/cypress/integration/{sign-in.test.js => sign-in.test.ts} (93%)
 rename tests-e2e/cypress/plugins/{index.js => index.ts} (87%)
 rename tests-e2e/cypress/support/{commands.js => commands.ts} (100%)
 create mode 100644 tests-e2e/cypress/support/index.d.ts
 rename tests-e2e/cypress/support/{index.js => index.ts} (100%)
 create mode 100644 tests-e2e/cypress/tsconfig.json
 create mode 100644 tsconfig.json

diff --git a/.eslintrc.js b/.eslintrc.js
index d769e00..a64b75d 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,5 +1,5 @@
 module.exports = {
-  parser: 'babel-eslint',
+  parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 2018,
     sourceType: 'module',
@@ -7,12 +7,14 @@ module.exports = {
 
   extends: [
     'eslint:recommended',
-    'plugin:flowtype/recommended',
-    'plugin:prettier/recommended',
     'plugin:jsdoc/recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier/@typescript-eslint',
+    'plugin:prettier/recommended',
   ],
 
-  plugins: ['react', 'flowtype'],
+  plugins: ['react'],
 
   env: {
     browser: true,
@@ -56,7 +58,7 @@ module.exports = {
 
   // @see: http://eslint.org/docs/rules/
   rules: {
-    'no-prototype-builtins': ['warn'], // temporary set to warn
+    'no-prototype-builtins': 'warn', // temporary set to warn
     'no-restricted-globals': [
       'error',
       'localStorage',
@@ -67,7 +69,7 @@ module.exports = {
       'error',
       { min: 2, exceptions: ['x', 'y', 'i', 'k', 'l', 'm', 'n', '$', '_'] },
     ],
-    'require-atomic-updates': ['warn'],
+    'require-atomic-updates': 'warn',
     'guard-for-in': ['error'],
     'no-var': ['error'],
     'prefer-const': ['error'],
@@ -76,25 +78,18 @@ module.exports = {
     'no-multi-assign': ['error'],
     eqeqeq: ['error'],
     'prefer-rest-params': ['error'],
-    'prefer-object-spread': ['warn'],
-    'prefer-destructuring': ['warn'],
-    'no-bitwise': ['warn'],
-    'no-negated-condition': ['warn'],
-    'no-nested-ternary': ['warn'],
-    'no-unneeded-ternary': ['warn'],
-    'no-shadow': ['warn'],
-    'no-else-return': ['warn'],
-    radix: ['warn'],
-    'prefer-promise-reject-errors': ['warn'],
-    'no-unused-vars': [
-      'error',
-      {
-        vars: 'all',
-        args: 'after-used',
-        argsIgnorePattern: '^_',
-      },
-    ],
-    'object-shorthand': ['warn'],
+    'prefer-object-spread': 'warn',
+    'prefer-destructuring': 'warn',
+    'no-bitwise': 'warn',
+    'no-negated-condition': 'warn',
+    'no-nested-ternary': 'warn',
+    'no-unneeded-ternary': 'warn',
+    'no-shadow': 'warn',
+    'no-else-return': 'warn',
+    radix: 'warn',
+    'prefer-promise-reject-errors': 'warn',
+    'object-shorthand': 'warn',
+    'require-atomic-updates': 'off',
 
     // force extra lines around if, else, for, while, switch, return etc
     'padding-line-between-statements': [
@@ -134,9 +129,8 @@ module.exports = {
       'warn',
       { eventHandlerPrefix: 'on', eventHandlerPropPrefix: 'on' },
     ],
-    'react/jsx-indent-props': 'warn',
     'react/jsx-key': 'warn',
-    'react/jsx-max-props-per-line': ['warn', { maximum: 3 }],
+    'react/jsx-max-props-per-line': 'off',
     'react/jsx-no-bind': 'off',
     'react/jsx-no-duplicate-props': 'warn',
     'react/jsx-no-literals': 'off',
@@ -156,17 +150,24 @@ module.exports = {
     'react/no-string-refs': 'warn',
     'react/no-unknown-property': 'warn',
     'react/prefer-es6-class': 'warn',
-    'react/prop-types': 'off', // using flowtype for this task
+    'react/prop-types': 'off', // using ts for this task
     'react/self-closing-comp': 'warn',
-    'react/sort-comp': [
-      'off',
-      { order: ['lifecycle', 'render', 'everything-else'] },
-    ],
+    'react/sort-comp': 'off',
 
-    'flowtype/space-after-type-colon': 'off',
-    'flowtype/no-unused-expressions': [
-      'warn',
-      { allowShortCircuit: true, allowTernary: true },
+    // ts
+    '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-use-before-define': 'off',
+    '@typescript-eslint/ban-ts-ignore': 'off',
+    '@typescript-eslint/no-empty-function': 'off',
+    '@typescript-eslint/no-inferrable-types': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        vars: 'all',
+        args: 'after-used',
+        argsIgnorePattern: '^_',
+      },
     ],
   },
 };
diff --git a/.flowconfig b/.flowconfig
deleted file mode 100644
index 24d5741..0000000
--- a/.flowconfig
+++ /dev/null
@@ -1,20 +0,0 @@
-[ignore]
-.*/node_modules/fbjs/lib/.*
-.*/node_modules/react-motion/lib/.*
-.*/tests-e2e/.*
-
-[include]
-
-[libs]
-./flow-typed
-
-[options]
-module.system.node.resolve_dirname=node_modules
-module.system.node.resolve_dirname=src
-module.file_ext=.js
-module.file_ext=.json
-module.file_ext=.jsx
-module.file_ext=.css
-module.file_ext=.scss
-module.ignore_non_literal_requires=true
-esproposal.optional_chaining=enable
diff --git a/@types/webpack-loaders.d.ts b/@types/webpack-loaders.d.ts
new file mode 100644
index 0000000..2948cb9
--- /dev/null
+++ b/@types/webpack-loaders.d.ts
@@ -0,0 +1,61 @@
+declare module '*.html' {
+  const url: string;
+  export = url;
+}
+
+declare module '*.svg' {
+  const url: string;
+  export = url;
+}
+
+declare module '*.png' {
+  const url: string;
+  export = url;
+}
+
+declare module '*.gif' {
+  const url: string;
+  export = url;
+}
+
+declare module '*.jpg' {
+  const url: string;
+  export = url;
+}
+
+declare module '*.intl.json' {
+  import { MessageDescriptor } from 'react-intl';
+
+  const descriptor: {
+    [key: string]: MessageDescriptor;
+  };
+
+  export = descriptor;
+}
+
+declare module '*.json' {
+  const jsonContents: {
+    [key: string]: any;
+  };
+
+  export = jsonContents;
+}
+
+declare module '*.scss' {
+  // TODO: replace with:
+  // https://www.npmjs.com/package/css-modules-typescript-loader
+  // https://github.com/Jimdo/typings-for-css-modules-loader
+  const classNames: {
+    [className: string]: string;
+  };
+
+  export = classNames;
+}
+
+declare module '*.css' {
+  const classNames: {
+    [className: string]: string;
+  };
+
+  export = classNames;
+}
diff --git a/babel.config.js b/babel.config.js
index 563aed5..e1a0b0c 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,5 +1,9 @@
 module.exports = {
-  presets: ['@babel/preset-react', '@babel/preset-flow', ['@babel/preset-env']],
+  presets: [
+    '@babel/preset-react',
+    '@babel/preset-typescript',
+    ['@babel/preset-env'],
+  ],
   plugins: [
     '@babel/plugin-syntax-dynamic-import',
     '@babel/plugin-proposal-function-bind',
@@ -28,11 +32,5 @@ module.exports = {
         ],
       ],
     },
-    development: {
-      presets: [],
-    },
-    test: {
-      presets: [],
-    },
   },
 };
diff --git a/flow-typed/Promise.js b/flow-typed/Promise.js
deleted file mode 100644
index 4bf09fe..0000000
--- a/flow-typed/Promise.js
+++ /dev/null
@@ -1,29 +0,0 @@
-/**
- * This is a copypasted declaration from
- * https://github.com/facebook/flow/blob/master/lib/core.js
- * with addition of finally method
- */
-declare class Promise<+R> {
-    constructor(callback: (
-      resolve: (result: Promise<R> | R) => void,
-      reject:  (error: any) => void
-    ) => mixed): void;
-
-    then<U>(
-      onFulfill?: (value: R) => Promise<U> | U,
-      onReject?: (error: any) => Promise<U> | U
-    ): Promise<U>;
-
-    catch<U>(
-      onReject?: (error: any) => Promise<U> | U
-    ): Promise<R | U>;
-
-    static resolve<T>(object: Promise<T> | T): Promise<T>;
-    static reject<T>(error?: any): Promise<T>;
-    static all<Elem, T:Iterable<Elem>>(promises: T): Promise<$TupleMap<T, typeof $await>>;
-    static race<T, Elem: Promise<T> | T>(promises: Array<Elem>): Promise<T>;
-
-    finally<T>(
-      onSettled?: ?(value: any) => Promise<T> | T
-    ): Promise<T>;
-}
diff --git a/flow-typed/npm/react-intl_v2.x.x.js b/flow-typed/npm/react-intl_v2.x.x.js
deleted file mode 100644
index 38d6c10..0000000
--- a/flow-typed/npm/react-intl_v2.x.x.js
+++ /dev/null
@@ -1,278 +0,0 @@
-// flow-typed signature: 3902298e28ed22d8cd8d49828801a760
-// flow-typed version: eb50783110/react-intl_v2.x.x/flow_>=v0.63.x
-
-/**
- * Original implementation of this file by @marudor at https://github.com/marudor/flowInterfaces
- * Copied here based on intention to merge with flow-typed expressed here:
- * https://github.com/marudor/flowInterfaces/issues/6
- */
-// Mostly from https://github.com/yahoo/react-intl/wiki/API#react-intl-api
-declare module "react-intl" {
-  import type { Element, ChildrenArray } from "react";
-
-  declare type $npm$ReactIntl$LocaleData = {
-    locale: string,
-    [key: string]: any
-  };
-
-  declare type $npm$ReactIntl$MessageDescriptor = {
-    id: string,
-    description?: string,
-    defaultMessage?: string
-  };
-
-  declare type $npm$ReactIntl$IntlConfig = {
-    locale: string,
-    formats: Object,
-    messages: { [id: string]: string },
-
-    defaultLocale?: string,
-    defaultFormats?: Object
-  };
-
-  declare type $npm$ReactIntl$IntlProviderConfig = {
-    locale?: string,
-    formats?: Object,
-    messages?: { [id: string]: string },
-
-    defaultLocale?: string,
-    defaultFormats?: Object
-  };
-
-  declare type $npm$ReactIntl$IntlFormat = {
-    formatDate: (value: any, options?: Object) => string,
-    formatTime: (value: any, options?: Object) => string,
-    formatRelativeTime: (value: number, options?: $npm$ReactIntl$RelativeFormatOptions & {
-      format: string
-    }) => string,
-    formatNumber: (value: any, options?: Object) => string,
-    formatPlural: (value: any, options?: Object) => string,
-    formatMessage: (
-      messageDescriptor: $npm$ReactIntl$MessageDescriptor,
-      values?: Object
-    ) => string,
-    formatHTMLMessage: (
-      messageDescriptor: $npm$ReactIntl$MessageDescriptor,
-      values?: Object
-    ) => string
-  };
-
-  declare type $npm$ReactIntl$IntlShape = $npm$ReactIntl$IntlConfig &
-    $npm$ReactIntl$IntlFormat & { now: () => number };
-
-  declare type $npm$ReactIntl$DateTimeFormatOptions = {
-    localeMatcher?: "best fit" | "lookup",
-    formatMatcher?: "basic" | "best fit",
-
-    timeZone?: string,
-    hour12?: boolean,
-
-    weekday?: "narrow" | "short" | "long",
-    era?: "narrow" | "short" | "long",
-    year?: "numeric" | "2-digit",
-    month?: "numeric" | "2-digit" | "narrow" | "short" | "long",
-    day?: "numeric" | "2-digit",
-    hour?: "numeric" | "2-digit",
-    minute?: "numeric" | "2-digit",
-    second?: "numeric" | "2-digit",
-    timeZoneName?: "short" | "long"
-  };
-
-  declare type $npm$ReactIntl$RelativeFormatOptions = {
-    numeric?: "auto" | "always",
-    style?: "short" | "narrow" | "numeric",
-    unit?: "second" | "minute" | "hour" | "day" | "month" | "year"
-  };
-
-  declare type $npm$ReactIntl$NumberFormatOptions = {
-    localeMatcher?: "best fit" | "lookup",
-
-    style?: "decimal" | "currency" | "percent",
-
-    currency?: string,
-    currencyDisplay?: "symbol" | "code" | "name",
-
-    useGrouping?: boolean,
-
-    minimumIntegerDigits?: number,
-    minimumFractionDigits?: number,
-    maximumFractionDigits?: number,
-    minimumSignificantDigits?: number,
-    maximumSignificantDigits?: number
-  };
-
-  declare type $npm$ReactIntl$PluralFormatOptions = {
-    style?: "cardinal" | "ordinal"
-  };
-
-  declare type $npm$ReactIntl$PluralCategoryString =
-    | "zero"
-    | "one"
-    | "two"
-    | "few"
-    | "many"
-    | "other";
-
-  declare type $npm$ReactIntl$DateParseable = number | string | Date;
-  // PropType checker
-  declare function intlShape(
-    props: Object,
-    propName: string,
-    componentName: string
-  ): void;
-  declare function addLocaleData(
-    data: $npm$ReactIntl$LocaleData | Array<$npm$ReactIntl$LocaleData>
-  ): void;
-  declare function defineMessages<
-    T: { [key: string]: $Exact<$npm$ReactIntl$MessageDescriptor> }
-  >(
-    messageDescriptors: T
-  ): T;
-
-  declare type InjectIntlProvidedProps = {
-    intl: $npm$ReactIntl$IntlShape
-  }
-
-  declare type InjectIntlVoidProps = {
-    intl: $npm$ReactIntl$IntlShape | void
-  }
-
-  declare type ComponentWithDefaultProps<DefaultProps: {}, Props: {}> =
-    | React$ComponentType<Props>
-    | React$StatelessFunctionalComponent<Props>
-    | ChildrenArray<void | null | boolean | string | number | Element<any>>;
-
-  declare type InjectIntlOptions = {
-    intlPropName?: string,
-    withRef?: boolean
-  }
-
-  declare class IntlInjectedComponent<TOwnProps, TDefaultProps> extends React$Component<TOwnProps> {
-    static WrappedComponent: Class<React$Component<TOwnProps & InjectIntlProvidedProps>>,
-    static defaultProps: TDefaultProps,
-    props: TOwnProps
-  }
-
-  declare type IntlInjectedComponentClass<TOwnProps, TDefaultProps: {} = {}> = Class<
-    IntlInjectedComponent<TOwnProps, TDefaultProps>
-  >;
-
-  declare function injectIntl<P: {}, Component: React$ComponentType<P>>(
-    WrappedComponent: Component,
-    options?: InjectIntlOptions,
-  ): React$ComponentType<
-    $Diff<React$ElementConfig<Component>, InjectIntlVoidProps>
-  >;
-
-  declare type IntlCache = any;
-
-  declare function createIntlCache(): IntlCache;
-
-  declare function createIntl(options: {
-    locale: string,
-    messages?: {[key: string]: string}
-  }, cache?: IntlCache): IntlShape;
-
-  declare function formatMessage(
-    messageDescriptor: $npm$ReactIntl$MessageDescriptor,
-    values?: Object
-  ): string;
-  declare function formatHTMLMessage(
-    messageDescriptor: $npm$ReactIntl$MessageDescriptor,
-    values?: Object
-  ): string;
-  declare function formatDate(
-    value: any,
-    options?: $npm$ReactIntl$DateTimeFormatOptions & { format: string }
-  ): string;
-  declare function formatTime(
-    value: any,
-    options?: $npm$ReactIntl$DateTimeFormatOptions & { format: string }
-  ): string;
-  declare function formatRelativeTime(
-    value: number, // delta
-    options?: $npm$ReactIntl$RelativeFormatOptions & {
-      format: string
-    }
-  ): string;
-  declare function formatNumber(
-    value: any,
-    options?: $npm$ReactIntl$NumberFormatOptions & { format: string }
-  ): string;
-  declare function formatPlural(
-    value: any,
-    options?: $npm$ReactIntl$PluralFormatOptions
-  ): $npm$ReactIntl$PluralCategoryString;
-
-  declare class FormattedMessage extends React$Component<
-    $npm$ReactIntl$MessageDescriptor & {
-      values?: Object,
-      tagName?: string,
-      children?:
-        | ((...formattedMessage: Array<React$Node>) => React$Node)
-        | (string => React$Node)
-    }
-  > {}
-  declare class FormattedHTMLMessage extends React$Component<
-    $npm$ReactIntl$DateTimeFormatOptions & {
-      values?: Object,
-      tagName?: string,
-      children?: (...formattedMessage: Array<React$Node>) => React$Node
-    }
-  > {}
-  declare class FormattedDate extends React$Component<
-    $npm$ReactIntl$DateTimeFormatOptions & {
-      value: $npm$ReactIntl$DateParseable,
-      format?: string,
-      children?: (formattedDate: string) => React$Node
-    }
-  > {}
-  declare class FormattedTime extends React$Component<
-    $npm$ReactIntl$DateTimeFormatOptions & {
-      value: $npm$ReactIntl$DateParseable,
-      format?: string,
-      children?: (formattedDate: string) => React$Node
-    }
-  > {}
-  declare class FormattedRelativeTime extends React$Component<
-    $npm$ReactIntl$RelativeFormatOptions & {
-      value: number, // delta
-      format?: string,
-      updateIntervalInSeconds?: number,
-      children?: (formattedDate: string) => React$Node
-    }
-  > {}
-  declare class FormattedNumber extends React$Component<
-    $npm$ReactIntl$NumberFormatOptions & {
-      value: number | string,
-      format?: string,
-      children?: (formattedNumber: string) => React$Node
-    }
-  > {}
-  declare class FormattedPlural extends React$Component<
-    $npm$ReactIntl$PluralFormatOptions & {
-      value: number | string,
-      other: React$Node,
-      zero?: React$Node,
-      one?: React$Node,
-      two?: React$Node,
-      few?: React$Node,
-      many?: React$Node,
-      children?: (formattedPlural: React$Node) => React$Node
-    }
-  > {}
-  declare class IntlProvider extends React$Component<
-    $npm$ReactIntl$IntlProviderConfig & {
-      children?: React$Node,
-      initialNow?: $npm$ReactIntl$DateParseable
-    }
-  > {}
-  declare class RawIntlProvider extends React$Component<
-    {|
-      children?: React$Node,
-      value?: IntlShape
-    |}
-  > {}
-  declare type IntlShape = $npm$ReactIntl$IntlShape;
-  declare type MessageDescriptor = $npm$ReactIntl$MessageDescriptor;
-}
diff --git a/flow-typed/npm/react-motion_vx.x.x.js b/flow-typed/npm/react-motion_vx.x.x.js
deleted file mode 100644
index eb2876d..0000000
--- a/flow-typed/npm/react-motion_vx.x.x.js
+++ /dev/null
@@ -1,123 +0,0 @@
-// flow-typed signature: f7ed1ad96a453a021e6d98c1d144ef43
-// flow-typed version: <<STUB>>/react-motion_v0.5.x/flow_v0.53.1
-
-/**
- * This is an autogenerated libdef stub for:
- *
- *   'react-motion'
- *
- * Fill this stub out by replacing all the `any` types.
- *
- * Once filled out, we encourage you to share your work with the
- * community by sending a pull request to:
- * https://github.com/flowtype/flow-typed
- */
-
-declare module 'react-motion' {
-  declare module.exports: any;
-}
-
-/**
- * We include stubs for each file inside this npm package in case you need to
- * require those files directly. Feel free to delete any files that aren't
- * needed.
- */
-declare module 'react-motion/build/react-motion' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/mapToZero' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/mergeDiff' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/Motion' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/presets' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/react-motion' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/reorderKeys' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/shouldStopAnimation' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/spring' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/StaggeredMotion' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/stepper' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/stripStyle' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/TransitionMotion' {
-  declare module.exports: any;
-}
-
-declare module 'react-motion/lib/Types' {
-  declare module.exports: any;
-}
-
-// Filename aliases
-declare module 'react-motion/build/react-motion.js' {
-  declare module.exports: $Exports<'react-motion/build/react-motion'>;
-}
-declare module 'react-motion/lib/mapToZero.js' {
-  declare module.exports: $Exports<'react-motion/lib/mapToZero'>;
-}
-declare module 'react-motion/lib/mergeDiff.js' {
-  declare module.exports: $Exports<'react-motion/lib/mergeDiff'>;
-}
-declare module 'react-motion/lib/Motion.js' {
-  declare module.exports: $Exports<'react-motion/lib/Motion'>;
-}
-declare module 'react-motion/lib/presets.js' {
-  declare module.exports: $Exports<'react-motion/lib/presets'>;
-}
-declare module 'react-motion/lib/react-motion.js' {
-  declare module.exports: $Exports<'react-motion/lib/react-motion'>;
-}
-declare module 'react-motion/lib/reorderKeys.js' {
-  declare module.exports: $Exports<'react-motion/lib/reorderKeys'>;
-}
-declare module 'react-motion/lib/shouldStopAnimation.js' {
-  declare module.exports: $Exports<'react-motion/lib/shouldStopAnimation'>;
-}
-declare module 'react-motion/lib/spring.js' {
-  declare module.exports: $Exports<'react-motion/lib/spring'>;
-}
-declare module 'react-motion/lib/StaggeredMotion.js' {
-  declare module.exports: $Exports<'react-motion/lib/StaggeredMotion'>;
-}
-declare module 'react-motion/lib/stepper.js' {
-  declare module.exports: $Exports<'react-motion/lib/stepper'>;
-}
-declare module 'react-motion/lib/stripStyle.js' {
-  declare module.exports: $Exports<'react-motion/lib/stripStyle'>;
-}
-declare module 'react-motion/lib/TransitionMotion.js' {
-  declare module.exports: $Exports<'react-motion/lib/TransitionMotion'>;
-}
-declare module 'react-motion/lib/Types.js' {
-  declare module.exports: $Exports<'react-motion/lib/Types'>;
-}
diff --git a/flow-typed/npm/react-redux_v5.x.x.js b/flow-typed/npm/react-redux_v5.x.x.js
deleted file mode 100644
index eeeab17..0000000
--- a/flow-typed/npm/react-redux_v5.x.x.js
+++ /dev/null
@@ -1,276 +0,0 @@
-// flow-typed signature: f06f00c3ad0cfedb90c0c6de04b219f3
-// flow-typed version: 3a6d556e4b/react-redux_v5.x.x/flow_>=v0.89.x
-
-/**
-The order of type arguments for connect() is as follows:
-
-connect<Props, OwnProps, StateProps, DispatchProps, State, Dispatch>(…)
-
-In Flow v0.89 only the first two are mandatory to specify. Other 4 can be repaced with the new awesome type placeholder:
-
-connect<Props, OwnProps, _, _, _, _>(…)
-
-But beware, in case of weird type errors somewhere in random places
-just type everything and get to a green field and only then try to
-remove the definitions you see bogus.
-
-Decrypting the abbreviations:
-  WC = Component being wrapped
-  S = State
-  D = Dispatch
-  OP = OwnProps
-  SP = StateProps
-  DP = DispatchProps
-  MP = Merge props
-  RSP = Returned state props
-  RDP = Returned dispatch props
-  RMP = Returned merge props
-  CP = Props for returned component
-  Com = React Component
-  ST = Static properties of Com
-  EFO = Extra factory options (used only in connectAdvanced)
-*/
-
-declare module "react-redux" {
-  // ------------------------------------------------------------
-  // Typings for connect()
-  // ------------------------------------------------------------
-
-  declare export type Options<S, OP, SP, MP> = {|
-    pure?: boolean,
-    withRef?: boolean,
-    areStatesEqual?: (next: S, prev: S) => boolean,
-    areOwnPropsEqual?: (next: OP, prev: OP) => boolean,
-    areStatePropsEqual?: (next: SP, prev: SP) => boolean,
-    areMergedPropsEqual?: (next: MP, prev: MP) => boolean,
-    storeKey?: string,
-  |};
-
-  declare type MapStateToProps<-S, -OP, +SP> =
-    | ((state: S, ownProps: OP) => SP)
-    // If you want to use the factory function but get a strange error
-    // like "function is not an object" then just type the factory function
-    // like this:
-    // const factory: (State, OwnProps) => (State, OwnProps) => StateProps
-    // and provide the StateProps type to the SP type parameter.
-    | ((state: S, ownProps: OP) => (state: S, ownProps: OP) => SP);
-
-  declare type Bind<D> = <A, R>((...A) => R) => (...A) => $Call<D, R>;
-
-  declare type MapDispatchToPropsFn<D, -OP, +DP> =
-    | ((dispatch: D, ownProps: OP) => DP)
-    // If you want to use the factory function but get a strange error
-    // like "function is not an object" then just type the factory function
-    // like this:
-    // const factory: (Dispatch, OwnProps) => (Dispatch, OwnProps) => DispatchProps
-    // and provide the DispatchProps type to the DP type parameter.
-    | ((dispatch: D, ownProps: OP) => (dispatch: D, ownProps: OP) => DP);
-
-  declare class ConnectedComponent<OP, +WC> extends React$Component<OP> {
-    static +WrappedComponent: WC;
-    getWrappedInstance(): React$ElementRef<WC>;
-  }
-  // The connection of the Wrapped Component and the Connected Component
-  // happens here in `MP: P`. It means that type wise MP belongs to P,
-  // so to say MP >= P.
-  declare type Connector<P, OP, MP: P> = <WC: React$ComponentType<P>>(
-    WC,
-  ) => Class<ConnectedComponent<OP, WC>> & WC;
-
-  // No `mergeProps` argument
-
-  // Got error like inexact OwnProps is incompatible with exact object type?
-  // Just make the OP parameter for `connect()` an exact object.
-  declare type MergeOP<OP, D> = {| ...$Exact<OP>, dispatch: D |};
-  declare type MergeOPSP<OP, SP, D> = {| ...$Exact<OP>, ...SP, dispatch: D |};
-  declare type MergeOPDP<OP, DP> = {| ...$Exact<OP>, ...DP |};
-  declare type MergeOPSPDP<OP, SP, DP> = {| ...$Exact<OP>, ...SP, ...DP |};
-
-  declare export function connect<-P, -OP, -SP, -DP, -S, -D>(
-    mapStateToProps?: null | void,
-    mapDispatchToProps?: null | void,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, {||}, MergeOP<OP, D>>,
-  ): Connector<P, OP, MergeOP<OP, D>>;
-
-  declare export function connect<-P, -OP, -SP, -DP, -S, -D>(
-    // If you get error here try adding return type to your mapStateToProps function
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps?: null | void,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, SP, MergeOPSP<OP, SP, D>>,
-  ): Connector<P, OP, MergeOPSP<OP, SP, D>>;
-
-  // In this case DP is an object of functions which has been bound to dispatch
-  // by the given mapDispatchToProps function.
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    mapStateToProps: null | void,
-    mapDispatchToProps: MapDispatchToPropsFn<D, OP, DP>,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, {||}, MergeOPDP<OP, DP>>,
-  ): Connector<P, OP, MergeOPDP<OP, DP>>;
-
-  // In this case DP is an object of action creators not yet bound to dispatch,
-  // this difference is not important in the vanila redux,
-  // but in case of usage with redux-thunk, the return type may differ.
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    mapStateToProps: null | void,
-    mapDispatchToProps: DP,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, {||}, MergeOPDP<OP, DP>>,
-  ): Connector<P, OP, MergeOPDP<OP, $ObjMap<DP, Bind<D>>>>;
-
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    // If you get error here try adding return type to your mapStateToProps function
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps: MapDispatchToPropsFn<D, OP, DP>,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, SP, {| ...OP, ...SP, ...DP |}>,
-  ): Connector<P, OP, {| ...OP, ...SP, ...DP |}>;
-
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    // If you get error here try adding return type to your mapStateToProps function
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps: DP,
-    mergeProps?: null | void,
-    options?: ?Options<S, OP, SP, MergeOPSPDP<OP, SP, DP>>,
-  ): Connector<P, OP, MergeOPSPDP<OP, SP, $ObjMap<DP, Bind<D>>>>;
-
-  // With `mergeProps` argument
-
-  declare type MergeProps<+P, -OP, -SP, -DP> = (
-    stateProps: SP,
-    dispatchProps: DP,
-    ownProps: OP,
-  ) => P;
-
-  declare export function connect<-P, -OP, -SP: {||}, -DP: {||}, S, D>(
-    mapStateToProps: null | void,
-    mapDispatchToProps: null | void,
-    // If you get error here try adding return type to you mapStateToProps function
-    mergeProps: MergeProps<P, OP, {||}, {| dispatch: D |}>,
-    options?: ?Options<S, OP, {||}, P>,
-  ): Connector<P, OP, P>;
-
-  declare export function connect<-P, -OP, -SP, -DP: {||}, S, D>(
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps: null | void,
-    // If you get error here try adding return type to you mapStateToProps function
-    mergeProps: MergeProps<P, OP, SP, {| dispatch: D |}>,
-    options?: ?Options<S, OP, SP, P>,
-  ): Connector<P, OP, P>;
-
-  // In this case DP is an object of functions which has been bound to dispatch
-  // by the given mapDispatchToProps function.
-  declare export function connect<-P, -OP, -SP: {||}, -DP, S, D>(
-    mapStateToProps: null | void,
-    mapDispatchToProps: MapDispatchToPropsFn<D, OP, DP>,
-    mergeProps: MergeProps<P, OP, {||}, DP>,
-    options?: ?Options<S, OP, {||}, P>,
-  ): Connector<P, OP, P>;
-
-  // In this case DP is an object of action creators not yet bound to dispatch,
-  // this difference is not important in the vanila redux,
-  // but in case of usage with redux-thunk, the return type may differ.
-  declare export function connect<-P, -OP, -SP: {||}, -DP, S, D>(
-    mapStateToProps: null | void,
-    mapDispatchToProps: DP,
-    mergeProps: MergeProps<P, OP, {||}, $ObjMap<DP, Bind<D>>>,
-    options?: ?Options<S, OP, {||}, P>,
-  ): Connector<P, OP, P>;
-
-  // In this case DP is an object of functions which has been bound to dispatch
-  // by the given mapDispatchToProps function.
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps: MapDispatchToPropsFn<D, OP, DP>,
-    mergeProps: MergeProps<P, OP, SP, DP>,
-    options?: ?Options<S, OP, SP, P>,
-  ): Connector<P, OP, P>;
-
-  // In this case DP is an object of action creators not yet bound to dispatch,
-  // this difference is not important in the vanila redux,
-  // but in case of usage with redux-thunk, the return type may differ.
-  declare export function connect<-P, -OP, -SP, -DP, S, D>(
-    mapStateToProps: MapStateToProps<S, OP, SP>,
-    mapDispatchToProps: DP,
-    mergeProps: MergeProps<P, OP, SP, $ObjMap<DP, Bind<D>>>,
-    options?: ?Options<S, OP, SP, P>,
-  ): Connector<P, OP, P>;
-
-  // ------------------------------------------------------------
-  // Typings for Provider
-  // ------------------------------------------------------------
-
-  declare export class Provider<Store> extends React$Component<{
-    store: Store,
-    children?: React$Node,
-  }> {}
-
-  declare export function createProvider(
-    storeKey?: string,
-    subKey?: string,
-  ): Class<Provider<*>>;
-
-  // ------------------------------------------------------------
-  // Typings for connectAdvanced()
-  // ------------------------------------------------------------
-
-  declare type ConnectAdvancedOptions = {
-    getDisplayName?: (name: string) => string,
-    methodName?: string,
-    renderCountProp?: string,
-    shouldHandleStateChanges?: boolean,
-    storeKey?: string,
-    withRef?: boolean,
-  };
-
-  declare type SelectorFactoryOptions<Com> = {
-    getDisplayName: (name: string) => string,
-    methodName: string,
-    renderCountProp: ?string,
-    shouldHandleStateChanges: boolean,
-    storeKey: string,
-    withRef: boolean,
-    displayName: string,
-    wrappedComponentName: string,
-    WrappedComponent: Com,
-  };
-
-  declare type MapStateToPropsEx<S: Object, SP: Object, RSP: Object> = (
-    state: S,
-    props: SP,
-  ) => RSP;
-
-  declare type SelectorFactory<
-    Com: React$ComponentType<*>,
-    Dispatch,
-    S: Object,
-    OP: Object,
-    EFO: Object,
-    CP: Object,
-  > = (
-    dispatch: Dispatch,
-    factoryOptions: SelectorFactoryOptions<Com> & EFO,
-  ) => MapStateToPropsEx<S, OP, CP>;
-
-  declare export function connectAdvanced<
-    Com: React$ComponentType<*>,
-    D,
-    S: Object,
-    OP: Object,
-    CP: Object,
-    EFO: Object,
-    ST: { [_: $Keys<Com>]: any },
-  >(
-    selectorFactory: SelectorFactory<Com, D, S, OP, EFO, CP>,
-    connectAdvancedOptions: ?(ConnectAdvancedOptions & EFO),
-  ): (component: Com) => React$ComponentType<OP> & $Shape<ST>;
-
-  declare export default {
-    Provider: typeof Provider,
-    createProvider: typeof createProvider,
-    connect: typeof connect,
-    connectAdvanced: typeof connectAdvanced,
-  };
-}
diff --git a/flow-typed/npm/react-router-dom_v5.x.x.js b/flow-typed/npm/react-router-dom_v5.x.x.js
deleted file mode 100644
index 048fc19..0000000
--- a/flow-typed/npm/react-router-dom_v5.x.x.js
+++ /dev/null
@@ -1,176 +0,0 @@
-// flow-typed signature: 9987f80c12a2cad7dfa2b08cc14d2edc
-// flow-typed version: 2973a15489/react-router-dom_v5.x.x/flow_>=v0.98.x
-
-declare module "react-router-dom" {
-  declare export var BrowserRouter: React$ComponentType<{|
-    basename?: string,
-    forceRefresh?: boolean,
-    getUserConfirmation?: GetUserConfirmation,
-    keyLength?: number,
-    children?: React$Node
-  |}>
-
-  declare export var HashRouter: React$ComponentType<{|
-    basename?: string,
-    getUserConfirmation?: GetUserConfirmation,
-    hashType?: "slash" | "noslash" | "hashbang",
-    children?: React$Node
-  |}>
-
-  declare export var Link: React$ComponentType<{
-    className?: string,
-    to: string | LocationShape,
-    replace?: boolean,
-    children?: React$Node
-  }>
-
-  declare export var NavLink: React$ComponentType<{
-    to: string | LocationShape,
-    activeClassName?: string,
-    className?: string,
-    activeStyle?: { +[string]: mixed },
-    style?: { +[string]: mixed },
-    isActive?: (match: Match, location: Location) => boolean,
-    children?: React$Node,
-    exact?: boolean,
-    strict?: boolean
-  }>
-
-  // NOTE: Below are duplicated from react-router. If updating these, please
-  // update the react-router and react-router-native types as well.
-  declare export type Location = {
-    pathname: string,
-    search: string,
-    hash: string,
-    state?: any,
-    key?: string
-  };
-
-  declare export type LocationShape = {
-    pathname?: string,
-    search?: string,
-    hash?: string,
-    state?: any
-  };
-
-  declare export type HistoryAction = "PUSH" | "REPLACE" | "POP";
-
-  declare export type RouterHistory = {
-    length: number,
-    location: Location,
-    action: HistoryAction,
-    listen(
-      callback: (location: Location, action: HistoryAction) => void
-    ): () => void,
-    push(path: string | LocationShape, state?: any): void,
-    replace(path: string | LocationShape, state?: any): void,
-    go(n: number): void,
-    goBack(): void,
-    goForward(): void,
-    canGo?: (n: number) => boolean,
-    block(
-      callback: string | (location: Location, action: HistoryAction) => ?string
-    ): () => void,
-    // createMemoryHistory
-    index?: number,
-    entries?: Array<Location>
-  };
-
-  declare export type Match = {
-    params: { [key: string]: ?string },
-    isExact: boolean,
-    path: string,
-    url: string
-  };
-
-  declare export type ContextRouter = {|
-    history: RouterHistory,
-    location: Location,
-    match: Match,
-    staticContext?: StaticRouterContext
-  |};
-
-  declare type ContextRouterVoid = {
-    history: RouterHistory | void,
-    location: Location | void,
-    match: Match | void,
-    staticContext?: StaticRouterContext | void
-  };
-
-  declare export type GetUserConfirmation = (
-    message: string,
-    callback: (confirmed: boolean) => void
-  ) => void;
-
-  declare export type StaticRouterContext = {
-    url?: string
-  };
-
-  declare export var StaticRouter: React$ComponentType<{|
-    basename?: string,
-    location?: string | Location,
-    context: StaticRouterContext,
-    children?: React$Node
-  |}>
-
-  declare export var MemoryRouter: React$ComponentType<{|
-    initialEntries?: Array<LocationShape | string>,
-    initialIndex?: number,
-    getUserConfirmation?: GetUserConfirmation,
-    keyLength?: number,
-    children?: React$Node
-  |}>
-
-  declare export var Router: React$ComponentType<{|
-    history: RouterHistory,
-    children?: React$Node
-  |}>
-
-  declare export var Prompt: React$ComponentType<{|
-    message: string | ((location: Location) => string | boolean),
-    when?: boolean
-  |}>
-
-  declare export var Redirect: React$ComponentType<{|
-    to: string | LocationShape,
-    push?: boolean,
-    from?: string,
-    exact?: boolean,
-    strict?: boolean
-  |}>
-
-  declare export var Route: React$ComponentType<{|
-    component?: React$ComponentType<*>,
-    render?: (router: ContextRouter) => React$Node,
-    children?: React$ComponentType<ContextRouter> | React$Node,
-    path?: string | Array<string>,
-    exact?: boolean,
-    strict?: boolean,
-    location?: LocationShape,
-    sensitive?: boolean
-  |}>
-
-  declare export var Switch: React$ComponentType<{|
-    children?: React$Node,
-    location?: Location
-  |}>
-
-  declare export function withRouter<Props: {}, Component: React$ComponentType<Props>>(
-    WrappedComponent: Component
-  ): React$ComponentType<$Diff<React$ElementConfig<Component>, ContextRouterVoid>>;
-
-  declare type MatchPathOptions = {
-    path?: string,
-    exact?: boolean,
-    sensitive?: boolean,
-    strict?: boolean
-  };
-
-  declare export function matchPath(
-    pathname: string,
-    options?: MatchPathOptions | string,
-    parent?: Match
-  ): null | Match;
-
-  declare export function generatePath(pattern?: string, params?: { +[string]: mixed }): string;
-}
diff --git a/flow-typed/npm/redux_v4.x.x.js b/flow-typed/npm/redux_v4.x.x.js
deleted file mode 100644
index 2ba2c8b..0000000
--- a/flow-typed/npm/redux_v4.x.x.js
+++ /dev/null
@@ -1,100 +0,0 @@
-// flow-typed signature: a49a6c96fe8a8bb3330cce2028588f4c
-// flow-typed version: de5b3a01c6/redux_v4.x.x/flow_>=v0.89.x
-
-declare module 'redux' {
-  /*
-
-    S = State
-    A = Action
-    D = Dispatch
-
-  */
-
-  declare export type Action<T> = {
-    type: T
-  }
-
-  declare export type DispatchAPI<A> = (action: A) => A;
-
-  declare export type Dispatch<A: { type: * }> = DispatchAPI<A>;
-
-  declare export type MiddlewareAPI<S, A, D = Dispatch<A>> = {
-    dispatch: D,
-    getState(): S,
-  };
-
-  declare export type Store<S, A, D = Dispatch<A>> = {
-    // rewrite MiddlewareAPI members in order to get nicer error messages (intersections produce long messages)
-    dispatch: D,
-    getState(): S,
-    subscribe(listener: () => void): () => void,
-    replaceReducer(nextReducer: Reducer<S, A>): void,
-  };
-
-  declare export type Reducer<S, A> = (state: S | void, action: A) => S;
-
-  declare export type CombinedReducer<S, A> = (
-    state: ($Shape<S> & {}) | void,
-    action: A
-  ) => S;
-
-  declare export type Middleware<S, A, D = Dispatch<A>> = (
-    api: MiddlewareAPI<S, A, D>
-  ) => (next: D) => D;
-
-  declare export type StoreCreator<S, A, D = Dispatch<A>> = {
-    (reducer: Reducer<S, A>, enhancer?: StoreEnhancer<S, A, D>): Store<S, A, D>,
-    (
-      reducer: Reducer<S, A>,
-      preloadedState: S,
-      enhancer?: StoreEnhancer<S, A, D>
-    ): Store<S, A, D>,
-  };
-
-  declare export type StoreEnhancer<S, A, D = Dispatch<A>> = (
-    next: StoreCreator<S, A, D>
-  ) => StoreCreator<S, A, D>;
-
-  declare export function createStore<S, A, D>(
-    reducer: Reducer<S, A>,
-    enhancer?: StoreEnhancer<S, A, D>
-  ): Store<S, A, D>;
-  declare export function createStore<S, A, D>(
-    reducer: Reducer<S, A>,
-    preloadedState?: S,
-    enhancer?: StoreEnhancer<S, A, D>
-  ): Store<S, A, D>;
-
-  declare export function applyMiddleware<S, A, D>(
-    ...middlewares: Array<Middleware<S, A, D>>
-  ): StoreEnhancer<S, A, D>;
-
-  declare export type ActionCreator<A, B> = (...args: Array<B>) => A;
-  declare export type ActionCreators<K, A> = {
-    [key: K]: ActionCreator<A, any>,
-  };
-
-  declare export function bindActionCreators<
-    A,
-    C: ActionCreator<A, any>,
-    D: DispatchAPI<A>
-  >(
-    actionCreator: C,
-    dispatch: D
-  ): C;
-  declare export function bindActionCreators<
-    A,
-    K,
-    C: ActionCreators<K, A>,
-    D: DispatchAPI<A>
-  >(
-    actionCreators: C,
-    dispatch: D
-  ): C;
-
-  declare export function combineReducers<O: {}, A>(
-    reducers: O
-  ): CombinedReducer<$ObjMap<O, <S>(r: Reducer<S, any>) => S>, A>;
-
-  declare export var compose: $Compose;
-}
diff --git a/jest/__mocks__/intlMock.js b/jest/__mocks__/intlMock.js
index 77e9e1c..733a57f 100644
--- a/jest/__mocks__/intlMock.js
+++ b/jest/__mocks__/intlMock.js
@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 const path = require('path');
 const { transform } = require('../../webpack-utils/intl-loader');
@@ -11,7 +13,6 @@ module.exports = {
    *
    * @returns {string}
    */
-  // eslint-disable-next-line no-unused-vars
   process(src, filename, config, options) {
     return transform(src, filename, path.resolve(`${__dirname}/../../..`));
   },
diff --git a/package.json b/package.json
index b65551d..009874f 100644
--- a/package.json
+++ b/package.json
@@ -34,8 +34,8 @@
     "lint:check": "eslint --quiet .",
     "prettier": "prettier --write \"{src/**/*,scripts/**/*,tests-e2e/**/*,webpack-utils/**/*,jest/**/*,config/**/*,*}.{js,ts,tsx,json,md,scss,css}\"",
     "prettier:check": "prettier --check \"{src/**/*,scripts/**/*,tests-e2e/**/*,webpack-utils/**/*,jest/**/*,config/**/*,*}.{js,ts,tsx,json,md,scss,css}\"",
-    "flow:check": "flow",
-    "ci:check": "yarn lint:check && yarn flow:check && yarn test",
+    "ts:check": "tsc",
+    "ci:check": "yarn lint:check && yarn ts:check && yarn test",
     "analyze": "yarn run clean && yarn run build:webpack --analyze",
     "i18n:collect": "babel-node ./scripts/i18n-collect.js",
     "i18n:push": "babel-node ./scripts/i18n-crowdin.js push",
@@ -90,6 +90,8 @@
     "@formatjs/intl-pluralrules": "^1.3.7",
     "@formatjs/intl-relativetimeformat": "^4.4.6",
     "@hot-loader/react-dom": "^16.11.0",
+    "@types/react-redux": "^7.1.5",
+    "@types/react-router-dom": "^5.1.3",
     "classnames": "^2.2.6",
     "copy-to-clipboard": "^3.0.8",
     "debounce": "^1.0.0",
@@ -138,10 +140,13 @@
     "@babel/plugin-syntax-import-meta": "^7.7.4",
     "@babel/plugin-transform-runtime": "^7.7.4",
     "@babel/preset-env": "^7.7.4",
-    "@babel/preset-flow": "^7.7.4",
     "@babel/preset-react": "^7.7.4",
+    "@babel/preset-typescript": "^7.7.4",
     "@babel/runtime-corejs3": "^7.7.4",
-    "babel-eslint": "^10.0.3",
+    "@types/jest": "^24.0.23",
+    "@types/webpack-env": "^1.14.1",
+    "@typescript-eslint/eslint-plugin": "^2.9.0",
+    "@typescript-eslint/parser": "^2.9.0",
     "babel-loader": "^8.0.0",
     "babel-plugin-react-intl": "^5.1.8",
     "core-js": "3.4.3",
@@ -154,13 +159,11 @@
     "enzyme-adapter-react-16": "^1.15.1",
     "eslint": "^6.7.1",
     "eslint-config-prettier": "^6.7.0",
-    "eslint-plugin-flowtype": "^4.5.2",
     "eslint-plugin-jsdoc": "^18.1.5",
     "eslint-plugin-prettier": "^3.1.1",
     "eslint-plugin-react": "^7.16.0",
     "exports-loader": "^0.7.0",
     "file-loader": "^4.2.0",
-    "flow-bin": "~0.102.0",
     "html-loader": "^0.5.5",
     "html-webpack-plugin": "^3.2.0",
     "husky": "^3.1.0",
@@ -184,6 +187,7 @@
     "sitemap-webpack-plugin": "^0.6.0",
     "speed-measure-webpack-plugin": "^1.3.1",
     "style-loader": "^1.0.0",
+    "typescript": "^3.7.2",
     "unexpected": "^11.8.1",
     "unexpected-sinon": "^10.5.1",
     "url-loader": "^2.2.0",
diff --git a/postcss.config.js b/postcss.config.js
index 58deefe..3d8d4d8 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 const path = require('path');
 const loaderUtils = require('loader-utils');
diff --git a/scripts/build-dll.js b/scripts/build-dll.js
index 57b3a22..71afbb8 100644
--- a/scripts/build-dll.js
+++ b/scripts/build-dll.js
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 /* eslint-disable no-console */
 
diff --git a/scripts/i18n-collect.js b/scripts/i18n-collect.ts
similarity index 89%
rename from scripts/i18n-collect.js
rename to scripts/i18n-collect.ts
index 4349129..a2befc4 100644
--- a/scripts/i18n-collect.js
+++ b/scripts/i18n-collect.ts
@@ -6,7 +6,7 @@ import { sync as mkdirpSync } from 'mkdirp';
 import chalk from 'chalk';
 import prompt from 'prompt';
 
-import localesMap from './../src/i18n/index.json';
+import localesMap from './../src/i18n';
 
 const MESSAGES_PATTERN = `${__dirname}/../dist/messages/**/*.json`;
 const LANG_DIR = `${__dirname}/../src/i18n`;
@@ -19,8 +19,8 @@ const SUPPORTED_LANGS = [DEFAULT_LOCALE, ...Object.keys(localesMap)];
  * there are messages in different components that use the same `id`. The result
  * is a flat collection of `id: message` pairs for the app's default locale.
  */
-let idToFileMap = {};
-let duplicateIds = [];
+let idToFileMap: { [key: string]: string[] } = {};
+let duplicateIds: string[] = [];
 const collectedMessages = globSync(MESSAGES_PATTERN)
   .map(filename => [filename, JSON.parse(fs.readFileSync(filename, 'utf8'))])
   .reduce((collection, [file, descriptors]) => {
@@ -42,23 +42,24 @@ if (duplicateIds.length) {
     console.log(`${chalk.yellow(id)}:\n - ${idToFileMap[id].join('\n - ')}\n`),
   );
   console.log(chalk.red('Please correct the errors above to proceed further!'));
-  process.exit();
+
+  process.exit(1);
 }
 
-duplicateIds = null;
-idToFileMap = null;
+duplicateIds = [];
+idToFileMap = {};
 
 /**
  * Making a diff with the previous DEFAULT_LOCALE version
  */
 const defaultMessagesPath = `${LANG_DIR}/${DEFAULT_LOCALE}.json`;
-let keysToUpdate = [];
-let keysToAdd = [];
-let keysToRemove = [];
-const keysToRename = [];
-const isNotMarked = value => value.slice(0, 2) !== '--';
+let keysToUpdate: string[] = [];
+let keysToAdd: string[] = [];
+let keysToRemove: string[] = [];
+const keysToRename: Array<[string, string]> = [];
+const isNotMarked = (value: string) => value.slice(0, 2) !== '--';
 
-const prevMessages = readJSON(defaultMessagesPath);
+const prevMessages: { [key: string]: string } = readJSON(defaultMessagesPath);
 const prevMessagesMap = Object.entries(prevMessages).reduce(
   (acc, [key, value]) => {
     if (acc[value]) {
@@ -69,8 +70,9 @@ const prevMessagesMap = Object.entries(prevMessages).reduce(
 
     return acc;
   },
-  {},
+  {} as { [key: string]: string[] },
 );
+
 keysToAdd = Object.keys(collectedMessages).filter(key => !prevMessages[key]);
 keysToRemove = Object.keys(prevMessages)
   .filter(key => !collectedMessages[key])
@@ -80,13 +82,13 @@ keysToUpdate = Object.entries(prevMessages).reduce(
     acc.concat(
       collectedMessages[key] && collectedMessages[key] !== message ? key : [],
     ),
-  [],
+  [] as string[],
 );
 
 // detect keys to rename, mutating keysToAdd and keysToRemove
-[].concat(keysToAdd).forEach(toKey => {
+[...keysToAdd].forEach(toKey => {
   const keys = prevMessagesMap[collectedMessages[toKey]] || [];
-  const fromKey = keys.find(fromKey => keysToRemove.indexOf(fromKey) > -1);
+  const fromKey = keys.find(key => keysToRemove.indexOf(key) > -1);
 
   if (fromKey) {
     keysToRename.push([fromKey, toKey]);
diff --git a/scripts/i18n-crowdin.js b/scripts/i18n-crowdin.ts
similarity index 86%
rename from scripts/i18n-crowdin.js
rename to scripts/i18n-crowdin.ts
index b9f0efd..9cd07b3 100644
--- a/scripts/i18n-crowdin.js
+++ b/scripts/i18n-crowdin.ts
@@ -1,4 +1,3 @@
-// @flow
 /* eslint-env node */
 /* eslint-disable no-console */
 
@@ -22,7 +21,7 @@ const PROJECT_KEY = config.crowdinApiKey;
 const CROWDIN_FILE_PATH = 'accounts/site.json';
 const SOURCE_LANG = 'en';
 const LANG_DIR = path.resolve(`${__dirname}/../src/i18n`);
-const INDEX_FILE_NAME = 'index.json';
+const INDEX_FILE_NAME = 'index.js';
 const MIN_RELEASE_PROGRESS = 80; // Minimal ready percent before translation can be published
 
 const crowdin = new CrowdinApi({ apiKey: PROJECT_KEY });
@@ -81,8 +80,13 @@ function toInternalLocale(code: string): string {
  * @param {object} translates
  * @returns {string}
  */
-function serializeToFormattedJson(translates: Object): string {
-  return JSON.stringify(sortByKeys(translates), null, 4) + '\n'; // eslint-disable-line prefer-template
+function serializeToFormattedJson(
+  translates: { [key: string]: any },
+  { asModule = false }: { asModule?: boolean } = {},
+): string {
+  const src = JSON.stringify(sortByKeys(translates), null, 2);
+
+  return asModule ? `module.exports = ${src};\n` : `${src}\n`;
 }
 
 /**
@@ -91,7 +95,7 @@ function serializeToFormattedJson(translates: Object): string {
  * @param {object} object
  * @returns {object}
  */
-function sortByKeys(object: Object): Object {
+function sortByKeys(object: { [key: string]: any }): { [key: string]: any } {
   return Object.keys(object)
     .sort()
     .reduce((result, key) => {
@@ -121,32 +125,32 @@ interface ProjectInfoDirectory {
 interface ProjectInfoResponse {
   details: {
     source_language: {
-      name: string,
-      code: string,
-    },
-    name: string,
-    identifier: string,
-    created: string,
-    description: string,
-    join_policy: string,
-    last_build: string | null,
-    last_activity: string,
-    participants_count: string, // it's number, but string in the response
-    logo_url: string | null,
-    total_strings_count: string, // it's number, but string in the response
-    total_words_count: string, // it's number, but string in the response
-    duplicate_strings_count: number,
-    duplicate_words_count: number,
+      name: string;
+      code: string;
+    };
+    name: string;
+    identifier: string;
+    created: string;
+    description: string;
+    join_policy: string;
+    last_build: string | null;
+    last_activity: string;
+    participants_count: string; // it's number, but string in the response
+    logo_url: string | null;
+    total_strings_count: string; // it's number, but string in the response
+    total_words_count: string; // it's number, but string in the response
+    duplicate_strings_count: number;
+    duplicate_words_count: number;
     invite_url: {
-      translator: string,
-      proofreader: string,
-    },
+      translator: string;
+      proofreader: string;
+    };
   };
   languages: Array<{
-    name: string, // English language name
-    code: string,
-    can_translate: 0 | 1,
-    can_approve: 0 | 1,
+    name: string; // English language name
+    code: string;
+    can_translate: 0 | 1;
+    can_approve: 0 | 1;
   }>;
   files: Array<ProjectInfoFile | ProjectInfoDirectory>;
 }
@@ -277,7 +281,7 @@ async function pull() {
 
   console.log('Locales are downloaded. Writing them to file system.');
 
-  const indexFileEntries: { [string]: IndexFileEntry } = {
+  const indexFileEntries: { [key: string]: IndexFileEntry } = {
     en: {
       code: 'en',
       name: 'English',
@@ -286,7 +290,6 @@ async function pull() {
       isReleased: true,
     },
   };
-  // $FlowFixMe
   await Promise.all(
     results.map(
       result =>
@@ -328,7 +331,7 @@ async function pull() {
 
   fs.writeFileSync(
     path.join(LANG_DIR, INDEX_FILE_NAME),
-    serializeToFormattedJson(indexFileEntries),
+    serializeToFormattedJson(indexFileEntries, { asModule: true }),
   );
 
   console.log(ch.green('The index file was successfully written'));
@@ -364,7 +367,7 @@ function push() {
             [CROWDIN_FILE_PATH]: path.join(LANG_DIR, `${SOURCE_LANG}.json`),
           },
           {
-            // eslint-disable-next-line camelcase
+            // eslint-disable-next-line @typescript-eslint/camelcase
             update_option: disapprove
               ? 'update_as_unapproved'
               : 'update_without_changes',
diff --git a/src/App.js b/src/App.tsx
similarity index 87%
rename from src/App.js
rename to src/App.tsx
index 3ba4a64..830cc2c 100644
--- a/src/App.js
+++ b/src/App.tsx
@@ -1,14 +1,20 @@
-// @flow
 import React from 'react';
 import { hot } from 'react-hot-loader/root';
 import { Provider as ReduxProvider } from 'react-redux';
 import { Router, Route, Switch } from 'react-router-dom';
 import { IntlProvider } from 'components/i18n';
+import { Store } from 'redux';
 import AuthFlowRoute from 'containers/AuthFlowRoute';
 import RootPage from 'pages/root/RootPage';
 import SuccessOauthPage from 'pages/auth/SuccessOauthPage';
 
-const App = ({ store, browserHistory }) => (
+const App = ({
+  store,
+  browserHistory,
+}: {
+  store: Store;
+  browserHistory: any;
+}) => (
   <ReduxProvider store={store}>
     <IntlProvider>
       <Router history={browserHistory}>
diff --git a/src/components/MeasureHeight.js b/src/components/MeasureHeight.tsx
similarity index 78%
rename from src/components/MeasureHeight.js
rename to src/components/MeasureHeight.tsx
index 6de4bbd..bf55a6f 100644
--- a/src/components/MeasureHeight.js
+++ b/src/components/MeasureHeight.tsx
@@ -1,6 +1,4 @@
-// @flow
-import React, { PureComponent } from 'react';
-
+import React from 'react';
 import { omit, debounce } from 'functions';
 
 /**
@@ -23,20 +21,22 @@ import { omit, debounce } from 'functions';
  * </MeasureHeight>
  */
 
-type ChildState = mixed;
+type ChildState = any;
 
-export default class MeasureHeight extends PureComponent<{
-  shouldMeasure: (prevState: ChildState, newState: ChildState) => boolean,
-  onMeasure: (height: number) => void,
-  state: ChildState,
-}> {
+export default class MeasureHeight extends React.PureComponent<
+  {
+    shouldMeasure: (prevState: ChildState, newState: ChildState) => boolean;
+    onMeasure: (height: number) => void;
+    state: ChildState;
+  } & React.HTMLAttributes<HTMLDivElement>
+> {
   static defaultProps = {
     shouldMeasure: (prevState: ChildState, newState: ChildState) =>
       prevState !== newState,
-    onMeasure: (height: number) => {}, // eslint-disable-line
+    onMeasure: () => {},
   };
 
-  el: ?HTMLDivElement;
+  el: HTMLDivElement | null = null;
 
   componentDidMount() {
     // we want to measure height immediately on first mount to avoid ui laggs
@@ -55,11 +55,7 @@ export default class MeasureHeight extends PureComponent<{
   }
 
   render() {
-    const props: Object = omit(this.props, [
-      'shouldMeasure',
-      'onMeasure',
-      'state',
-    ]);
+    const props = omit(this.props, ['shouldMeasure', 'onMeasure', 'state']);
 
     return <div {...props} ref={(el: HTMLDivElement) => (this.el = el)} />;
   }
diff --git a/src/components/accounts/AccountSwitcher.js b/src/components/accounts/AccountSwitcher.tsx
similarity index 80%
rename from src/components/accounts/AccountSwitcher.js
rename to src/components/accounts/AccountSwitcher.tsx
index a34e1d3..b6389d8 100644
--- a/src/components/accounts/AccountSwitcher.js
+++ b/src/components/accounts/AccountSwitcher.tsx
@@ -1,34 +1,37 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
+import React from 'react';
 import { connect } from 'react-redux';
 import classNames from 'classnames';
 import { Link } from 'react-router-dom';
 import { FormattedMessage as Message } from 'react-intl';
 import loader from 'services/loader';
-import { skins, SKIN_DARK, COLOR_WHITE } from 'components/ui';
+import { SKIN_DARK, COLOR_WHITE, Skin } from 'components/ui';
 import { Button } from 'components/ui/form';
 import { authenticate, revoke } from 'components/accounts/actions';
-import { getActiveAccount } from 'components/accounts/reducer';
+import { getActiveAccount, Account } from 'components/accounts/reducer';
+import { RootState } from 'reducers';
 
 import styles from './accountSwitcher.scss';
 import messages from './AccountSwitcher.intl.json';
 
-export class AccountSwitcher extends Component {
-  static displayName = 'AccountSwitcher';
+interface Props {
+  switchAccount: (account: Account) => Promise<Account>;
+  removeAccount: (account: Account) => Promise<void>;
+  // called after each action performed
+  onAfterAction: () => void;
+  // called after switching an account. The active account will be passed as arg
+  onSwitch: (account: Account) => void;
+  accounts: RootState['accounts'];
+  skin: Skin;
+  // whether active account should be expanded and shown on the top
+  highlightActiveAccount: boolean;
+  // whether to show logout icon near each account
+  allowLogout: boolean;
+  // whether to show add account button
+  allowAdd: boolean;
+}
 
-  static propTypes = {
-    switchAccount: PropTypes.func.isRequired,
-    removeAccount: PropTypes.func.isRequired,
-    onAfterAction: PropTypes.func, // called after each action performed
-    onSwitch: PropTypes.func, // called after switching an account. The active account will be passed as arg
-    accounts: PropTypes.object, // eslint-disable-line
-    skin: PropTypes.oneOf(skins),
-    highlightActiveAccount: PropTypes.bool, // whether active account should be expanded and shown on the top
-    allowLogout: PropTypes.bool, // whether to show logout icon near each account
-    allowAdd: PropTypes.bool, // whether to show add account button
-  };
-
-  static defaultProps = {
+export class AccountSwitcher extends React.Component<Props> {
+  static defaultProps: Partial<Props> = {
     skin: SKIN_DARK,
     highlightActiveAccount: true,
     allowLogout: true,
@@ -47,6 +50,10 @@ export class AccountSwitcher extends Component {
     } = this.props;
     const activeAccount = getActiveAccount({ accounts });
 
+    if (!activeAccount) {
+      throw new Error('Can not find active account');
+    }
+
     let { available } = accounts;
 
     if (highlightActiveAccount) {
@@ -157,7 +164,7 @@ export class AccountSwitcher extends Component {
     );
   }
 
-  onSwitch = account => event => {
+  onSwitch = (account: Account) => (event: React.MouseEvent) => {
     event.preventDefault();
 
     loader.show();
@@ -172,7 +179,7 @@ export class AccountSwitcher extends Component {
       .finally(() => loader.hide());
   };
 
-  onRemove = account => event => {
+  onRemove = (account: Account) => (event: React.MouseEvent) => {
     event.preventDefault();
     event.stopPropagation();
 
@@ -181,7 +188,7 @@ export class AccountSwitcher extends Component {
 }
 
 export default connect(
-  ({ accounts }) => ({
+  ({ accounts }: RootState) => ({
     accounts,
   }),
   {
diff --git a/src/components/accounts/actions.test.js b/src/components/accounts/actions.test.ts
similarity index 77%
rename from src/components/accounts/actions.test.js
rename to src/components/accounts/actions.test.ts
index 01cea29..72ab522 100644
--- a/src/components/accounts/actions.test.js
+++ b/src/components/accounts/actions.test.ts
@@ -1,8 +1,6 @@
 import expect from 'test/unexpected';
 import sinon from 'sinon';
-
 import { browserHistory } from 'services/history';
-
 import { InternalServerError } from 'services/request';
 import { sessionStorage } from 'services/localStorage';
 import * as authentication from 'services/api/authentication';
@@ -21,9 +19,11 @@ import {
   reset,
 } from 'components/accounts/actions/pure-actions';
 import { SET_LOCALE } from 'components/i18n/actions';
-
 import { updateUser, setUser } from 'components/user/actions';
 import { setLogin, setAccountSwitcher } from 'components/auth/actions';
+import { Dispatch, RootState } from 'reducers';
+
+import { Account } from './reducer';
 
 const token =
   'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJlbHl8MSJ9.pRJ7vakt2eIscjqwG__KhSxKb3qwGsdBBeDbBffJs_I';
@@ -46,8 +46,8 @@ const user = {
 };
 
 describe('components/accounts/actions', () => {
-  let dispatch;
-  let getState;
+  let dispatch: Dispatch;
+  let getState: () => RootState;
 
   beforeEach(() => {
     dispatch = sinon
@@ -55,7 +55,7 @@ describe('components/accounts/actions', () => {
       .named('store.dispatch');
     getState = sinon.stub().named('store.getState');
 
-    getState.returns({
+    (getState as any).returns({
       accounts: {
         available: [],
         active: null,
@@ -72,8 +72,8 @@ describe('components/accounts/actions', () => {
     sinon.stub(browserHistory, 'push').named('browserHistory.push');
     sinon.stub(authentication, 'logout').named('authentication.logout');
 
-    authentication.logout.returns(Promise.resolve());
-    authentication.validateToken.returns(
+    (authentication.logout as any).returns(Promise.resolve());
+    (authentication.validateToken as any).returns(
       Promise.resolve({
         token: account.token,
         refreshToken: account.refreshToken,
@@ -83,14 +83,14 @@ describe('components/accounts/actions', () => {
   });
 
   afterEach(() => {
-    authentication.validateToken.restore();
-    authentication.logout.restore();
-    browserHistory.push.restore();
+    (authentication.validateToken as any).restore();
+    (authentication.logout as any).restore();
+    (browserHistory.push as any).restore();
   });
 
   describe('#authenticate()', () => {
     it('should request user state using token', () =>
-      authenticate(account)(dispatch, getState).then(() =>
+      authenticate(account)(dispatch, getState, undefined).then(() =>
         expect(authentication.validateToken, 'to have a call satisfying', [
           account.id,
           account.token,
@@ -99,7 +99,11 @@ describe('components/accounts/actions', () => {
       ));
 
     it('should request user by extracting id from token', () =>
-      authenticate({ token })(dispatch, getState).then(() =>
+      authenticate({ token } as Account)(
+        dispatch,
+        getState,
+        undefined,
+      ).then(() =>
         expect(authentication.validateToken, 'to have a call satisfying', [
           1,
           token,
@@ -108,7 +112,11 @@ describe('components/accounts/actions', () => {
       ));
 
     it('should request user by extracting id from legacy token', () =>
-      authenticate({ token: legacyToken })(dispatch, getState).then(() =>
+      authenticate({ token: legacyToken } as Account)(
+        dispatch,
+        getState,
+        undefined,
+      ).then(() =>
         expect(authentication.validateToken, 'to have a call satisfying', [
           1,
           legacyToken,
@@ -117,39 +125,39 @@ describe('components/accounts/actions', () => {
       ));
 
     it(`dispatches ${ADD} action`, () =>
-      authenticate(account)(dispatch, getState).then(() =>
+      authenticate(account)(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'to have a call satisfying', [add(account)]),
       ));
 
     it(`dispatches ${ACTIVATE} action`, () =>
-      authenticate(account)(dispatch, getState).then(() =>
+      authenticate(account)(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'to have a call satisfying', [activate(account)]),
       ));
 
     it(`dispatches ${SET_LOCALE} action`, () =>
-      authenticate(account)(dispatch, getState).then(() =>
+      authenticate(account)(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'to have a call satisfying', [
           { type: SET_LOCALE, payload: { locale: 'be' } },
         ]),
       ));
 
     it('should update user state', () =>
-      authenticate(account)(dispatch, getState).then(() =>
+      authenticate(account)(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'to have a call satisfying', [
           updateUser({ ...user, isGuest: false }),
         ]),
       ));
 
     it('resolves with account', () =>
-      authenticate(account)(dispatch, getState).then(resp =>
+      authenticate(account)(dispatch, getState, undefined).then(resp =>
         expect(resp, 'to equal', account),
       ));
 
     it('rejects when bad auth data', () => {
-      authentication.validateToken.returns(Promise.reject({}));
+      (authentication.validateToken as any).returns(Promise.reject({}));
 
       return expect(
-        authenticate(account)(dispatch, getState),
+        authenticate(account)(dispatch, getState, undefined),
         'to be rejected',
       ).then(() => {
         expect(dispatch, 'to have a call satisfying', [
@@ -161,12 +169,12 @@ describe('components/accounts/actions', () => {
     });
 
     it('rejects when 5xx without logouting', () => {
-      const resp = new InternalServerError(null, { status: 500 });
+      const resp = new InternalServerError('500', { status: 500 });
 
-      authentication.validateToken.rejects(resp);
+      (authentication.validateToken as any).rejects(resp);
 
       return expect(
-        authenticate(account)(dispatch, getState),
+        authenticate(account)(dispatch, getState, undefined),
         'to be rejected with',
         resp,
       ).then(() =>
@@ -178,14 +186,14 @@ describe('components/accounts/actions', () => {
 
     it('marks user as stranger, if there is no refreshToken', () => {
       const expectedKey = `stranger${account.id}`;
-      authentication.validateToken.resolves({
+      (authentication.validateToken as any).resolves({
         token: account.token,
         user,
       });
 
       sessionStorage.removeItem(expectedKey);
 
-      return authenticate(account)(dispatch, getState).then(() => {
+      return authenticate(account)(dispatch, getState, undefined).then(() => {
         expect(sessionStorage.getItem(expectedKey), 'not to be null');
         sessionStorage.removeItem(expectedKey);
       });
@@ -193,7 +201,7 @@ describe('components/accounts/actions', () => {
 
     describe('when user authenticated during oauth', () => {
       beforeEach(() => {
-        getState.returns({
+        (getState as any).returns({
           accounts: {
             available: [],
             active: null,
@@ -209,7 +217,7 @@ describe('components/accounts/actions', () => {
       });
 
       it('should dispatch setAccountSwitcher', () =>
-        authenticate(account)(dispatch, getState).then(() =>
+        authenticate(account)(dispatch, getState, undefined).then(() =>
           expect(dispatch, 'to have a call satisfying', [
             setAccountSwitcher(false),
           ]),
@@ -218,7 +226,7 @@ describe('components/accounts/actions', () => {
 
     describe('when one account available', () => {
       beforeEach(() => {
-        getState.returns({
+        (getState as any).returns({
           accounts: {
             active: account.id,
             available: [account],
@@ -231,10 +239,12 @@ describe('components/accounts/actions', () => {
       });
 
       it('should activate account before auth api call', () => {
-        authentication.validateToken.returns(Promise.reject({ error: 'foo' }));
+        (authentication.validateToken as any).returns(
+          Promise.reject({ error: 'foo' }),
+        );
 
         return expect(
-          authenticate(account)(dispatch, getState),
+          authenticate(account)(dispatch, getState, undefined),
           'to be rejected with',
           { error: 'foo' },
         ).then(() =>
@@ -247,7 +257,7 @@ describe('components/accounts/actions', () => {
   describe('#revoke()', () => {
     describe('when one account available', () => {
       beforeEach(() => {
-        getState.returns({
+        (getState as any).returns({
           accounts: {
             active: account.id,
             available: [account],
@@ -260,19 +270,19 @@ describe('components/accounts/actions', () => {
       });
 
       it('should dispatch reset action', () =>
-        revoke(account)(dispatch, getState).then(() =>
+        revoke(account)(dispatch, getState, undefined).then(() =>
           expect(dispatch, 'to have a call satisfying', [reset()]),
         ));
 
       it('should call logout api method in background', () =>
-        revoke(account)(dispatch, getState).then(() =>
+        revoke(account)(dispatch, getState, undefined).then(() =>
           expect(authentication.logout, 'to have a call satisfying', [
             account.token,
           ]),
         ));
 
       it('should update user state', () =>
-        revoke(account)(dispatch, getState).then(
+        revoke(account)(dispatch, getState, undefined).then(
           () =>
             expect(dispatch, 'to have a call satisfying', [
               setUser({ isGuest: true }),
@@ -289,7 +299,7 @@ describe('components/accounts/actions', () => {
       const account2 = { ...account, id: 2 };
 
       beforeEach(() => {
-        getState.returns({
+        (getState as any).returns({
           accounts: {
             active: account2.id,
             available: [account, account2],
@@ -299,17 +309,17 @@ describe('components/accounts/actions', () => {
       });
 
       it('should switch to the next account', () =>
-        revoke(account2)(dispatch, getState).then(() =>
+        revoke(account2)(dispatch, getState, undefined).then(() =>
           expect(dispatch, 'to have a call satisfying', [activate(account)]),
         ));
 
       it('should remove current account', () =>
-        revoke(account2)(dispatch, getState).then(() =>
+        revoke(account2)(dispatch, getState, undefined).then(() =>
           expect(dispatch, 'to have a call satisfying', [remove(account2)]),
         ));
 
       it('should call logout api method in background', () =>
-        revoke(account2)(dispatch, getState).then(() =>
+        revoke(account2)(dispatch, getState, undefined).then(() =>
           expect(authentication.logout, 'to have a call satisfying', [
             account2.token,
           ]),
@@ -321,7 +331,7 @@ describe('components/accounts/actions', () => {
     const account2 = { ...account, id: 2 };
 
     beforeEach(() => {
-      getState.returns({
+      (getState as any).returns({
         accounts: {
           active: account2.id,
           available: [account, account2],
@@ -334,7 +344,7 @@ describe('components/accounts/actions', () => {
     });
 
     it('should call logout api method for each account', () => {
-      logoutAll()(dispatch, getState);
+      logoutAll()(dispatch, getState, undefined);
 
       expect(authentication.logout, 'to have calls satisfying', [
         [account.token],
@@ -343,18 +353,18 @@ describe('components/accounts/actions', () => {
     });
 
     it('should dispatch reset', () => {
-      logoutAll()(dispatch, getState);
+      logoutAll()(dispatch, getState, undefined);
 
       expect(dispatch, 'to have a call satisfying', [reset()]);
     });
 
     it('should redirect to /login', () =>
-      logoutAll()(dispatch, getState).then(() => {
+      logoutAll()(dispatch, getState, undefined).then(() => {
         expect(browserHistory.push, 'to have a call satisfying', ['/login']);
       }));
 
     it('should change user to guest', () =>
-      logoutAll()(dispatch, getState).then(() => {
+      logoutAll()(dispatch, getState, undefined).then(() => {
         expect(dispatch, 'to have a call satisfying', [
           setUser({
             lang: user.lang,
@@ -368,7 +378,7 @@ describe('components/accounts/actions', () => {
     const foreignAccount = {
       ...account,
       id: 2,
-      refreshToken: undefined,
+      refreshToken: null,
     };
 
     const foreignAccount2 = {
@@ -377,7 +387,7 @@ describe('components/accounts/actions', () => {
     };
 
     beforeEach(() => {
-      getState.returns({
+      (getState as any).returns({
         accounts: {
           active: foreignAccount.id,
           available: [account, foreignAccount, foreignAccount2],
@@ -387,14 +397,14 @@ describe('components/accounts/actions', () => {
     });
 
     it('should remove stranger accounts', () => {
-      logoutStrangers()(dispatch, getState);
+      logoutStrangers()(dispatch, getState, undefined);
 
       expect(dispatch, 'to have a call satisfying', [remove(foreignAccount)]);
       expect(dispatch, 'to have a call satisfying', [remove(foreignAccount2)]);
     });
 
     it('should logout stranger accounts', () => {
-      logoutStrangers()(dispatch, getState);
+      logoutStrangers()(dispatch, getState, undefined);
 
       expect(authentication.logout, 'to have calls satisfying', [
         [foreignAccount.token],
@@ -403,12 +413,12 @@ describe('components/accounts/actions', () => {
     });
 
     it('should activate another account if available', () =>
-      logoutStrangers()(dispatch, getState).then(() =>
+      logoutStrangers()(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'to have a call satisfying', [activate(account)]),
       ));
 
     it('should not activate another account if active account is already not a stranger', () => {
-      getState.returns({
+      (getState as any).returns({
         accounts: {
           active: account.id,
           available: [account, foreignAccount],
@@ -416,13 +426,13 @@ describe('components/accounts/actions', () => {
         user,
       });
 
-      return logoutStrangers()(dispatch, getState).then(() =>
+      return logoutStrangers()(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'not to have calls satisfying', [activate(account)]),
       );
     });
 
     it('should not dispatch if no strangers', () => {
-      getState.returns({
+      (getState as any).returns({
         accounts: {
           active: account.id,
           available: [account],
@@ -430,14 +440,14 @@ describe('components/accounts/actions', () => {
         user,
       });
 
-      return logoutStrangers()(dispatch, getState).then(() =>
+      return logoutStrangers()(dispatch, getState, undefined).then(() =>
         expect(dispatch, 'was not called'),
       );
     });
 
     describe('when all accounts are strangers', () => {
       beforeEach(() => {
-        getState.returns({
+        (getState as any).returns({
           accounts: {
             active: foreignAccount.id,
             available: [foreignAccount, foreignAccount2],
@@ -448,7 +458,7 @@ describe('components/accounts/actions', () => {
           user,
         });
 
-        logoutStrangers()(dispatch, getState);
+        logoutStrangers()(dispatch, getState, undefined);
       });
 
       it('logouts all accounts', () => {
@@ -471,7 +481,7 @@ describe('components/accounts/actions', () => {
       beforeEach(() => {
         sessionStorage.setItem(key, 1);
 
-        logoutStrangers()(dispatch, getState);
+        logoutStrangers()(dispatch, getState, undefined);
       });
 
       afterEach(() => {
diff --git a/src/components/accounts/actions.js b/src/components/accounts/actions.ts
similarity index 79%
rename from src/components/accounts/actions.js
rename to src/components/accounts/actions.ts
index eb383f9..35ca252 100644
--- a/src/components/accounts/actions.js
+++ b/src/components/accounts/actions.ts
@@ -1,5 +1,3 @@
-// @flow
-import type { Account, State as AccountsState } from './reducer';
 import { getJwtPayloads } from 'functions';
 import { sessionStorage } from 'services/localStorage';
 import {
@@ -13,7 +11,9 @@ import { setLocale } from 'components/i18n/actions';
 import { setAccountSwitcher } from 'components/auth/actions';
 import { getActiveAccount } from 'components/accounts/reducer';
 import logger from 'services/logger';
+import { ThunkAction } from 'reducers';
 
+import { Account } from './reducer';
 import {
   add,
   remove,
@@ -22,17 +22,6 @@ import {
   updateToken,
 } from './actions/pure-actions';
 
-type Dispatch = (action: Object) => Promise<*>;
-
-type State = {
-  accounts: AccountsState,
-  auth: {
-    oauth?: {
-      clientId?: string,
-    },
-  },
-};
-
 export { updateToken, activate, remove };
 
 /**
@@ -46,20 +35,17 @@ export function authenticate(
   account:
     | Account
     | {
-        token: string,
-        refreshToken: ?string,
+        token: string;
+        refreshToken: string | null;
       },
-) {
+): ThunkAction<Promise<Account>> {
   const { token, refreshToken } = account;
-  const email = account.email || null;
+  const email = 'email' in account ? account.email : null;
 
-  return async (
-    dispatch: Dispatch,
-    getState: () => State,
-  ): Promise<Account> => {
+  return async (dispatch, getState) => {
     let accountId: number;
 
-    if (typeof account.id === 'number') {
+    if ('id' in account && typeof account.id === 'number') {
       accountId = account.id;
     } else {
       accountId = findAccountIdFromToken(token);
@@ -80,18 +66,17 @@ export function authenticate(
         token: newToken,
         refreshToken: newRefreshToken,
         user,
-        // $FlowFixMe have no idea why it's causes error about missing properties
       } = await validateToken(accountId, token, refreshToken);
       const { auth } = getState();
-      const account: Account = {
+      const newAccount: Account = {
         id: user.id,
         username: user.username,
         email: user.email,
         token: newToken,
         refreshToken: newRefreshToken,
       };
-      dispatch(add(account));
-      dispatch(activate(account));
+      dispatch(add(newAccount));
+      dispatch(activate(newAccount));
       dispatch(
         updateUser({
           isGuest: false,
@@ -104,7 +89,7 @@ export function authenticate(
 
       if (!newRefreshToken) {
         // mark user as stranger (user does not want us to remember his account)
-        sessionStorage.setItem(`stranger${account.id}`, 1);
+        sessionStorage.setItem(`stranger${newAccount.id}`, 1);
       }
 
       if (auth && auth.oauth && auth.oauth.clientId) {
@@ -117,7 +102,7 @@ export function authenticate(
 
       await dispatch(setLocale(user.lang));
 
-      return account;
+      return newAccount;
     } catch (resp) {
       // all the logic to get the valid token was failed,
       // looks like we have some problems with token
@@ -156,13 +141,13 @@ function findAccountIdFromToken(token: string): number {
  *
  * @returns {Function}
  */
-export function ensureToken() {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
+export function ensureToken(): ThunkAction<Promise<void>> {
+  return (dispatch, getState) => {
     const { token } = getActiveAccount(getState()) || {};
 
     try {
       const SAFETY_FACTOR = 300; // ask new token earlier to overcome time desynchronization problem
-      const { exp } = getJwtPayloads(token);
+      const { exp } = getJwtPayloads(token as any);
 
       if (exp - SAFETY_FACTOR < Date.now() / 1000) {
         return dispatch(requestNewToken());
@@ -192,12 +177,12 @@ export function ensureToken() {
  * @returns {Function}
  */
 export function recoverFromTokenError(
-  error: ?{
-    status: number,
-    message: string,
-  },
-) {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
+  error: {
+    status: number;
+    message: string;
+  } | void,
+): ThunkAction<Promise<void>> {
+  return (dispatch, getState) => {
     if (error && error.status === 401) {
       const activeAccount = getActiveAccount(getState());
 
@@ -234,8 +219,8 @@ export function recoverFromTokenError(
  *
  * @returns {Function}
  */
-export function requestNewToken() {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
+export function requestNewToken(): ThunkAction<Promise<void>> {
+  return (dispatch, getState) => {
     const { refreshToken } = getActiveAccount(getState()) || {};
 
     if (!refreshToken) {
@@ -266,14 +251,13 @@ export function requestNewToken() {
  *
  * @returns {Function}
  */
-export function revoke(account: Account) {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
-    const accountToReplace: ?Account = getState().accounts.available.find(
-      ({ id }) => id !== account.id,
-    );
+export function revoke(account: Account): ThunkAction<Promise<void>> {
+  return async (dispatch, getState) => {
+    const accountToReplace: Account | null =
+      getState().accounts.available.find(({ id }) => id !== account.id) || null;
 
     if (accountToReplace) {
-      return dispatch(authenticate(accountToReplace))
+      await dispatch(authenticate(accountToReplace))
         .finally(() => {
           // we need to logout user, even in case, when we can
           // not authenticate him with new account
@@ -285,14 +269,16 @@ export function revoke(account: Account) {
         .catch(() => {
           // we don't care
         });
+
+      return;
     }
 
     return dispatch(logoutAll());
   };
 }
 
-export function relogin(email?: string) {
-  return (dispatch: Dispatch, getState: () => State) => {
+export function relogin(email?: string): ThunkAction<Promise<void>> {
+  return async (dispatch, getState) => {
     const activeAccount = getActiveAccount(getState());
 
     if (!email && activeAccount) {
@@ -303,8 +289,8 @@ export function relogin(email?: string) {
   };
 }
 
-export function logoutAll() {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
+export function logoutAll(): ThunkAction<Promise<void>> {
+  return (dispatch, getState) => {
     dispatch(setGuest());
 
     const {
@@ -332,8 +318,8 @@ export function logoutAll() {
  *
  * @returns {Function}
  */
-export function logoutStrangers() {
-  return (dispatch: Dispatch, getState: () => State): Promise<void> => {
+export function logoutStrangers(): ThunkAction<Promise<void>> {
+  return async (dispatch, getState) => {
     const {
       accounts: { available },
     } = getState();
@@ -343,9 +329,7 @@ export function logoutStrangers() {
       !refreshToken && !sessionStorage.getItem(`stranger${id}`);
 
     if (available.some(isStranger)) {
-      const accountToReplace = available.filter(
-        account => !isStranger(account),
-      )[0];
+      const accountToReplace = available.find(account => !isStranger(account));
 
       if (accountToReplace) {
         available.filter(isStranger).forEach(account => {
@@ -354,10 +338,14 @@ export function logoutStrangers() {
         });
 
         if (activeAccount && isStranger(activeAccount)) {
-          return dispatch(authenticate(accountToReplace));
+          await dispatch(authenticate(accountToReplace));
+
+          return;
         }
       } else {
-        return dispatch(logoutAll());
+        await dispatch(logoutAll());
+
+        return;
       }
     }
 
diff --git a/src/components/accounts/actions/pure-actions.js b/src/components/accounts/actions/pure-actions.ts
similarity index 93%
rename from src/components/accounts/actions/pure-actions.js
rename to src/components/accounts/actions/pure-actions.ts
index 9f41daf..3859f5c 100644
--- a/src/components/accounts/actions/pure-actions.js
+++ b/src/components/accounts/actions/pure-actions.ts
@@ -1,5 +1,4 @@
-// @flow
-import type {
+import {
   Account,
   AddAction,
   RemoveAction,
@@ -10,7 +9,7 @@ import type {
 
 export const ADD = 'accounts:add';
 /**
- * @api private
+ * @private
  *
  * @param {Account} account
  *
@@ -25,7 +24,7 @@ export function add(account: Account): AddAction {
 
 export const REMOVE = 'accounts:remove';
 /**
- * @api private
+ * @private
  *
  * @param {Account} account
  *
@@ -40,7 +39,7 @@ export function remove(account: Account): RemoveAction {
 
 export const ACTIVATE = 'accounts:activate';
 /**
- * @api private
+ * @private
  *
  * @param {Account} account
  *
@@ -55,7 +54,7 @@ export function activate(account: Account): ActivateAction {
 
 export const RESET = 'accounts:reset';
 /**
- * @api private
+ * @private
  *
  * @returns {object} - action definition
  */
diff --git a/src/components/accounts/index.js b/src/components/accounts/index.js
deleted file mode 100644
index 79ee918..0000000
--- a/src/components/accounts/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-export type { State as AccountsState, Account } from './reducer';
-export { default as AccountSwitcher } from './AccountSwitcher';
diff --git a/src/components/accounts/index.ts b/src/components/accounts/index.ts
new file mode 100644
index 0000000..6ed2b18
--- /dev/null
+++ b/src/components/accounts/index.ts
@@ -0,0 +1,2 @@
+export { State as AccountsState, Account } from './reducer';
+export { default as AccountSwitcher } from './AccountSwitcher';
diff --git a/src/components/accounts/reducer.test.js b/src/components/accounts/reducer.test.ts
similarity index 82%
rename from src/components/accounts/reducer.test.js
rename to src/components/accounts/reducer.test.ts
index bae53d8..d70151b 100644
--- a/src/components/accounts/reducer.test.js
+++ b/src/components/accounts/reducer.test.ts
@@ -1,7 +1,6 @@
 import expect from 'test/unexpected';
 
-import accounts from 'components/accounts/reducer';
-import { updateToken } from 'components/accounts/actions';
+import { updateToken } from './actions';
 import {
   add,
   remove,
@@ -12,30 +11,33 @@ import {
   ACTIVATE,
   UPDATE_TOKEN,
   RESET,
-} from 'components/accounts/actions/pure-actions';
+} from './actions/pure-actions';
+import accounts, { Account } from './reducer';
 
-const account = {
+const account: Account = {
   id: 1,
   username: 'username',
   email: 'email@test.com',
   token: 'foo',
-};
+} as Account;
 
 describe('Accounts reducer', () => {
   let initial;
 
   beforeEach(() => {
-    initial = accounts(undefined, {});
+    initial = accounts(undefined, {} as any);
   });
 
   it('should be empty', () =>
-    expect(accounts(undefined, {}), 'to equal', {
+    expect(accounts(undefined, {} as any), 'to equal', {
       active: null,
       available: [],
     }));
 
   it('should return last state if unsupported action', () =>
-    expect(accounts({ state: 'foo' }, {}), 'to equal', { state: 'foo' }));
+    expect(accounts({ state: 'foo' } as any, {} as any), 'to equal', {
+      state: 'foo',
+    }));
 
   describe(ACTIVATE, () => {
     it('sets active account', () => {
@@ -92,7 +94,12 @@ describe('Accounts reducer', () => {
 
     it('throws, when account is invalid', () => {
       expect(
-        () => accounts(initial, add()),
+        () =>
+          accounts(
+            initial,
+            // @ts-ignore
+            add(),
+          ),
         'to throw',
         'Invalid or empty payload passed for accounts.add',
       );
@@ -109,7 +116,12 @@ describe('Accounts reducer', () => {
 
     it('throws, when account is invalid', () => {
       expect(
-        () => accounts(initial, remove()),
+        () =>
+          accounts(
+            initial,
+            // @ts-ignore
+            remove(),
+          ),
         'to throw',
         'Invalid or empty payload passed for accounts.remove',
       );
diff --git a/src/components/accounts/reducer.js b/src/components/accounts/reducer.ts
similarity index 80%
rename from src/components/accounts/reducer.js
rename to src/components/accounts/reducer.ts
index 1b15353..c18bd16 100644
--- a/src/components/accounts/reducer.js
+++ b/src/components/accounts/reducer.ts
@@ -1,23 +1,22 @@
-// @flow
 export type Account = {
-  id: number,
-  username: string,
-  email: string,
-  token: string,
-  refreshToken: ?string,
+  id: number;
+  username: string;
+  email: string;
+  token: string;
+  refreshToken: string | null;
 };
 
 export type State = {
-  active: ?number,
-  available: Array<Account>,
+  active: number | null;
+  available: Account[];
 };
 
-export type AddAction = { type: 'accounts:add', payload: Account };
-export type RemoveAction = { type: 'accounts:remove', payload: Account };
-export type ActivateAction = { type: 'accounts:activate', payload: Account };
+export type AddAction = { type: 'accounts:add'; payload: Account };
+export type RemoveAction = { type: 'accounts:remove'; payload: Account };
+export type ActivateAction = { type: 'accounts:activate'; payload: Account };
 export type UpdateTokenAction = {
-  type: 'accounts:updateToken',
-  payload: string,
+  type: 'accounts:updateToken';
+  payload: string;
 };
 export type ResetAction = { type: 'accounts:reset' };
 
@@ -28,14 +27,16 @@ type Action =
   | UpdateTokenAction
   | ResetAction;
 
-export function getActiveAccount(state: { accounts: State }): ?Account {
+export function getActiveAccount(state: { accounts: State }): Account | null {
   const accountId = state.accounts.active;
 
-  return state.accounts.available.find(account => account.id === accountId);
+  return (
+    state.accounts.available.find(account => account.id === accountId) || null
+  );
 }
 
 export function getAvailableAccounts(state: {
-  accounts: State,
+  accounts: State;
 }): Array<Account> {
   return state.accounts.available;
 }
@@ -129,10 +130,7 @@ export default function accounts(
         }),
       };
     }
-
-    default:
-      (action: empty);
-
-      return state;
   }
+
+  return state;
 }
diff --git a/src/components/auth/AuthTitle.js b/src/components/auth/AuthTitle.tsx
similarity index 59%
rename from src/components/auth/AuthTitle.js
rename to src/components/auth/AuthTitle.tsx
index 0641f75..2b3a9a4 100644
--- a/src/components/auth/AuthTitle.js
+++ b/src/components/auth/AuthTitle.tsx
@@ -1,10 +1,8 @@
-// @flow
 import React from 'react';
-
 import Helmet from 'react-helmet';
-import { FormattedMessage as Message } from 'react-intl';
+import { FormattedMessage as Message, MessageDescriptor } from 'react-intl';
 
-export default function AuthTitle({ title }: { title: { id: string } }) {
+export default function AuthTitle({ title }: { title: MessageDescriptor }) {
   return (
     <Message {...title}>
       {msg => (
diff --git a/src/components/auth/BaseAuthBody.js b/src/components/auth/BaseAuthBody.tsx
similarity index 75%
rename from src/components/auth/BaseAuthBody.js
rename to src/components/auth/BaseAuthBody.tsx
index b1430ef..1fd073f 100644
--- a/src/components/auth/BaseAuthBody.js
+++ b/src/components/auth/BaseAuthBody.tsx
@@ -2,13 +2,16 @@
  * Helps with form fields binding, form serialization and errors rendering
  */
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
+import React from 'react';
 import AuthError from 'components/auth/authError/AuthError';
 import { userShape } from 'components/user/User';
 import { FormModel } from 'components/ui/form';
+import { RouteComponentProps } from 'react-router-dom';
 
-export default class BaseAuthBody extends Component {
+export default class BaseAuthBody extends React.Component<
+  // TODO: this may be converted to generic type RouteComponentProps<T>
+  RouteComponentProps<{ [key: string]: any }>
+> {
   static contextTypes = {
     clearErrors: PropTypes.func.isRequired,
     resolve: PropTypes.func.isRequired,
@@ -26,6 +29,8 @@ export default class BaseAuthBody extends Component {
     user: userShape,
   };
 
+  autoFocusField: string | null = '';
+
   componentWillReceiveProps(nextProps, nextContext) {
     if (nextContext.auth.error !== this.context.auth.error) {
       this.form.setErrors(nextContext.auth.error || {});
@@ -33,12 +38,9 @@ export default class BaseAuthBody extends Component {
   }
 
   renderErrors() {
-    return this.form.hasErrors() ? (
-      <AuthError
-        error={this.form.getFirstError()}
-        onClose={this.onClearErrors}
-      />
-    ) : null;
+    const error = this.form.getFirstError();
+
+    return error && <AuthError error={error} onClose={this.onClearErrors} />;
   }
 
   onFormSubmit() {
diff --git a/src/components/auth/PanelTransition.js b/src/components/auth/PanelTransition.tsx
similarity index 79%
rename from src/components/auth/PanelTransition.js
rename to src/components/auth/PanelTransition.tsx
index dae4b90..e676baf 100644
--- a/src/components/auth/PanelTransition.js
+++ b/src/components/auth/PanelTransition.tsx
@@ -1,13 +1,10 @@
-// @flow
-import type { User } from 'components/user';
-import type { AccountsState } from 'components/accounts';
-import type { Element } from 'react';
-import React, { Component } from 'react';
+import React from 'react';
+import { AccountsState } from 'components/accounts';
+import { AuthState } from 'components/auth';
+import { User } from 'components/user';
 import PropTypes from 'prop-types';
-
 import { connect } from 'react-redux';
 import { TransitionMotion, spring } from 'react-motion';
-
 import {
   Panel,
   PanelBody,
@@ -17,13 +14,14 @@ import {
 import { getLogin } from 'components/auth/reducer';
 import { Form } from 'components/ui/form';
 import MeasureHeight from 'components/MeasureHeight';
-import { helpLinks as helpLinksStyles } from 'components/auth/helpLinks.scss';
+import defaultHelpLinksStyles from 'components/auth/helpLinks.scss';
 import panelStyles from 'components/ui/panel.scss';
 import icons from 'components/ui/icons.scss';
 import authFlow from 'services/authFlow';
 import { userShape } from 'components/user/User';
 
 import * as actions from './actions';
+import { RootState } from 'reducers';
 
 const opacitySpringConfig = { stiffness: 300, damping: 20 };
 const transformSpringConfig = { stiffness: 500, damping: 50, precision: 0.5 };
@@ -33,6 +31,8 @@ const changeContextSpringConfig = {
   precision: 0.5,
 };
 
+const { helpLinksStyles } = defaultHelpLinksStyles;
+
 type PanelId = string;
 
 /**
@@ -78,98 +78,56 @@ if (process.env.NODE_ENV !== 'production') {
 type ValidationError =
   | string
   | {
-      type: string,
-      payload: { [key: string]: any },
+      type: string;
+      payload: { [key: string]: any };
     };
 
-type AnimationProps = {|
-  opacitySpring: number,
-  transformSpring: number,
-|};
+type AnimationProps = {
+  opacitySpring: number;
+  transformSpring: number;
+};
 
 type AnimationContext = {
-  key: PanelId,
-  style: AnimationProps,
+  key: PanelId;
+  style: AnimationProps;
   data: {
-    Title: Element<any>,
-    Body: Element<any>,
-    Footer: Element<any>,
-    Links: Element<any>,
-    hasBackButton: boolean,
-  },
+    Title: React.ReactElement<any>;
+    Body: React.ReactElement<any>;
+    Footer: React.ReactElement<any>;
+    Links: React.ReactElement<any>;
+    hasBackButton: boolean | ((props: Props) => boolean);
+  };
 };
 
-type OwnProps = {|
-  Title: Element<any>,
-  Body: Element<any>,
-  Footer: Element<any>,
-  Links: Element<any>,
-  children?: Element<any>,
-|};
+type OwnProps = {
+  Title: React.ReactElement<any>;
+  Body: React.ReactElement<any>;
+  Footer: React.ReactElement<any>;
+  Links: React.ReactElement<any>;
+  children?: React.ReactElement<any>;
+};
 
-type Props = {
-  ...OwnProps,
+interface Props extends OwnProps {
   // context props
-  auth: {
-    error:
-      | string
-      | {
-          type: string,
-          payload: { [key: string]: any },
-        },
-    isLoading: boolean,
-    login: string,
-  },
-  user: User,
-  accounts: AccountsState,
-  setErrors: ({ [key: string]: ValidationError }) => void,
-  clearErrors: () => void,
-  resolve: () => void,
-  reject: () => void,
-};
+  auth: AuthState;
+  user: User;
+  accounts: AccountsState;
+  setErrors: (errors: { [key: string]: ValidationError }) => void;
+  clearErrors: () => void;
+  resolve: () => void;
+  reject: () => void;
+}
 
 type State = {
-  contextHeight: number,
-  panelId: PanelId | void,
-  prevPanelId: PanelId | void,
-  isHeightDirty: boolean,
-  forceHeight: 1 | 0,
-  direction: 'X' | 'Y',
+  contextHeight: number;
+  panelId: PanelId | void;
+  prevPanelId: PanelId | void;
+  isHeightDirty: boolean;
+  forceHeight: 1 | 0;
+  direction: 'X' | 'Y';
 };
 
-class PanelTransition extends Component<Props, State> {
-  static displayName = 'PanelTransition';
-
-  static propTypes = {
-    // context props
-    auth: PropTypes.shape({
-      error: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.shape({
-          type: PropTypes.string,
-          payload: PropTypes.object,
-        }),
-      ]),
-      isLoading: PropTypes.bool,
-      login: PropTypes.string,
-    }).isRequired,
-    user: userShape.isRequired,
-    accounts: PropTypes.shape({
-      available: PropTypes.array,
-    }),
-    setErrors: PropTypes.func.isRequired,
-    clearErrors: PropTypes.func.isRequired,
-    resolve: PropTypes.func.isRequired,
-    reject: PropTypes.func.isRequired,
-
-    // local props
-    Title: PropTypes.element,
-    Body: PropTypes.element,
-    Footer: PropTypes.element,
-    Links: PropTypes.element,
-    children: PropTypes.element,
-  };
-
+class PanelTransition extends React.Component<Props, State> {
   static childContextTypes = {
     auth: PropTypes.shape({
       error: PropTypes.oneOfType([
@@ -191,23 +149,23 @@ class PanelTransition extends Component<Props, State> {
     reject: PropTypes.func,
   };
 
-  state = {
+  state: State = {
     contextHeight: 0,
-    panelId: this.props.Body && (this.props.Body: any).type.panelId,
+    panelId: this.props.Body && (this.props.Body.type as any).panelId,
     isHeightDirty: false,
-    forceHeight: 0,
-    direction: 'X',
+    forceHeight: 0 as const,
+    direction: 'X' as const,
     prevPanelId: undefined,
   };
 
   isHeightMeasured: boolean = false;
   wasAutoFocused: boolean = false;
   body: null | {
-    autoFocus: () => void,
-    onFormSubmit: () => void,
+    autoFocus: () => void;
+    onFormSubmit: () => void;
   } = null;
 
-  timerIds = []; // this is a list of a probably running timeouts to clean on unmount
+  timerIds: NodeJS.Timeout[] = []; // this is a list of a probably running timeouts to clean on unmount
 
   getChildContext() {
     return {
@@ -230,9 +188,9 @@ class PanelTransition extends Component<Props, State> {
 
   componentWillReceiveProps(nextProps: Props) {
     const nextPanel: PanelId =
-      nextProps.Body && (nextProps.Body: any).type.panelId;
+      nextProps.Body && (nextProps.Body.type as any).panelId;
     const prevPanel: PanelId =
-      this.props.Body && (this.props.Body: any).type.panelId;
+      this.props.Body && (this.props.Body.type as any).panelId;
 
     if (nextPanel !== prevPanel) {
       const direction = this.getDirection(nextPanel, prevPanel);
@@ -276,9 +234,9 @@ class PanelTransition extends Component<Props, State> {
       panelId,
       hasGoBack,
     }: {
-      panelId: PanelId,
-      hasGoBack: boolean,
-    } = (Body: any).type;
+      panelId: PanelId;
+      hasGoBack: boolean;
+    } = Body.type as any;
 
     const formHeight = this.state[`formHeight${panelId}`] || 0;
 
@@ -315,7 +273,7 @@ class PanelTransition extends Component<Props, State> {
       >
         {items => {
           const panels = items.filter(({ key }) => key !== 'common');
-          const common = items.filter(({ key }) => key === 'common')[0];
+          const [common] = items.filter(({ key }) => key === 'common');
 
           const contentHeight = {
             overflow: 'hidden',
@@ -327,7 +285,7 @@ class PanelTransition extends Component<Props, State> {
           this.tryToAutoFocus(panels.length);
 
           const bodyHeight = {
-            position: 'relative',
+            position: 'relative' as const,
             height: `${common.style.heightSpring}px`,
           };
 
@@ -394,10 +352,10 @@ class PanelTransition extends Component<Props, State> {
   getTransitionStyles(
     { key }: AnimationContext,
     options: { isLeave?: boolean } = {},
-  ): {|
-    transformSpring: number,
-    opacitySpring: number,
-  |} {
+  ): {
+    transformSpring: number;
+    opacitySpring: number;
+  } {
     const { isLeave = false } = options;
     const { panelId, prevPanelId } = this.state;
 
@@ -411,6 +369,8 @@ class PanelTransition extends Component<Props, State> {
     }
 
     let sign =
+      prevPanelId &&
+      panelId &&
       currentContext.indexOf(panelId) > currentContext.indexOf(prevPanelId)
         ? fromRight
         : fromLeft;
@@ -430,7 +390,7 @@ class PanelTransition extends Component<Props, State> {
   }
 
   getDirection(next: PanelId, prev: PanelId): 'X' | 'Y' {
-    const context = contexts.find(context => context.includes(prev));
+    const context = contexts.find(item => item.includes(prev));
 
     if (!context) {
       throw new Error(`Can not find context for transition ${prev} -> ${next}`);
@@ -442,6 +402,7 @@ class PanelTransition extends Component<Props, State> {
   onUpdateHeight = (height: number, key: PanelId) => {
     const heightKey = `formHeight${key}`;
 
+    // @ts-ignore
     this.setState({
       [heightKey]: height,
     });
@@ -453,7 +414,7 @@ class PanelTransition extends Component<Props, State> {
     });
   };
 
-  onGoBack = (event: SyntheticEvent<HTMLElement>) => {
+  onGoBack = (event: React.MouseEvent<HTMLElement>) => {
     event.preventDefault();
 
     authFlow.goBack();
@@ -482,7 +443,6 @@ class PanelTransition extends Component<Props, State> {
 
   shouldMeasureHeight() {
     const errorString = Object.values(this.props.auth.error || {}).reduce(
-      // $FlowFixMe
       (acc, item: ValidationError) => {
         if (typeof item === 'string') {
           return acc + item;
@@ -519,7 +479,7 @@ class PanelTransition extends Component<Props, State> {
     const scrollStyle = this.translate(transformSpring, 'Y');
 
     const sideScrollStyle = {
-      position: 'relative',
+      position: 'relative' as const,
       zIndex: 2,
       ...this.translate(-Math.abs(transformSpring)),
     };
@@ -549,7 +509,10 @@ class PanelTransition extends Component<Props, State> {
     const { transformSpring } = style;
     const { direction } = this.state;
 
-    let transform = this.translate(transformSpring, direction);
+    let transform: { [key: string]: string } = this.translate(
+      transformSpring,
+      direction,
+    );
     let verticalOrigin = 'top';
 
     if (direction === 'Y') {
@@ -613,15 +576,15 @@ class PanelTransition extends Component<Props, State> {
    */
   getDefaultTransitionStyles(
     key: string,
-    { opacitySpring }: $ReadOnly<AnimationProps>,
-  ): {|
-    position: string,
-    top: number,
-    left: number,
-    width: string,
-    opacity: number,
-    pointerEvents: string,
-  |} {
+    { opacitySpring }: Readonly<AnimationProps>,
+  ): {
+    position: 'absolute';
+    top: number;
+    left: number;
+    width: string;
+    opacity: number;
+    pointerEvents: 'none' | 'auto';
+  } {
     return {
       position: 'absolute',
       top: 0,
@@ -632,14 +595,6 @@ class PanelTransition extends Component<Props, State> {
     };
   }
 
-  /**
-   * @param {number} value
-   * @param {string} direction='X' - X|Y
-   * @param direction
-   * @param unit
-   * @param {string} unit='%' - %|px etc
-   * @returns {object}
-   */
   translate(value: number, direction: 'X' | 'Y' = 'X', unit: '%' | 'px' = '%') {
     return {
       WebkitTransform: `translate${direction}(${value}${unit})`,
@@ -648,8 +603,8 @@ class PanelTransition extends Component<Props, State> {
   }
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
-  state => {
+export default connect(
+  (state: RootState) => {
     const login = getLogin(state);
     let user = {
       ...state.user,
diff --git a/src/components/auth/RejectionLink.js b/src/components/auth/RejectionLink.tsx
similarity index 56%
rename from src/components/auth/RejectionLink.js
rename to src/components/auth/RejectionLink.tsx
index e3912ff..0385f80 100644
--- a/src/components/auth/RejectionLink.js
+++ b/src/components/auth/RejectionLink.tsx
@@ -1,11 +1,23 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-
-import { FormattedMessage as Message } from 'react-intl';
-
+import { FormattedMessage as Message, MessageDescriptor } from 'react-intl';
+import { User } from 'components/user';
 import { userShape } from 'components/user/User';
 
-export default function RejectionLink(props, context) {
+interface Props {
+  isAvailable?: (context: Context) => boolean;
+  payload?: { [key: string]: any };
+  label: MessageDescriptor;
+}
+
+export type RejectionLinkProps = Props;
+
+interface Context {
+  reject: (payload: { [key: string]: any } | undefined) => void;
+  user: User;
+}
+
+function RejectionLink(props: Props, context: Context) {
   if (props.isAvailable && !props.isAvailable(context)) {
     // TODO: if want to properly support multiple links, we should control
     // the dividers ' | ' rendered from factory too
@@ -26,16 +38,9 @@ export default function RejectionLink(props, context) {
   );
 }
 
-RejectionLink.displayName = 'RejectionLink';
-RejectionLink.propTypes = {
-  isAvailable: PropTypes.func, // a function from context to allow link visibility control
-  // eslint-disable-next-line react/forbid-prop-types
-  payload: PropTypes.object, // Custom payload for active state
-  label: PropTypes.shape({
-    id: PropTypes.string,
-  }).isRequired,
-};
 RejectionLink.contextTypes = {
   reject: PropTypes.func.isRequired,
   user: userShape,
 };
+
+export default RejectionLink;
diff --git a/src/components/auth/acceptRules/AcceptRules.js b/src/components/auth/acceptRules/AcceptRules.ts
similarity index 86%
rename from src/components/auth/acceptRules/AcceptRules.js
rename to src/components/auth/acceptRules/AcceptRules.ts
index de70848..0325b82 100644
--- a/src/components/auth/acceptRules/AcceptRules.js
+++ b/src/components/auth/acceptRules/AcceptRules.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import Body from './AcceptRulesBody';
 import messages from './AcceptRules.intl.json';
 
diff --git a/src/components/auth/actions.test.js b/src/components/auth/actions.test.ts
similarity index 85%
rename from src/components/auth/actions.test.js
rename to src/components/auth/actions.test.ts
index f0854bc..746a2fa 100644
--- a/src/components/auth/actions.test.js
+++ b/src/components/auth/actions.test.ts
@@ -53,8 +53,8 @@ describe('components/auth/actions', () => {
   });
 
   afterEach(() => {
-    request.get.restore();
-    request.post.restore();
+    (request.get as any).restore();
+    (request.post as any).restore();
   });
 
   describe('#oAuthValidate()', () => {
@@ -69,7 +69,7 @@ describe('components/auth/actions', () => {
         },
       };
 
-      request.get.returns(Promise.resolve(resp));
+      (request.get as any).returns(Promise.resolve(resp));
     });
 
     it('should send get request to an api', () =>
@@ -106,7 +106,7 @@ describe('components/auth/actions', () => {
     });
 
     it('should post to api/oauth2/complete', () => {
-      request.post.returns(
+      (request.post as any).returns(
         Promise.resolve({
           redirectUri: '',
         }),
@@ -126,7 +126,7 @@ describe('components/auth/actions', () => {
         redirectUri: 'static_page?code=123&state=',
       };
 
-      request.post.returns(Promise.resolve(resp));
+      (request.post as any).returns(Promise.resolve(resp));
 
       return callThunk(oAuthComplete).then(() => {
         expectDispatchCalls([
@@ -141,20 +141,20 @@ describe('components/auth/actions', () => {
       });
     });
 
-    it('should resolve to with success false and redirectUri for access_denied', () => {
+    it('should resolve to with success false and redirectUri for access_denied', async () => {
       const resp = {
         statusCode: 401,
         error: 'access_denied',
         redirectUri: 'redirectUri',
       };
 
-      request.post.returns(Promise.reject(resp));
+      (request.post as any).returns(Promise.reject(resp));
 
-      return callThunk(oAuthComplete).then(resp => {
-        expect(resp, 'to equal', {
-          success: false,
-          redirectUri: 'redirectUri',
-        });
+      const data = await callThunk(oAuthComplete);
+
+      expect(data, 'to equal', {
+        success: false,
+        redirectUri: 'redirectUri',
       });
     });
 
@@ -164,10 +164,10 @@ describe('components/auth/actions', () => {
         error: 'accept_required',
       };
 
-      request.post.returns(Promise.reject(resp));
+      (request.post as any).returns(Promise.reject(resp));
 
-      return callThunk(oAuthComplete).catch(resp => {
-        expect(resp.acceptRequired, 'to be true');
+      return callThunk(oAuthComplete).catch(error => {
+        expect(error.acceptRequired, 'to be true');
         expectDispatchCalls([[requirePermissionsAccept()]]);
       });
     });
@@ -176,7 +176,7 @@ describe('components/auth/actions', () => {
   describe('#login()', () => {
     describe('when correct login was entered', () => {
       beforeEach(() => {
-        request.post.returns(
+        (request.post as any).returns(
           Promise.reject({
             errors: {
               password: 'error.password_required',
diff --git a/src/components/auth/actions.js b/src/components/auth/actions.ts
similarity index 82%
rename from src/components/auth/actions.js
rename to src/components/auth/actions.ts
index 00c6d38..445fea1 100644
--- a/src/components/auth/actions.js
+++ b/src/components/auth/actions.ts
@@ -1,6 +1,3 @@
-// @flow
-import type { OauthData, Client, Scope } from 'services/api/oauth';
-import type { OAuthResponse } from 'services/api/authentication';
 import { browserHistory } from 'services/history';
 import logger from 'services/logger';
 import localStorage from 'services/localStorage';
@@ -16,20 +13,22 @@ import {
   login as loginEndpoint,
   forgotPassword as forgotPasswordEndpoint,
   recoverPassword as recoverPasswordEndpoint,
+  OAuthResponse,
 } from 'services/api/authentication';
-import oauth from 'services/api/oauth';
+import oauth, { OauthData, Client, Scope } from 'services/api/oauth';
 import signup from 'services/api/signup';
 import dispatchBsod from 'components/ui/bsod/dispatchBsod';
 import { create as createPopup } from 'components/ui/popup/actions';
 import ContactForm from 'components/contact/ContactForm';
+import { ThunkAction, Dispatch } from 'reducers';
 
 import { getCredentials } from './reducer';
 
 type ValidationError =
   | string
   | {
-      type: string,
-      payload: { [key: string]: any },
+      type: string;
+      payload: { [key: string]: any };
     };
 
 export { updateUser } from 'components/user/actions';
@@ -39,6 +38,7 @@ export {
   remove as removeAccount,
   activate as activateAccount,
 } from 'components/accounts/actions';
+import { Account } from 'components/accounts/reducer';
 
 /**
  * Reoutes user to the previous page if it is possible
@@ -62,7 +62,7 @@ export function goBack(options: { fallbackUrl?: string }) {
   };
 }
 
-export function redirect(url: string): () => Promise<*> {
+export function redirect(url: string): () => Promise<void> {
   loader.show();
 
   return () =>
@@ -84,10 +84,10 @@ export function login({
   totp,
   rememberMe = false,
 }: {
-  login: string,
-  password?: string,
-  totp?: string,
-  rememberMe?: boolean,
+  login: string;
+  password?: string;
+  totp?: string;
+  rememberMe?: boolean;
 }) {
   return wrapInLoader(dispatch =>
     loginEndpoint({ login, password, totp, rememberMe })
@@ -129,8 +129,8 @@ export function forgotPassword({
   login = '',
   captcha = '',
 }: {
-  login: string,
-  captcha: string,
+  login: string;
+  captcha: string;
 }) {
   return wrapInLoader((dispatch, getState) =>
     forgotPasswordEndpoint(login, captcha)
@@ -150,9 +150,9 @@ export function recoverPassword({
   newPassword = '',
   newRePassword = '',
 }: {
-  key: string,
-  newPassword: string,
-  newRePassword: string,
+  key: string;
+  newPassword: string;
+  newRePassword: string;
 }) {
   return wrapInLoader(dispatch =>
     recoverPasswordEndpoint(key, newPassword, newRePassword)
@@ -169,12 +169,12 @@ export function register({
   captcha = '',
   rulesAgreement = false,
 }: {
-  email: string,
-  username: string,
-  password: string,
-  rePassword: string,
-  captcha: string,
-  rulesAgreement: boolean,
+  email: string;
+  username: string;
+  password: string;
+  rePassword: string;
+  captcha: string;
+  rulesAgreement: boolean;
 }) {
   return wrapInLoader((dispatch, getState) =>
     signup
@@ -203,7 +203,11 @@ export function register({
   );
 }
 
-export function activate({ key = '' }: { key: string }) {
+export function activate({
+  key = '',
+}: {
+  key: string;
+}): ThunkAction<Promise<Account>> {
   return wrapInLoader(dispatch =>
     signup
       .activate({ key })
@@ -216,8 +220,8 @@ export function resendActivation({
   email = '',
   captcha,
 }: {
-  email: string,
-  captcha: string,
+  email: string;
+  captcha: string;
 }) {
   return wrapInLoader(dispatch =>
     signup
@@ -249,7 +253,7 @@ export const SET_CREDENTIALS = 'auth:setCredentials';
  *
  * @returns {object}
  */
-export function setLogin(login: ?string) {
+export function setLogin(login: string | null) {
   return {
     type: SET_CREDENTIALS,
     payload: login
@@ -260,8 +264,8 @@ export function setLogin(login: ?string) {
   };
 }
 
-export function relogin(login: ?string) {
-  return (dispatch: (Function | Object) => void, getState: () => Object) => {
+export function relogin(login: string | null): ThunkAction {
+  return (dispatch, getState) => {
     const credentials = getCredentials(getState());
     const returnUrl =
       credentials.returnUrl || location.pathname + location.search;
@@ -284,11 +288,11 @@ function requestTotp({
   password,
   rememberMe,
 }: {
-  login: string,
-  password: string,
-  rememberMe: boolean,
-}) {
-  return (dispatch: (Function | Object) => void, getState: () => Object) => {
+  login: string;
+  password: string;
+  rememberMe: boolean;
+}): ThunkAction {
+  return (dispatch, getState) => {
     // merging with current credentials to propogate returnUrl
     const credentials = getCredentials(getState());
 
@@ -314,7 +318,7 @@ export function setAccountSwitcher(isOn: boolean) {
 }
 
 export const ERROR = 'auth:error';
-export function setErrors(errors: ?{ [key: string]: ValidationError }) {
+export function setErrors(errors: { [key: string]: ValidationError } | null) {
   return {
     type: ERROR,
     payload: errors,
@@ -363,7 +367,7 @@ export function oAuthValidate(oauthData: OauthData) {
         );
         let prompt = (oauthData.prompt || 'none')
           .split(',')
-          .map(item => item.trim);
+          .map(item => item.trim());
 
         if (prompt.includes('none')) {
           prompt = ['none'];
@@ -404,15 +408,29 @@ export function oAuthValidate(oauthData: OauthData) {
  * @returns {Promise}
  */
 export function oAuthComplete(params: { accept?: boolean } = {}) {
-  return wrapInLoader((dispatch, getState) =>
-    oauth.complete(getState().auth.oauth, params).then(
-      resp => {
+  return wrapInLoader(
+    async (
+      dispatch,
+      getState,
+    ): Promise<{
+      success: boolean;
+      redirectUri: string;
+    }> => {
+      const oauthData = getState().auth.oauth;
+
+      if (!oauthData) {
+        throw new Error('Can not complete oAuth. Oauth data does not exist');
+      }
+
+      try {
+        const resp = await oauth.complete(oauthData, params);
         localStorage.removeItem('oauthData');
 
         if (resp.redirectUri.startsWith('static_page')) {
-          const code = (resp.redirectUri.match(/code=(.+)&/) || [])[1];
           const displayCode = resp.redirectUri === 'static_page_with_code';
-          resp.redirectUri = (resp.redirectUri.match(/^(.+)\?/) || [])[1];
+
+          const [, code] = resp.redirectUri.match(/code=(.+)&/) || [];
+          [, resp.redirectUri] = resp.redirectUri.match(/^(.+)\?/) || [];
 
           dispatch(
             setOAuthCode({
@@ -424,34 +442,32 @@ export function oAuthComplete(params: { accept?: boolean } = {}) {
         }
 
         return resp;
-      },
-      (
-        resp:
+      } catch (error) {
+        const resp:
           | {
-              acceptRequired: boolean,
+              acceptRequired: boolean;
             }
           | {
-              unauthorized: boolean,
-            },
-      ) => {
-        if (resp.acceptRequired) {
+              unauthorized: boolean;
+            } = error;
+
+        if ('acceptRequired' in resp) {
           dispatch(requirePermissionsAccept());
 
           return Promise.reject(resp);
         }
 
         return handleOauthParamsValidation(resp);
-      },
-    ),
+      }
+    },
   );
 }
 
 function handleOauthParamsValidation(
-  resp:
-    | {
-        userMessage?: string,
-      }
-    | Object = {},
+  resp: {
+    [key: string]: any;
+    userMessage?: string;
+  } = {},
 ) {
   dispatchBsod();
   localStorage.removeItem('oauthData');
@@ -470,8 +486,8 @@ export function setClient({ id, name, description }: Client) {
   };
 }
 
-export function resetOAuth() {
-  return (dispatch: (Function | Object) => void) => {
+export function resetOAuth(): ThunkAction {
+  return (dispatch): void => {
     localStorage.removeItem('oauthData');
     dispatch(setOAuthRequest({}));
   };
@@ -479,25 +495,20 @@ export function resetOAuth() {
 
 /**
  * Resets all temporary state related to auth
- *
- * @returns {Function}
  */
-export function resetAuth() {
-  return (
-    dispatch: (Function | Object) => void,
-    getSate: () => Object,
-  ): Promise<void> => {
+export function resetAuth(): ThunkAction {
+  return (dispatch, getSate): Promise<void> => {
     dispatch(setLogin(null));
     dispatch(resetOAuth());
     // ensure current account is valid
     const activeAccount = getActiveAccount(getSate());
 
     if (activeAccount) {
-      return Promise.resolve(dispatch(authenticate(activeAccount))).catch(
-        () => {
+      return Promise.resolve(dispatch(authenticate(activeAccount)))
+        .then(() => {})
+        .catch(() => {
           // its okay. user will be redirected to an appropriate place
-        },
-      );
+        });
     }
 
     return Promise.resolve();
@@ -506,13 +517,13 @@ export function resetAuth() {
 
 export const SET_OAUTH = 'set_oauth';
 export function setOAuthRequest(oauth: {
-  client_id?: string,
-  redirect_uri?: string,
-  response_type?: string,
-  scope?: string,
-  prompt?: string,
-  loginHint?: string,
-  state?: string,
+  client_id?: string;
+  redirect_uri?: string;
+  response_type?: string;
+  scope?: string;
+  prompt?: string;
+  loginHint?: string;
+  state?: string;
 }) {
   return {
     type: SET_OAUTH,
@@ -530,9 +541,9 @@ export function setOAuthRequest(oauth: {
 
 export const SET_OAUTH_RESULT = 'set_oauth_result';
 export function setOAuthCode(oauth: {
-  success: boolean,
-  code: string,
-  displayCode: boolean,
+  success: boolean;
+  code: string;
+  displayCode: boolean;
 }) {
   return {
     type: SET_OAUTH_RESULT,
@@ -571,12 +582,12 @@ export function setLoadingState(isLoading: boolean) {
   };
 }
 
-function wrapInLoader(fn) {
-  return (dispatch: (Function | Object) => void, getState: Object) => {
+function wrapInLoader<T>(fn: ThunkAction<Promise<T>>): ThunkAction<Promise<T>> {
+  return (dispatch, getState) => {
     dispatch(setLoadingState(true));
     const endLoading = () => dispatch(setLoadingState(false));
 
-    return Reflect.apply(fn, null, [dispatch, getState]).then(
+    return fn(dispatch, getState, undefined).then(
       resp => {
         endLoading();
 
@@ -598,12 +609,12 @@ function needActivation() {
   });
 }
 
-function authHandler(dispatch) {
-  return (resp: OAuthResponse) =>
+function authHandler(dispatch: Dispatch) {
+  return (resp: OAuthResponse): Promise<Account> =>
     dispatch(
       authenticate({
         token: resp.access_token,
-        refreshToken: resp.refresh_token,
+        refreshToken: resp.refresh_token || null,
       }),
     ).then(resp => {
       dispatch(setLogin(null));
@@ -612,10 +623,7 @@ function authHandler(dispatch) {
     });
 }
 
-function validationErrorsHandler(
-  dispatch: (Function | Object) => void,
-  repeatUrl?: string,
-) {
+function validationErrorsHandler(dispatch: Dispatch, repeatUrl?: string) {
   return resp => {
     if (resp.errors) {
       const firstError = Object.keys(resp.errors)[0];
diff --git a/src/components/auth/activation/Activation.js b/src/components/auth/activation/Activation.ts
similarity index 86%
rename from src/components/auth/activation/Activation.js
rename to src/components/auth/activation/Activation.ts
index 35b724f..d43e1cf 100644
--- a/src/components/auth/activation/Activation.js
+++ b/src/components/auth/activation/Activation.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import messages from './Activation.intl.json';
 import Body from './ActivationBody';
 
diff --git a/src/components/auth/appInfo/AppInfo.js b/src/components/auth/appInfo/AppInfo.tsx
similarity index 90%
rename from src/components/auth/appInfo/AppInfo.js
rename to src/components/auth/appInfo/AppInfo.tsx
index 4038445..a4345c2 100644
--- a/src/components/auth/appInfo/AppInfo.js
+++ b/src/components/auth/appInfo/AppInfo.tsx
@@ -1,18 +1,15 @@
-// @flow
-import React, { Component } from 'react';
-
+import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
-
 import { Button } from 'components/ui/form';
 import { FooterMenu } from 'components/footerMenu';
 
 import styles from './appInfo.scss';
 import messages from './AppInfo.intl.json';
 
-export default class AppInfo extends Component<{
-  name?: string,
-  description?: string,
-  onGoToAuth: () => void,
+export default class AppInfo extends React.Component<{
+  name?: string;
+  description?: string;
+  onGoToAuth: () => void;
 }> {
   render() {
     const { name, description, onGoToAuth } = this.props;
diff --git a/src/components/auth/chooseAccount/ChooseAccount.js b/src/components/auth/chooseAccount/ChooseAccount.ts
similarity index 85%
rename from src/components/auth/chooseAccount/ChooseAccount.js
rename to src/components/auth/chooseAccount/ChooseAccount.ts
index 68721a9..be84023 100644
--- a/src/components/auth/chooseAccount/ChooseAccount.js
+++ b/src/components/auth/chooseAccount/ChooseAccount.ts
@@ -1,4 +1,4 @@
-import factory from 'components/auth/factory';
+import factory from '../factory';
 import messages from './ChooseAccount.intl.json';
 import Body from './ChooseAccountBody';
 
diff --git a/src/components/auth/factory.js b/src/components/auth/factory.js
deleted file mode 100644
index ef14470..0000000
--- a/src/components/auth/factory.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from 'react';
-
-import { Button } from 'components/ui/form';
-import RejectionLink from 'components/auth/RejectionLink';
-import AuthTitle from 'components/auth/AuthTitle';
-
-/**
- * @param {object} options
- * @param {string|object} options.title - panel title
- * @param {ReactElement} options.body
- * @param {object} options.footer - config for footer Button
- * @param {Array|object|null} options.links - link config or an array of link configs
- *
- * @returns {object} - structure, required for auth panel to work
- */
-export default function(options) {
-  return () => ({
-    Title: () => <AuthTitle title={options.title} />,
-    Body: options.body,
-    Footer: () => <Button type="submit" {...options.footer} />,
-    Links: () =>
-      options.links ? (
-        <span>
-          {[]
-            .concat(options.links)
-            .map((link, index) => [
-              index ? ' | ' : '',
-              <RejectionLink {...link} key={index} />,
-            ])}
-        </span>
-      ) : null,
-  });
-}
diff --git a/src/components/auth/factory.tsx b/src/components/auth/factory.tsx
new file mode 100644
index 0000000..06bcd51
--- /dev/null
+++ b/src/components/auth/factory.tsx
@@ -0,0 +1,50 @@
+import React from 'react';
+import { Button } from 'components/ui/form';
+import RejectionLink, {
+  RejectionLinkProps,
+} from 'components/auth/RejectionLink';
+import AuthTitle from 'components/auth/AuthTitle';
+import { MessageDescriptor } from 'react-intl';
+import { Color } from 'components/ui';
+
+/**
+ * @param {object} options
+ * @param {string|object} options.title - panel title
+ * @param {React.ReactElement} options.body
+ * @param {object} options.footer - config for footer Button
+ * @param {Array|object|null} options.links - link config or an array of link configs
+ *
+ * @returns {object} - structure, required for auth panel to work
+ */
+export default function({
+  title,
+  body,
+  footer,
+  links,
+}: {
+  title: MessageDescriptor;
+  body: React.ElementType;
+  footer: {
+    color?: Color;
+    label: string | MessageDescriptor;
+    autoFocus?: boolean;
+  };
+  links?: RejectionLinkProps | RejectionLinkProps[];
+}) {
+  return () => ({
+    Title: () => <AuthTitle title={title} />,
+    Body: body,
+    Footer: () => <Button type="submit" {...footer} />,
+    Links: () =>
+      links ? (
+        <span>
+          {([] as RejectionLinkProps[])
+            .concat(links)
+            .map((link, index) => [
+              index ? ' | ' : '',
+              <RejectionLink {...link} key={index} />,
+            ])}
+        </span>
+      ) : null,
+  });
+}
diff --git a/src/components/auth/finish/Finish.js b/src/components/auth/finish/Finish.tsx
similarity index 73%
rename from src/components/auth/finish/Finish.js
rename to src/components/auth/finish/Finish.tsx
index 8bc2d25..54eaebb 100644
--- a/src/components/auth/finish/Finish.js
+++ b/src/components/auth/finish/Finish.tsx
@@ -1,35 +1,32 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
+import React from 'react';
 import { connect } from 'react-redux';
 import { FormattedMessage as Message } from 'react-intl';
 import Helmet from 'react-helmet';
-
 import { Button } from 'components/ui/form';
 import copy from 'services/copy';
+import { RootState } from 'reducers';
 
 import messages from './Finish.intl.json';
 import styles from './finish.scss';
 
-class Finish extends Component {
-  static displayName = 'Finish';
-
-  static propTypes = {
-    appName: PropTypes.string.isRequired,
-    code: PropTypes.string.isRequired,
-    state: PropTypes.string.isRequired,
-    displayCode: PropTypes.bool,
-    success: PropTypes.bool,
-  };
+interface Props {
+  appName: string;
+  code?: string;
+  state: string;
+  displayCode?: string;
+  success?: boolean;
+}
 
+class Finish extends React.Component<Props> {
   render() {
     const { appName, code, state, displayCode, success } = this.props;
     const authData = JSON.stringify({
-      auth_code: code, // eslint-disable-line
+      // eslint-disable-next-line @typescript-eslint/camelcase
+      auth_code: code,
       state,
     });
 
-    history.pushState(null, null, `#${authData}`);
+    history.pushState(null, document.title, `#${authData}`);
 
     return (
       <div className={styles.finishPage}>
@@ -89,14 +86,25 @@ class Finish extends Component {
 
   onCopyClick = event => {
     event.preventDefault();
-    copy(this.props.code);
+
+    const { code } = this.props;
+
+    if (code) {
+      copy(code);
+    }
   };
 }
 
-export default connect(({ auth }) => ({
-  appName: auth.client.name,
-  code: auth.oauth.code,
-  displayCode: auth.oauth.displayCode,
-  state: auth.oauth.state,
-  success: auth.oauth.success,
-}))(Finish);
+export default connect(({ auth }: RootState) => {
+  if (!auth || !auth.client || !auth.oauth) {
+    throw new Error('Can not connect Finish component. No auth data in state');
+  }
+
+  return {
+    appName: auth.client.name,
+    code: auth.oauth.code,
+    displayCode: auth.oauth.displayCode,
+    state: auth.oauth.state,
+    success: auth.oauth.success,
+  };
+})(Finish);
diff --git a/src/components/auth/forgotPassword/ForgotPassword.js b/src/components/auth/forgotPassword/ForgotPassword.ts
similarity index 86%
rename from src/components/auth/forgotPassword/ForgotPassword.js
rename to src/components/auth/forgotPassword/ForgotPassword.ts
index 3424e86..73725a5 100644
--- a/src/components/auth/forgotPassword/ForgotPassword.js
+++ b/src/components/auth/forgotPassword/ForgotPassword.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import messages from './ForgotPassword.intl.json';
 import Body from './ForgotPasswordBody';
 
diff --git a/src/components/auth/index.ts b/src/components/auth/index.ts
new file mode 100644
index 0000000..e673142
--- /dev/null
+++ b/src/components/auth/index.ts
@@ -0,0 +1 @@
+export { State as AuthState } from './reducer';
diff --git a/src/components/auth/login/Login.js b/src/components/auth/login/Login.ts
similarity index 86%
rename from src/components/auth/login/Login.js
rename to src/components/auth/login/Login.ts
index 70a3e85..193529c 100644
--- a/src/components/auth/login/Login.js
+++ b/src/components/auth/login/Login.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import Body from './LoginBody';
 import messages from './Login.intl.json';
 
diff --git a/src/components/auth/mfa/Mfa.js b/src/components/auth/mfa/Mfa.tsx
similarity index 83%
rename from src/components/auth/mfa/Mfa.js
rename to src/components/auth/mfa/Mfa.tsx
index 962fa86..79d58bf 100644
--- a/src/components/auth/mfa/Mfa.js
+++ b/src/components/auth/mfa/Mfa.tsx
@@ -1,6 +1,4 @@
-// @flow
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import Body from './MfaBody';
 import messages from './Mfa.intl.json';
 import passwordMessages from '../password/Password.intl.json';
diff --git a/src/components/auth/mfa/MfaBody.js b/src/components/auth/mfa/MfaBody.tsx
similarity index 98%
rename from src/components/auth/mfa/MfaBody.js
rename to src/components/auth/mfa/MfaBody.tsx
index 452d442..bb06f77 100644
--- a/src/components/auth/mfa/MfaBody.js
+++ b/src/components/auth/mfa/MfaBody.tsx
@@ -1,8 +1,5 @@
-// @flow
 import React from 'react';
-
 import { FormattedMessage as Message } from 'react-intl';
-
 import { PanelIcon } from 'components/ui/Panel';
 import { Input } from 'components/ui/form';
 import BaseAuthBody from 'components/auth/BaseAuthBody';
diff --git a/src/components/auth/password/Password.js b/src/components/auth/password/Password.ts
similarity index 85%
rename from src/components/auth/password/Password.js
rename to src/components/auth/password/Password.ts
index 7a2bcc8..d0ab75d 100644
--- a/src/components/auth/password/Password.js
+++ b/src/components/auth/password/Password.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import Body from './PasswordBody';
 import messages from './Password.intl.json';
 
diff --git a/src/components/auth/permissions/Permissions.js b/src/components/auth/permissions/Permissions.ts
similarity index 86%
rename from src/components/auth/permissions/Permissions.js
rename to src/components/auth/permissions/Permissions.ts
index e58968d..053bc23 100644
--- a/src/components/auth/permissions/Permissions.js
+++ b/src/components/auth/permissions/Permissions.ts
@@ -1,4 +1,4 @@
-import factory from 'components/auth/factory';
+import factory from '../factory';
 import messages from './Permissions.intl.json';
 import Body from './PermissionsBody';
 
diff --git a/src/components/auth/recoverPassword/RecoverPassword.js b/src/components/auth/recoverPassword/RecoverPassword.ts
similarity index 85%
rename from src/components/auth/recoverPassword/RecoverPassword.js
rename to src/components/auth/recoverPassword/RecoverPassword.ts
index 61d5247..6a8137f 100644
--- a/src/components/auth/recoverPassword/RecoverPassword.js
+++ b/src/components/auth/recoverPassword/RecoverPassword.ts
@@ -1,5 +1,4 @@
-import factory from 'components/auth/factory';
-
+import factory from '../factory';
 import messages from './RecoverPassword.intl.json';
 import Body from './RecoverPasswordBody';
 
diff --git a/src/components/auth/reducer.test.js b/src/components/auth/reducer.test.ts
similarity index 88%
rename from src/components/auth/reducer.test.js
rename to src/components/auth/reducer.test.ts
index 58d9d76..3134aa2 100644
--- a/src/components/auth/reducer.test.js
+++ b/src/components/auth/reducer.test.ts
@@ -1,12 +1,11 @@
 import expect from 'test/unexpected';
-
-import auth from 'components/auth/reducer';
+import auth from './reducer';
 import {
   setLogin,
   SET_CREDENTIALS,
   setAccountSwitcher,
   SET_SWITCHER,
-} from 'components/auth/actions';
+} from './actions';
 
 describe('components/auth/reducer', () => {
   describe(SET_CREDENTIALS, () => {
@@ -25,7 +24,7 @@ describe('components/auth/reducer', () => {
 
   describe(SET_SWITCHER, () => {
     it('should be enabled by default', () =>
-      expect(auth(undefined, {}), 'to satisfy', {
+      expect(auth(undefined, {} as any), 'to satisfy', {
         isSwitcherEnabled: true,
       }));
 
diff --git a/src/components/auth/reducer.js b/src/components/auth/reducer.ts
similarity index 67%
rename from src/components/auth/reducer.js
rename to src/components/auth/reducer.ts
index ab33052..9bc7ab1 100644
--- a/src/components/auth/reducer.js
+++ b/src/components/auth/reducer.ts
@@ -1,4 +1,3 @@
-// @flow
 import { combineReducers } from 'redux';
 
 import {
@@ -14,15 +13,50 @@ import {
 } from './actions';
 
 type Credentials = {
-  login?: string,
-  password?: string,
-  rememberMe?: boolean,
-  returnUrl?: string,
-  isRelogin?: boolean,
-  isTotpRequired?: boolean,
+  login?: string;
+  password?: string;
+  rememberMe?: boolean;
+  returnUrl?: string;
+  isRelogin?: boolean;
+  isTotpRequired?: boolean;
 };
 
-export default combineReducers<_, { action: string, payload?: mixed }>({
+export interface Client {
+  id: string;
+  name: string;
+  description: string;
+}
+
+export interface State {
+  credentials: Credentials;
+  error:
+    | string
+    | {
+        type: string;
+        payload: { [key: string]: any };
+      };
+  isLoading: boolean;
+  isSwitcherEnabled: boolean;
+  client: Client | null;
+  login: string;
+  oauth: {
+    clientId: string;
+    redirectUrl: string;
+    responseType: string;
+    description: string;
+    scope: string;
+    prompt: string;
+    loginHint: string;
+    state: string;
+    success?: boolean;
+    code?: string;
+    displayCode?: string;
+    acceptRequired?: boolean;
+  } | null;
+  scopes: string[];
+}
+
+export default combineReducers({
   credentials,
   error,
   isLoading,
@@ -52,8 +86,8 @@ function credentials(
     type,
     payload,
   }: {
-    type: string,
-    payload: ?Credentials,
+    type: string;
+    payload: Credentials | null;
   },
 ) {
   if (type === SET_CREDENTIALS) {
@@ -93,7 +127,7 @@ function isLoading(state = false, { type, payload = null }) {
   }
 }
 
-function client(state = null, { type, payload = {} }) {
+function client(state = null, { type, payload }) {
   switch (type) {
     case SET_CLIENT:
       return {
@@ -107,7 +141,7 @@ function client(state = null, { type, payload = {} }) {
   }
 }
 
-function oauth(state = null, { type, payload = {} }) {
+function oauth(state: State | null = null, { type, payload }) {
   switch (type) {
     case SET_OAUTH:
       return {
@@ -149,10 +183,10 @@ function scopes(state = [], { type, payload = [] }) {
   }
 }
 
-export function getLogin(state: Object): ?string {
+export function getLogin(state: { [key: string]: any }): string | null {
   return state.auth.credentials.login || null;
 }
 
-export function getCredentials(state: Object): Credentials {
+export function getCredentials(state: { [key: string]: any }): Credentials {
   return state.auth.credentials;
 }
diff --git a/src/components/auth/register/Register.js b/src/components/auth/register/Register.ts
similarity index 64%
rename from src/components/auth/register/Register.js
rename to src/components/auth/register/Register.ts
index 9061cb7..ac50d6b 100644
--- a/src/components/auth/register/Register.js
+++ b/src/components/auth/register/Register.ts
@@ -1,7 +1,6 @@
-import factory from 'components/auth/factory';
-import activationMessages from 'components/auth/activation/Activation.intl.json';
-import forgotPasswordMessages from 'components/auth/forgotPassword/ForgotPassword.intl.json';
-
+import factory from '../factory';
+import activationMessages from '../activation/Activation.intl.json';
+import forgotPasswordMessages from '../forgotPassword/ForgotPassword.intl.json';
 import messages from './Register.intl.json';
 import Body from './RegisterBody';
 
diff --git a/src/components/auth/resendActivation/ResendActivation.js b/src/components/auth/resendActivation/ResendActivation.ts
similarity index 68%
rename from src/components/auth/resendActivation/ResendActivation.js
rename to src/components/auth/resendActivation/ResendActivation.ts
index c1e3652..b33b817 100644
--- a/src/components/auth/resendActivation/ResendActivation.js
+++ b/src/components/auth/resendActivation/ResendActivation.ts
@@ -1,6 +1,5 @@
-import factory from 'components/auth/factory';
-import forgotPasswordMessages from 'components/auth/forgotPassword/ForgotPassword.intl.json';
-
+import factory from '../factory';
+import forgotPasswordMessages from '../forgotPassword/ForgotPassword.intl.json';
 import messages from './ResendActivation.intl.json';
 import Body from './ResendActivationBody';
 
diff --git a/src/components/contact/ContactForm.test.js b/src/components/contact/ContactForm.test.tsx
similarity index 85%
rename from src/components/contact/ContactForm.test.js
rename to src/components/contact/ContactForm.test.tsx
index 58a5ca8..d58f3c8 100644
--- a/src/components/contact/ContactForm.test.js
+++ b/src/components/contact/ContactForm.test.tsx
@@ -2,16 +2,15 @@ import React from 'react';
 import expect from 'test/unexpected';
 import sinon from 'sinon';
 import { shallow, mount } from 'enzyme';
-
 import { IntlProvider } from 'react-intl';
-
 import feedback from 'services/api/feedback';
+import { User } from 'components/user';
 
-import { ContactForm } from 'components/contact/ContactForm';
+import { ContactForm } from './ContactForm';
 
 describe('ContactForm', () => {
   describe('when rendered', () => {
-    const user = {};
+    const user = {} as User;
     let component;
 
     beforeEach(() => {
@@ -57,7 +56,7 @@ describe('ContactForm', () => {
   describe('when rendered with user', () => {
     const user = {
       email: 'foo@bar.com',
-    };
+    } as User;
     let component;
 
     beforeEach(() => {
@@ -76,11 +75,11 @@ describe('ContactForm', () => {
   describe('when email was successfully sent', () => {
     const user = {
       email: 'foo@bar.com',
-    };
+    } as User;
     let component;
 
     beforeEach(() => {
-      component = shallow(<ContactForm user={{ user }} />);
+      component = shallow(<ContactForm user={user} />);
 
       component.setState({ isSuccessfullySent: true });
     });
@@ -93,7 +92,7 @@ describe('ContactForm', () => {
   xdescribe('validation', () => {
     const user = {
       email: 'foo@bar.com',
-    };
+    } as User;
     let component;
     let wrapper;
 
@@ -102,7 +101,7 @@ describe('ContactForm', () => {
 
       wrapper = mount(
         <IntlProvider locale="en" defaultLocale="en">
-          <ContactForm user={{ user }} ref={el => (component = el)} />
+          <ContactForm user={user} ref={el => (component = el)} />
         </IntlProvider>,
       );
     });
@@ -118,7 +117,7 @@ describe('ContactForm', () => {
   describe('when user submits form', () => {
     const user = {
       email: 'foo@bar.com',
-    };
+    } as User;
     let component;
     let wrapper;
     const requestData = {
@@ -131,14 +130,14 @@ describe('ContactForm', () => {
       sinon.stub(feedback, 'send');
 
       // TODO: add polyfill for from validation for jsdom
-      if (!Element.prototype.checkValidity) {
-        Element.prototype.checkValidity = () => true;
+      if (!(Element.prototype as any).checkValidity) {
+        (Element.prototype as any).checkValidity = () => true;
       }
 
       // TODO: try to rewrite with unexpected-react
       wrapper = mount(
         <IntlProvider locale="en" defaultLocale="en">
-          <ContactForm user={{ user }} ref={el => (component = el)} />
+          <ContactForm user={user} ref={el => (component = el)} />
         </IntlProvider>,
       );
 
@@ -151,7 +150,7 @@ describe('ContactForm', () => {
     });
 
     afterEach(() => {
-      feedback.send.restore();
+      (feedback.send as any).restore();
     });
 
     xit('should call onSubmit', () => {
@@ -163,7 +162,7 @@ describe('ContactForm', () => {
     });
 
     it('should call send with required data', () => {
-      feedback.send.returns(Promise.resolve());
+      (feedback.send as any).returns(Promise.resolve());
 
       component.onSubmit();
 
@@ -171,7 +170,7 @@ describe('ContactForm', () => {
     });
 
     it('should set isSuccessfullySent', () => {
-      feedback.send.returns(Promise.resolve());
+      (feedback.send as any).returns(Promise.resolve());
 
       return component
         .onSubmit()
@@ -181,7 +180,7 @@ describe('ContactForm', () => {
     });
 
     it('should handle isLoading during request', () => {
-      feedback.send.returns(Promise.resolve());
+      (feedback.send as any).returns(Promise.resolve());
 
       const promise = component.onSubmit();
 
@@ -193,7 +192,7 @@ describe('ContactForm', () => {
     });
 
     it('should render success message with user email', () => {
-      feedback.send.returns(Promise.resolve());
+      (feedback.send as any).returns(Promise.resolve());
 
       return component
         .onSubmit()
diff --git a/src/components/contact/ContactForm.js b/src/components/contact/ContactForm.tsx
similarity index 92%
rename from src/components/contact/ContactForm.js
rename to src/components/contact/ContactForm.tsx
index d1ed455..d3db30f 100644
--- a/src/components/contact/ContactForm.js
+++ b/src/components/contact/ContactForm.tsx
@@ -1,5 +1,4 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
+import React from 'react';
 import { connect } from 'react-redux';
 import classNames from 'classnames';
 import { FormattedMessage as Message } from 'react-intl';
@@ -14,7 +13,9 @@ import {
 import feedback from 'services/api/feedback';
 import icons from 'components/ui/icons.scss';
 import popupStyles from 'components/ui/popup/popup.scss';
+import { RootState } from 'reducers';
 import logger from 'services/logger';
+import { User } from 'components/user';
 
 import styles from './contactForm.scss';
 import messages from './contactForm.intl.json';
@@ -28,16 +29,17 @@ const CONTACT_CATEGORIES = [
   <Message key="m5" {...messages.other} />,
 ];
 
-export class ContactForm extends Component {
-  static displayName = 'ContactForm';
-
-  static propTypes = {
-    onClose: PropTypes.func,
-    user: PropTypes.shape({
-      email: PropTypes.string,
-    }).isRequired,
-  };
-
+export class ContactForm extends React.Component<
+  {
+    onClose: () => void;
+    user: User;
+  },
+  {
+    isLoading: boolean;
+    isSuccessfullySent: boolean;
+    lastEmail: string | null;
+  }
+> {
   static defaultProps = {
     onClose() {},
   };
@@ -45,6 +47,7 @@ export class ContactForm extends Component {
   state = {
     isLoading: false,
     isSuccessfullySent: false,
+    lastEmail: null,
   };
 
   form = new FormModel();
@@ -191,6 +194,6 @@ export class ContactForm extends Component {
   };
 }
 
-export default connect(state => ({
+export default connect((state: RootState) => ({
   user: state.user,
 }))(ContactForm);
diff --git a/src/components/contact/ContactLink.js b/src/components/contact/ContactLink.tsx
similarity index 70%
rename from src/components/contact/ContactLink.js
rename to src/components/contact/ContactLink.tsx
index d6f1d86..09d7679 100644
--- a/src/components/contact/ContactLink.js
+++ b/src/components/contact/ContactLink.tsx
@@ -1,15 +1,10 @@
-// @flow
-import type { ElementConfig } from 'react';
 import React from 'react';
 import { connect } from 'react-redux';
 import { create as createPopup } from 'components/ui/popup/actions';
 import ContactForm from './ContactForm';
 
-type OwnProps = $Exact<ElementConfig<'a'>>;
-
-type Props = {
-  ...OwnProps,
-  createContactPopup: () => void,
+type Props = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+  createContactPopup: () => void;
 };
 
 function ContactLink({ createContactPopup, ...props }: Props) {
@@ -27,6 +22,6 @@ function ContactLink({ createContactPopup, ...props }: Props) {
   );
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(null, {
+export default connect(null, {
   createContactPopup: () => createPopup({ Popup: ContactForm }),
 })(ContactLink);
diff --git a/src/components/contact/index.js b/src/components/contact/index.ts
similarity index 84%
rename from src/components/contact/index.js
rename to src/components/contact/index.ts
index c38ebf2..ca1c5cd 100644
--- a/src/components/contact/index.js
+++ b/src/components/contact/index.ts
@@ -1,3 +1 @@
-// @flow
-
 export { default as ContactLink } from './ContactLink';
diff --git a/src/components/dev/apps/ApplicationsIndex.js b/src/components/dev/apps/ApplicationsIndex.tsx
similarity index 89%
rename from src/components/dev/apps/ApplicationsIndex.js
rename to src/components/dev/apps/ApplicationsIndex.tsx
index 034ddc9..e0fbd37 100644
--- a/src/components/dev/apps/ApplicationsIndex.js
+++ b/src/components/dev/apps/ApplicationsIndex.tsx
@@ -1,12 +1,11 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
-import React, { Component } from 'react';
+import React from 'react';
 import classNames from 'classnames';
 import { FormattedMessage as Message } from 'react-intl';
 import { Helmet } from 'react-helmet';
 import { LinkButton } from 'components/ui/form';
 import { COLOR_GREEN, COLOR_BLUE } from 'components/ui';
 import { ContactLink } from 'components/contact';
+import { OauthAppResponse } from 'services/api/oauth';
 
 import styles from './applicationsIndex.scss';
 import messages from './ApplicationsIndex.intl.json';
@@ -16,16 +15,16 @@ import toolsIcon from './icons/tools.svg';
 import ApplicationsList from './list';
 
 type Props = {
-  clientId?: ?string,
-  resetClientId: () => void, // notify parent to remove clientId from current location.href
-  displayForGuest: boolean,
-  applications: Array<OauthAppResponse>,
-  isLoading: boolean,
-  deleteApp: string => Promise<any>,
-  resetApp: (string, boolean) => Promise<any>,
+  clientId: string | null;
+  resetClientId: () => void; // notify parent to remove clientId from current location.href
+  displayForGuest: boolean;
+  applications: Array<OauthAppResponse>;
+  isLoading: boolean;
+  deleteApp: (clientId: string) => Promise<any>;
+  resetApp: (clientId: string, resetClientSecret: boolean) => Promise<any>;
 };
 
-export default class ApplicationsIndex extends Component<Props> {
+export default class ApplicationsIndex extends React.Component<Props> {
   render() {
     return (
       <div className={styles.container}>
diff --git a/src/components/dev/apps/actions.js b/src/components/dev/apps/actions.ts
similarity index 80%
rename from src/components/dev/apps/actions.js
rename to src/components/dev/apps/actions.ts
index b63cf23..795f0bf 100644
--- a/src/components/dev/apps/actions.js
+++ b/src/components/dev/apps/actions.ts
@@ -1,17 +1,16 @@
-// @flow
-import type { Dispatch } from 'redux';
-import type { OauthAppResponse } from 'services/api/oauth';
-import type { User } from 'components/user';
 import oauth from 'services/api/oauth';
+import { Dispatch } from 'redux';
+import { OauthAppResponse } from 'services/api/oauth';
+import { User } from 'components/user';
 
-import type { Apps } from './reducer';
+import { Apps } from './reducer';
 
 type SetAvailableAction = {
-  type: 'apps:setAvailable',
-  payload: Array<OauthAppResponse>,
+  type: 'apps:setAvailable';
+  payload: Array<OauthAppResponse>;
 };
-type DeleteAppAction = { type: 'apps:deleteApp', payload: string };
-type AddAppAction = { type: 'apps:addApp', payload: OauthAppResponse };
+type DeleteAppAction = { type: 'apps:deleteApp'; payload: string };
+type AddAppAction = { type: 'apps:addApp'; payload: OauthAppResponse };
 export type Action = SetAvailableAction | DeleteAppAction | AddAppAction;
 
 export function setAppsList(apps: Array<OauthAppResponse>): SetAvailableAction {
@@ -24,7 +23,7 @@ export function setAppsList(apps: Array<OauthAppResponse>): SetAvailableAction {
 export function getApp(
   state: { apps: Apps },
   clientId: string,
-): ?OauthAppResponse {
+): OauthAppResponse | null {
   return state.apps.available.find(app => app.clientId === clientId) || null;
 }
 
diff --git a/src/components/dev/apps/applicationForm/ApplicationForm.js b/src/components/dev/apps/applicationForm/ApplicationForm.tsx
similarity index 80%
rename from src/components/dev/apps/applicationForm/ApplicationForm.js
rename to src/components/dev/apps/applicationForm/ApplicationForm.tsx
index 722f764..ef4d074 100644
--- a/src/components/dev/apps/applicationForm/ApplicationForm.js
+++ b/src/components/dev/apps/applicationForm/ApplicationForm.tsx
@@ -1,11 +1,9 @@
-// @flow
-import type { ComponentType } from 'react';
-import type { MessageDescriptor } from 'react-intl';
-import type { OauthAppResponse } from 'services/api/oauth';
-import type { ApplicationType } from 'components/dev/apps';
-import React, { Component } from 'react';
+import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { Helmet } from 'react-helmet';
+import { MessageDescriptor } from 'react-intl';
+import { OauthAppResponse } from 'services/api/oauth';
+import { ApplicationType } from 'components/dev/apps';
 import { Form, FormModel, Button } from 'components/ui/form';
 import { BackButton } from 'components/profile/ProfileForm';
 import { COLOR_GREEN } from 'components/ui';
@@ -19,10 +17,10 @@ import WebsiteType from './WebsiteType';
 import MinecraftServerType from './MinecraftServerType';
 
 const typeToForm: {
-  [key: ApplicationType]: {
-    label: MessageDescriptor,
-    component: ComponentType<any>,
-  },
+  [K in ApplicationType]: {
+    label: MessageDescriptor;
+    component: React.ComponentType<any>;
+  };
 } = {
   [TYPE_APPLICATION]: {
     label: messages.website,
@@ -34,21 +32,24 @@ const typeToForm: {
   },
 };
 
-const typeToLabel: {
-  [key: ApplicationType]: MessageDescriptor,
-} = Object.keys(typeToForm).reduce((result, key: ApplicationType) => {
-  result[key] = typeToForm[key].label;
+const typeToLabel = Object.keys(typeToForm).reduce(
+  (result, key: ApplicationType) => {
+    result[key] = typeToForm[key].label;
 
-  return result;
-}, {});
+    return result;
+  },
+  {} as {
+    [K in ApplicationType]: MessageDescriptor;
+  },
+);
 
-export default class ApplicationForm extends Component<{
-  app: OauthAppResponse,
-  form: FormModel,
-  displayTypeSwitcher?: boolean,
-  type: ?ApplicationType,
-  setType: ApplicationType => void,
-  onSubmit: FormModel => Promise<void>,
+export default class ApplicationForm extends React.Component<{
+  app: OauthAppResponse;
+  form: FormModel;
+  displayTypeSwitcher?: boolean;
+  type: ApplicationType | null;
+  setType: (type: ApplicationType) => void;
+  onSubmit: (form: FormModel) => Promise<void>;
 }> {
   static defaultProps = {
     setType: () => {},
diff --git a/src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.js b/src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.tsx
similarity index 72%
rename from src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.js
rename to src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.tsx
index 38e1ed2..35cd424 100644
--- a/src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.js
+++ b/src/components/dev/apps/applicationForm/ApplicationTypeSwitcher.tsx
@@ -1,7 +1,6 @@
-// @flow
-import type { ApplicationType } from 'components/dev/apps';
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { ApplicationType } from 'components/dev/apps';
+import { MessageDescriptor } from 'react-intl';
 import { SKIN_LIGHT } from 'components/ui';
 import { Radio } from 'components/ui/form';
 
@@ -13,10 +12,10 @@ export default function ApplicationTypeSwitcher({
   selectedType,
 }: {
   appTypes: {
-    [key: ApplicationType]: MessageDescriptor,
-  },
-  selectedType: ?ApplicationType,
-  setType: (type: ApplicationType) => void,
+    [K in ApplicationType]: MessageDescriptor;
+  };
+  selectedType: ApplicationType | null;
+  setType: (type: ApplicationType) => void;
 }) {
   return (
     <div>
diff --git a/src/components/dev/apps/applicationForm/MinecraftServerType.js b/src/components/dev/apps/applicationForm/MinecraftServerType.tsx
similarity index 92%
rename from src/components/dev/apps/applicationForm/MinecraftServerType.js
rename to src/components/dev/apps/applicationForm/MinecraftServerType.tsx
index c287dd1..4cf062d 100644
--- a/src/components/dev/apps/applicationForm/MinecraftServerType.js
+++ b/src/components/dev/apps/applicationForm/MinecraftServerType.tsx
@@ -1,10 +1,9 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
 import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
-import styles from 'components/profile/profileForm.scss';
+import { OauthAppResponse } from 'services/api/oauth';
 import { Input, FormModel } from 'components/ui/form';
 import { SKIN_LIGHT } from 'components/ui';
+import styles from 'components/profile/profileForm.scss';
 
 import messages from './ApplicationForm.intl.json';
 
@@ -12,8 +11,8 @@ export default function MinecraftServerType({
   form,
   app,
 }: {
-  form: FormModel,
-  app: OauthAppResponse,
+  form: FormModel;
+  app: OauthAppResponse;
 }) {
   return (
     <div>
diff --git a/src/components/dev/apps/applicationForm/WebsiteType.js b/src/components/dev/apps/applicationForm/WebsiteType.tsx
similarity index 94%
rename from src/components/dev/apps/applicationForm/WebsiteType.js
rename to src/components/dev/apps/applicationForm/WebsiteType.tsx
index 1f422ab..d9012fd 100644
--- a/src/components/dev/apps/applicationForm/WebsiteType.js
+++ b/src/components/dev/apps/applicationForm/WebsiteType.tsx
@@ -1,8 +1,7 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
 import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { Input, TextArea, FormModel } from 'components/ui/form';
+import { OauthAppResponse } from 'services/api/oauth';
 import { SKIN_LIGHT } from 'components/ui';
 import styles from 'components/profile/profileForm.scss';
 
@@ -12,8 +11,8 @@ export default function WebsiteType({
   form,
   app,
 }: {
-  form: FormModel,
-  app: OauthAppResponse,
+  form: FormModel;
+  app: OauthAppResponse;
 }) {
   return (
     <div>
diff --git a/src/components/dev/apps/index.js b/src/components/dev/apps/index.ts
similarity index 95%
rename from src/components/dev/apps/index.js
rename to src/components/dev/apps/index.ts
index 5908c4f..d4554bd 100644
--- a/src/components/dev/apps/index.js
+++ b/src/components/dev/apps/index.ts
@@ -1,4 +1,3 @@
-// @flow
 export type ApplicationType = 'application' | 'minecraft-server';
 export const TYPE_APPLICATION: 'application' = 'application';
 export const TYPE_MINECRAFT_SERVER: 'minecraft-server' = 'minecraft-server';
diff --git a/src/components/dev/apps/list/ApplicationItem.js b/src/components/dev/apps/list/ApplicationItem.tsx
similarity index 90%
rename from src/components/dev/apps/list/ApplicationItem.js
rename to src/components/dev/apps/list/ApplicationItem.tsx
index 7b7bcf5..3db39e3 100644
--- a/src/components/dev/apps/list/ApplicationItem.js
+++ b/src/components/dev/apps/list/ApplicationItem.tsx
@@ -1,11 +1,10 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
-import React, { Component } from 'react';
+import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { Link } from 'react-router-dom';
 import classNames from 'classnames';
 import { SKIN_LIGHT, COLOR_BLACK, COLOR_RED } from 'components/ui';
 import { Input, Button } from 'components/ui/form';
+import { OauthAppResponse } from 'services/api/oauth';
 import Collapse from 'components/ui/collapse';
 
 import styles from '../applicationsIndex.scss';
@@ -29,29 +28,34 @@ const actionButtons = [
   },
 ];
 
-export default class ApplicationItem extends Component<
+interface State {
+  selectedAction: string | null;
+  isActionPerforming: boolean;
+  detailsHeight: number;
+  translateY: number;
+}
+
+export default class ApplicationItem extends React.Component<
   {
-    application: OauthAppResponse,
-    expand: boolean,
-    onTileClick: string => void,
-    onResetSubmit: (string, boolean) => Promise<*>,
-    onDeleteSubmit: string => Promise<*>,
-  },
-  {
-    selectedAction: ?string,
-    isActionPerforming: boolean,
-    detailsHeight: number,
-    translateY: number,
+    application: OauthAppResponse;
+    expand: boolean;
+    onTileClick: (clientId: string) => void;
+    onResetSubmit: (
+      clientId: string,
+      resetClientSecret: boolean,
+    ) => Promise<void>;
+    onDeleteSubmit: (clientId: string) => Promise<void>;
   },
+  State
 > {
-  state = {
+  state: State = {
     selectedAction: null,
     isActionPerforming: false,
     translateY: 0,
     detailsHeight: 0,
   };
 
-  actionContainer: ?HTMLDivElement;
+  actionContainer: HTMLDivElement | null;
 
   render() {
     const { application: app, expand } = this.props;
@@ -137,7 +141,7 @@ export default class ApplicationItem extends Component<
                   label={label}
                   color={COLOR_BLACK}
                   className={styles.appActionButton}
-                  disabled={selectedAction && selectedAction !== type}
+                  disabled={!!selectedAction && selectedAction !== type}
                   onClick={this.onActionButtonClick(type)}
                   small
                 />
@@ -237,7 +241,7 @@ export default class ApplicationItem extends Component<
     }
   }
 
-  setActiveAction = (type: ?string) => {
+  setActiveAction = (type: string | null) => {
     const { actionContainer } = this;
 
     if (!actionContainer) {
@@ -268,7 +272,7 @@ export default class ApplicationItem extends Component<
     }
   };
 
-  onActionButtonClick = (type: ?string) => () => {
+  onActionButtonClick = (type: string | null) => () => {
     this.setActiveAction(type === this.state.selectedAction ? null : type);
   };
 
diff --git a/src/components/dev/apps/list/ApplicationsList.js b/src/components/dev/apps/list/ApplicationsList.tsx
similarity index 88%
rename from src/components/dev/apps/list/ApplicationsList.js
rename to src/components/dev/apps/list/ApplicationsList.tsx
index 42134a8..f72cbd8 100644
--- a/src/components/dev/apps/list/ApplicationsList.js
+++ b/src/components/dev/apps/list/ApplicationsList.tsx
@@ -1,25 +1,24 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
 import React from 'react';
 import { restoreScroll } from 'components/ui/scroll/scroll';
 import { FormattedMessage as Message } from 'react-intl';
 import { LinkButton } from 'components/ui/form';
 import { COLOR_GREEN } from 'components/ui';
+import { OauthAppResponse } from 'services/api/oauth';
 
 import messages from '../ApplicationsIndex.intl.json';
 import styles from '../applicationsIndex.scss';
 import ApplicationItem from './ApplicationItem';
 
 type Props = {
-  applications: Array<OauthAppResponse>,
-  deleteApp: string => Promise<any>,
-  resetApp: (string, boolean) => Promise<any>,
-  resetClientId: () => void,
-  clientId: ?string,
+  applications: OauthAppResponse[];
+  deleteApp: (clientId: string) => Promise<any>;
+  resetApp: (clientId: string, resetClientSecret: boolean) => Promise<any>;
+  resetClientId: () => void;
+  clientId: string | null;
 };
 
 type State = {
-  expandedApp: ?string,
+  expandedApp: string | null;
 };
 
 export default class ApplicationsList extends React.Component<Props, State> {
@@ -27,7 +26,7 @@ export default class ApplicationsList extends React.Component<Props, State> {
     expandedApp: null,
   };
 
-  appsRefs: { [key: string]: ?HTMLDivElement } = {};
+  appsRefs: { [key: string]: HTMLDivElement | null } = {};
 
   componentDidMount() {
     this.checkForActiveApp();
diff --git a/src/components/dev/apps/list/index.js b/src/components/dev/apps/list/index.ts
similarity index 82%
rename from src/components/dev/apps/list/index.js
rename to src/components/dev/apps/list/index.ts
index 1a047aa..34f1107 100644
--- a/src/components/dev/apps/list/index.js
+++ b/src/components/dev/apps/list/index.ts
@@ -1,3 +1 @@
-// @flow
-
 export { default } from './ApplicationsList';
diff --git a/src/components/dev/apps/reducer.js b/src/components/dev/apps/reducer.ts
similarity index 78%
rename from src/components/dev/apps/reducer.js
rename to src/components/dev/apps/reducer.ts
index 1225f05..34e6ac1 100644
--- a/src/components/dev/apps/reducer.js
+++ b/src/components/dev/apps/reducer.ts
@@ -1,11 +1,10 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
+import { OauthAppResponse } from 'services/api/oauth';
 
-import type { Action } from './actions';
+import { Action } from './actions';
 
-export type Apps = {|
-  +available: OauthAppResponse[],
-|};
+export interface Apps {
+  available: OauthAppResponse[];
+}
 
 const defaults: Apps = {
   available: [],
@@ -45,8 +44,7 @@ export default function apps(state: Apps = defaults, action: Action): Apps {
       };
 
     default:
-      (action.type: empty);
-
-      return state;
   }
+
+  return state;
 }
diff --git a/src/components/footerMenu/FooterMenu.js b/src/components/footerMenu/FooterMenu.tsx
similarity index 79%
rename from src/components/footerMenu/FooterMenu.js
rename to src/components/footerMenu/FooterMenu.tsx
index 3a3dd39..971135e 100644
--- a/src/components/footerMenu/FooterMenu.js
+++ b/src/components/footerMenu/FooterMenu.tsx
@@ -1,5 +1,4 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import { connect } from 'react-redux';
 import { Link } from 'react-router-dom';
 import { FormattedMessage as Message } from 'react-intl';
@@ -10,18 +9,11 @@ import { ContactLink } from 'components/contact';
 import styles from './footerMenu.scss';
 import messages from './footerMenu.intl.json';
 
-type OwnProps = {|
-  createContactPopup: () => void,
-|};
-
 type Props = {
-  ...OwnProps,
-  createLanguageSwitcherPopup: () => void,
+  createLanguageSwitcherPopup: () => void;
 };
 
-class FooterMenu extends Component<Props> {
-  static displayName = 'FooterMenu';
-
+class FooterMenu extends React.Component<Props> {
   render() {
     return (
       <div className={styles.footerMenu}>
@@ -51,7 +43,7 @@ class FooterMenu extends Component<Props> {
     );
   }
 
-  onLanguageSwitcher = (event: SyntheticMouseEvent<HTMLElement>) => {
+  onLanguageSwitcher = (event: React.MouseEvent<HTMLElement>) => {
     event.preventDefault();
 
     this.props.createLanguageSwitcherPopup();
@@ -60,7 +52,7 @@ class FooterMenu extends Component<Props> {
 
 // mark this component, as not pure, because it is stateless,
 // but should be re-rendered, if current lang was changed
-export default connect<Props, OwnProps, _, _, _, _>(
+export default connect(
   null,
   {
     createLanguageSwitcherPopup: () => createPopup({ Popup: LanguageSwitcher }),
diff --git a/src/components/footerMenu/index.js b/src/components/footerMenu/index.ts
similarity index 100%
rename from src/components/footerMenu/index.js
rename to src/components/footerMenu/index.ts
diff --git a/src/components/i18n/IntlProvider.js b/src/components/i18n/IntlProvider.tsx
similarity index 62%
rename from src/components/i18n/IntlProvider.js
rename to src/components/i18n/IntlProvider.tsx
index 98092c1..daf7fe3 100644
--- a/src/components/i18n/IntlProvider.js
+++ b/src/components/i18n/IntlProvider.tsx
@@ -1,18 +1,12 @@
-// @flow
-import type { Node } from 'react';
-import type { IntlShape } from 'react-intl';
 import React, { useState, useEffect } from 'react';
 import { connect } from 'react-redux';
-import { RawIntlProvider } from 'react-intl';
+import { RawIntlProvider, IntlShape } from 'react-intl';
 import i18n from 'services/i18n';
-
-type OwnProps = {|
-  children: Node,
-|};
+import { RootState } from 'reducers';
 
 type Props = {
-  ...OwnProps,
-  locale: string,
+  children: React.ReactNode;
+  locale: string;
 };
 
 function IntlProvider({ children, locale }: Props) {
@@ -27,6 +21,6 @@ function IntlProvider({ children, locale }: Props) {
   return <RawIntlProvider value={intl}>{children}</RawIntlProvider>;
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(({ i18n }) => i18n)(
+export default connect(({ i18n: i18nState }: RootState) => i18nState)(
   IntlProvider,
 );
diff --git a/src/components/i18n/actions.js b/src/components/i18n/actions.ts
similarity index 78%
rename from src/components/i18n/actions.js
rename to src/components/i18n/actions.ts
index 39927c0..fdae4bc 100644
--- a/src/components/i18n/actions.js
+++ b/src/components/i18n/actions.ts
@@ -1,9 +1,10 @@
-// @flow
 import i18n from 'services/i18n';
 
 export const SET_LOCALE = 'i18n:setLocale';
 export function setLocale(desiredLocale: string) {
-  return async (dispatch: (action: Object) => any): Promise<string> => {
+  return async (
+    dispatch: (action: { [key: string]: any }) => any,
+  ): Promise<string> => {
     const locale = i18n.detectLanguage(desiredLocale);
 
     dispatch(_setLocale(locale));
diff --git a/src/components/i18n/index.js b/src/components/i18n/index.ts
similarity index 92%
rename from src/components/i18n/index.js
rename to src/components/i18n/index.ts
index 7668654..cd42dfd 100644
--- a/src/components/i18n/index.js
+++ b/src/components/i18n/index.ts
@@ -1,3 +1,2 @@
-// @flow
 export { default as IntlProvider } from './IntlProvider';
 export { default as localeFlags } from './localeFlags';
diff --git a/src/components/i18n/localeFlags.js b/src/components/i18n/localeFlags.ts
similarity index 80%
rename from src/components/i18n/localeFlags.js
rename to src/components/i18n/localeFlags.ts
index 73df542..bb7ce0b 100644
--- a/src/components/i18n/localeFlags.js
+++ b/src/components/i18n/localeFlags.ts
@@ -1,5 +1,4 @@
-// @flow
-import supportedLocales from 'i18n/index.json';
+import supportedLocales from 'i18n';
 
 const localeToCountryCode = {
   en: 'gb',
@@ -11,10 +10,10 @@ const localeToCountryCode = {
   sr: 'rs',
   zh: 'cn',
 };
-const SUPPORTED_LANGUAGES: Array<string> = Object.keys(supportedLocales);
+const SUPPORTED_LANGUAGES: string[] = Object.keys(supportedLocales);
 
 export default {
-  getCountryList(): Array<string> {
+  getCountryList(): string[] {
     return SUPPORTED_LANGUAGES.map(
       locale => localeToCountryCode[locale] || locale,
     );
diff --git a/src/components/i18n/reducer.js b/src/components/i18n/reducer.ts
similarity index 73%
rename from src/components/i18n/reducer.js
rename to src/components/i18n/reducer.ts
index 3fcd033..56694ed 100644
--- a/src/components/i18n/reducer.js
+++ b/src/components/i18n/reducer.ts
@@ -1,9 +1,8 @@
-// @flow
 import i18n from 'services/i18n';
 
 import { SET_LOCALE } from './actions';
 
-type State = { locale: string };
+export type State = { locale: string };
 
 const defaultState = {
   locale: i18n.detectLanguage(),
@@ -11,7 +10,7 @@ const defaultState = {
 
 export default function(
   state: State = defaultState,
-  { type, payload }: { type: string, payload: State },
+  { type, payload }: { type: string; payload: State },
 ): State {
   if (type === SET_LOCALE) {
     return payload;
diff --git a/src/components/languageSwitcher/LanguageList.js b/src/components/languageSwitcher/LanguageList.tsx
similarity index 93%
rename from src/components/languageSwitcher/LanguageList.js
rename to src/components/languageSwitcher/LanguageList.tsx
index ab91a95..5d1bfff 100644
--- a/src/components/languageSwitcher/LanguageList.js
+++ b/src/components/languageSwitcher/LanguageList.tsx
@@ -1,11 +1,11 @@
-// @flow
-
 import React from 'react';
 import { TransitionMotion, spring, presets } from 'react-motion';
 import { FormattedMessage as Message } from 'react-intl';
 import classNames from 'classnames';
+
 import LocaleItem from './LocaleItem';
 import messages from './languageSwitcher.intl.json';
+import { LocalesMap } from './LanguageSwitcher';
 import styles from './languageSwitcher.scss';
 
 import thatFuckingPumpkin from './images/that_fucking_pumpkin.svg';
@@ -13,16 +13,14 @@ import mayTheForceBeWithYou from './images/may_the_force_be_with_you.svg';
 import biteMyShinyMetalAss from './images/bite_my_shiny_metal_ass.svg';
 import iTookAnArrowInMyKnee from './images/i_took_an_arrow_in_my_knee.svg';
 
-import type { LocalesMap } from './LanguageSwitcher';
-
 const itemHeight = 51;
 
 export default class LanguageList extends React.Component<{
-  selectedLocale: string,
-  langs: LocalesMap,
-  onChangeLang: (lang: string) => void,
+  selectedLocale: string;
+  langs: LocalesMap;
+  onChangeLang: (lang: string) => void;
 }> {
-  emptyListStateInner: ?HTMLDivElement;
+  emptyListStateInner: HTMLDivElement | null;
 
   render() {
     const { selectedLocale, langs } = this.props;
@@ -51,7 +49,7 @@ export default class LanguageList extends React.Component<{
               }}
             >
               <div
-                ref={(elem: ?HTMLDivElement) =>
+                ref={(elem: HTMLDivElement | null) =>
                   (this.emptyListStateInner = elem)
                 }
                 className={styles.emptyLanguagesList}
@@ -114,7 +112,7 @@ export default class LanguageList extends React.Component<{
   }
 
   onChangeLang(lang: string) {
-    return (event: SyntheticMouseEvent<HTMLElement>) => {
+    return (event: React.MouseEvent<HTMLElement>) => {
       event.preventDefault();
 
       this.props.onChangeLang(lang);
diff --git a/src/components/languageSwitcher/LanguageSwitcher.js b/src/components/languageSwitcher/LanguageSwitcher.tsx
similarity index 82%
rename from src/components/languageSwitcher/LanguageSwitcher.js
rename to src/components/languageSwitcher/LanguageSwitcher.tsx
index 7e60b4e..233da34 100644
--- a/src/components/languageSwitcher/LanguageSwitcher.js
+++ b/src/components/languageSwitcher/LanguageSwitcher.tsx
@@ -1,11 +1,9 @@
-// @flow
-import type { IntlShape } from 'react-intl';
-import React, { Component } from 'react';
-import { FormattedMessage as Message, injectIntl } from 'react-intl';
+import React from 'react';
+import { FormattedMessage as Message, injectIntl, IntlShape } from 'react-intl';
 import classNames from 'classnames';
 import { connect } from 'react-redux';
 import { changeLang } from 'components/user/actions';
-import LANGS from 'i18n/index.json';
+import LANGS from 'i18n';
 import formStyles from 'components/ui/form/form.scss';
 import popupStyles from 'components/ui/popup/popup.scss';
 import icons from 'components/ui/icons.scss';
@@ -13,41 +11,41 @@ import icons from 'components/ui/icons.scss';
 import styles from './languageSwitcher.scss';
 import messages from './languageSwitcher.intl.json';
 import LanguageList from './LanguageList';
+import { RootState } from 'reducers';
 
 const translateUrl = 'http://ely.by/translate';
 
 export type LocaleData = {
-  code: string,
-  name: string,
-  englishName: string,
-  progress: number,
-  isReleased: boolean,
+  code: string;
+  name: string;
+  englishName: string;
+  progress: number;
+  isReleased: boolean;
 };
 
 export type LocalesMap = { [code: string]: LocaleData };
 
-type OwnProps = {|
-  onClose: () => void,
-  langs: LocalesMap,
+type OwnProps = {
+  onClose: () => void;
+  langs: LocalesMap;
   emptyCaptions: Array<{
-    src: string,
-    caption: string,
-  }>,
-|};
-
-type Props = {
-  ...OwnProps,
-  intl: IntlShape,
-  selectedLocale: string,
-  changeLang: (lang: string) => void,
+    src: string;
+    caption: string;
+  }>;
 };
 
-class LanguageSwitcher extends Component<
+interface Props extends OwnProps {
+  intl: IntlShape;
+  selectedLocale: string;
+  changeLang: (lang: string) => void;
+}
+
+class LanguageSwitcher extends React.Component<
   Props,
   {
-    filter: string,
-    filteredLangs: LocalesMap,
-  },
+    filter: string;
+    filteredLangs: LocalesMap;
+  }
 > {
   state = {
     filter: '',
@@ -125,7 +123,7 @@ class LanguageSwitcher extends Component<
     setTimeout(this.props.onClose, 300);
   }
 
-  onFilterUpdate = (event: SyntheticInputEvent<HTMLInputElement>) => {
+  onFilterUpdate = (event: React.ChangeEvent<HTMLInputElement>) => {
     const filter = event.currentTarget.value.trim().toLowerCase();
     const { langs } = this.props;
 
@@ -149,7 +147,7 @@ class LanguageSwitcher extends Component<
   };
 
   onFilterKeyPress() {
-    return (event: SyntheticKeyboardEvent<HTMLInputElement>) => {
+    return (event: React.KeyboardEvent<HTMLInputElement>) => {
       if (event.key !== 'Enter' || this.state.filter === '') {
         return;
       }
@@ -166,8 +164,8 @@ class LanguageSwitcher extends Component<
 }
 
 export default injectIntl(
-  connect<Props, OwnProps, _, _, _, _>(
-    state => ({
+  connect(
+    (state: RootState) => ({
       selectedLocale: state.i18n.locale,
     }),
     {
diff --git a/src/components/languageSwitcher/LocaleItem.js b/src/components/languageSwitcher/LocaleItem.tsx
similarity index 94%
rename from src/components/languageSwitcher/LocaleItem.js
rename to src/components/languageSwitcher/LocaleItem.tsx
index 266c4ae..5363016 100644
--- a/src/components/languageSwitcher/LocaleItem.js
+++ b/src/components/languageSwitcher/LocaleItem.tsx
@@ -1,11 +1,10 @@
-// @flow
 import React from 'react';
-
 import { localeFlags } from 'components/i18n';
 import { FormattedMessage as Message } from 'react-intl';
+
 import messages from './languageSwitcher.intl.json';
 import styles from './languageSwitcher.scss';
-import type { LocaleData } from './LanguageSwitcher';
+import { LocaleData } from './LanguageSwitcher';
 
 export default function LocaleItem({ locale }: { locale: LocaleData }) {
   const { code, name, englishName, progress, isReleased } = locale;
diff --git a/src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.js b/src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.tsx
similarity index 82%
rename from src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.js
rename to src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.tsx
index 602db09..34ac809 100644
--- a/src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.js
+++ b/src/components/languageSwitcher/changeLanguageLink/ChangeLanguageLink.tsx
@@ -1,21 +1,18 @@
-// @flow
 import React from 'react';
 import classNames from 'classnames';
 import { localeFlags } from 'components/i18n';
-import LANGS from 'i18n/index.json';
+import LANGS from 'i18n';
 import { connect } from 'react-redux';
 import { create as createPopup } from 'components/ui/popup/actions';
 import LanguageSwitcher from 'components/languageSwitcher';
+import { RootState } from 'reducers';
 
 import styles from './link.scss';
 
-type OwnProps = {||};
-
 type Props = {
-  ...OwnProps,
-  userLang: string,
-  interfaceLocale: string,
-  showLanguageSwitcherPopup: Function,
+  userLang: string;
+  interfaceLocale: string;
+  showLanguageSwitcherPopup: (event: React.MouseEvent<HTMLSpanElement>) => void;
 };
 
 function LanguageLink({
@@ -45,8 +42,8 @@ function LanguageLink({
   );
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
-  state => ({
+export default connect(
+  (state: RootState) => ({
     userLang: state.user.lang,
     interfaceLocale: state.i18n.locale,
   }),
diff --git a/src/components/languageSwitcher/index.js b/src/components/languageSwitcher/index.ts
similarity index 93%
rename from src/components/languageSwitcher/index.js
rename to src/components/languageSwitcher/index.ts
index d0aa598..9bdfb7b 100644
--- a/src/components/languageSwitcher/index.js
+++ b/src/components/languageSwitcher/index.ts
@@ -1,3 +1,2 @@
-// @flow
 export { default } from './LanguageSwitcher';
 export { default as ChangeLanguageLink } from './changeLanguageLink/ChangeLanguageLink';
diff --git a/src/components/profile/Profile.js b/src/components/profile/Profile.tsx
similarity index 93%
rename from src/components/profile/Profile.js
rename to src/components/profile/Profile.tsx
index 28ae4e6..3a4946b 100644
--- a/src/components/profile/Profile.js
+++ b/src/components/profile/Profile.tsx
@@ -1,30 +1,26 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import { connect } from 'react-redux';
 import { FormattedMessage as Message } from 'react-intl';
 import { Link } from 'react-router-dom';
 import Helmet from 'react-helmet';
 import { ChangeLanguageLink } from 'components/languageSwitcher';
 import { RelativeTime } from 'components/ui';
+import { User } from 'components/user';
+import RulesPage from 'pages/rules/RulesPage';
+import { RootState } from 'reducers';
 
 import ProfileField from './ProfileField';
 import styles from './profile.scss';
 import profileForm from './profileForm.scss';
 import messages from './Profile.intl.json';
-import RulesPage from 'pages/rules/RulesPage';
-
-import type { User } from 'components/user';
-
-type OwnProps = {||};
 
 type Props = {
-  ...OwnProps,
-  user: User,
-  interfaceLocale: string,
+  user: User;
+  interfaceLocale: string;
 };
 
-class Profile extends Component<Props> {
-  UUID: ?HTMLElement;
+class Profile extends React.Component<Props> {
+  UUID: HTMLElement | null;
 
   render() {
     const { user, interfaceLocale } = this.props;
@@ -172,6 +168,11 @@ class Profile extends Component<Props> {
 
     try {
       const selection = window.getSelection();
+
+      if (!selection) {
+        return;
+      }
+
       const range = document.createRange();
       range.selectNodeContents(el);
       selection.removeAllRanges();
@@ -181,12 +182,12 @@ class Profile extends Component<Props> {
     }
   }
 
-  setUUID(el: ?HTMLElement) {
+  setUUID(el: HTMLElement | null) {
     this.UUID = el;
   }
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(({ user, i18n }) => ({
+export default connect(({ user, i18n }: RootState) => ({
   user,
   interfaceLocale: i18n.locale,
 }))(Profile);
diff --git a/src/components/profile/ProfileField.js b/src/components/profile/ProfileField.js
index 1ca346c..c0154c6 100644
--- a/src/components/profile/ProfileField.js
+++ b/src/components/profile/ProfileField.js
@@ -1,12 +1,10 @@
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
+import React from 'react';
 import { Link } from 'react-router-dom';
 
 import styles from './profile.scss';
 
-export default class ProfileField extends Component {
-  static displayName = 'ProfileField';
+export default class ProfileField extends React.Component {
   static propTypes = {
     label: PropTypes.oneOfType([PropTypes.string, PropTypes.element])
       .isRequired,
diff --git a/src/components/profile/ProfileForm.js b/src/components/profile/ProfileForm.tsx
similarity index 92%
rename from src/components/profile/ProfileForm.js
rename to src/components/profile/ProfileForm.tsx
index ebe949c..4d6edec 100644
--- a/src/components/profile/ProfileForm.js
+++ b/src/components/profile/ProfileForm.tsx
@@ -1,20 +1,14 @@
-// @flow
 import React from 'react';
-
 import { FormattedMessage as Message } from 'react-intl';
 import { Link } from 'react-router-dom';
-
 import FormComponent from 'components/ui/form/FormComponent';
-
 import styles from 'components/profile/profileForm.scss';
 
 import messages from './ProfileForm.intl.json';
 
 export class BackButton extends FormComponent<{
-  to: string,
+  to: string;
 }> {
-  static displayName = 'BackButton';
-
   static defaultProps = {
     to: '/',
   };
diff --git a/src/components/profile/changeEmail/ChangeEmail.js b/src/components/profile/changeEmail/ChangeEmail.js
index d7ef602..8d9c7a0 100644
--- a/src/components/profile/changeEmail/ChangeEmail.js
+++ b/src/components/profile/changeEmail/ChangeEmail.js
@@ -36,6 +36,8 @@ export default class ChangeEmail extends Component {
                     \`${componentName}\`. Validation failed.`,
           );
         }
+
+        return null;
       },
     ),
     onSubmit: PropTypes.func.isRequired,
@@ -120,7 +122,6 @@ export default class ChangeEmail extends Component {
                   ? messages.changeEmailButton
                   : messages.sendEmailButton
               }
-              onClick={this.onSubmit}
             />
           </div>
 
diff --git a/src/components/profile/multiFactorAuth/MfaDisable.js b/src/components/profile/multiFactorAuth/MfaDisable.tsx
similarity index 69%
rename from src/components/profile/multiFactorAuth/MfaDisable.js
rename to src/components/profile/multiFactorAuth/MfaDisable.tsx
index 9cafa35..670835f 100644
--- a/src/components/profile/multiFactorAuth/MfaDisable.js
+++ b/src/components/profile/multiFactorAuth/MfaDisable.tsx
@@ -1,29 +1,28 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
-
 import logger from 'services/logger';
 import { disable as disableMFA } from 'services/api/mfa';
+import { FormModel } from 'components/ui/form';
 
 import MfaDisableForm from './disableForm/MfaDisableForm';
 import MfaStatus from './status/MfaStatus';
 
-import type { FormModel } from 'components/ui/form';
-
-export default class MfaDisable extends Component<
+export default class MfaDisable extends React.Component<
   {
-    onSubmit: (form: FormModel, sendData: () => Promise<*>) => Promise<*>,
-    onComplete: Function,
+    onSubmit: (form: FormModel, sendData: () => Promise<void>) => Promise<void>;
+    onComplete: () => void;
   },
   {
-    showForm?: boolean,
-  },
+    showForm: boolean;
+  }
 > {
   static contextTypes = {
     userId: PropTypes.number.isRequired,
   };
 
-  state = {};
+  state = {
+    showForm: false,
+  };
 
   render() {
     const { showForm } = this.state;
@@ -40,9 +39,9 @@ export default class MfaDisable extends Component<
   onSubmit = (form: FormModel) => {
     return this.props
       .onSubmit(form, () => {
-        const data = form.serialize();
+        const { totp } = form.serialize() as { totp: string };
 
-        return disableMFA(this.context.userId, data);
+        return disableMFA(this.context.userId, totp);
       })
       .then(() => this.props.onComplete())
       .catch(resp => {
diff --git a/src/components/profile/multiFactorAuth/MfaEnable.js b/src/components/profile/multiFactorAuth/MfaEnable.tsx
similarity index 90%
rename from src/components/profile/multiFactorAuth/MfaEnable.js
rename to src/components/profile/multiFactorAuth/MfaEnable.tsx
index d5152ad..c690255 100644
--- a/src/components/profile/multiFactorAuth/MfaEnable.js
+++ b/src/components/profile/multiFactorAuth/MfaEnable.tsx
@@ -1,7 +1,5 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
-
 import { Button, FormModel } from 'components/ui/form';
 import styles from 'components/profile/profileForm.scss';
 import Stepper from 'components/ui/stepper';
@@ -9,23 +7,22 @@ import { SlideMotion } from 'components/ui/motion';
 import { ScrollIntoView } from 'components/ui/scroll';
 import logger from 'services/logger';
 import { getSecret, enable as enableMFA } from 'services/api/mfa';
+import { Form } from 'components/ui/form';
 
 import Instructions from './instructions';
 import KeyForm from './keyForm';
 import Confirmation from './confirmation';
 import messages from './MultiFactorAuth.intl.json';
 
-import type { Form } from 'components/ui/form';
-
 const STEPS_TOTAL = 3;
 
 export type MfaStep = 0 | 1 | 2;
 type Props = {
-  onChangeStep: Function,
-  confirmationForm: FormModel,
-  onSubmit: (form: FormModel, sendData: () => Promise<*>) => Promise<*>,
-  onComplete: Function,
-  step: MfaStep,
+  onChangeStep: (nextStep: number) => void;
+  confirmationForm: FormModel;
+  onSubmit: (form: FormModel, sendData: () => Promise<void>) => Promise<void>;
+  onComplete: () => void;
+  step: MfaStep;
 };
 
 interface State {
@@ -35,7 +32,7 @@ interface State {
   qrCodeSrc: string;
 }
 
-export default class MfaEnable extends Component<Props, State> {
+export default class MfaEnable extends React.Component<Props, State> {
   static defaultProps = {
     confirmationForm: new FormModel(),
     step: 0,
@@ -52,7 +49,7 @@ export default class MfaEnable extends Component<Props, State> {
     secret: '',
   };
 
-  confirmationFormEl: ?Form;
+  confirmationFormEl: Form | null;
 
   componentWillMount() {
     this.syncState(this.props);
@@ -153,7 +150,7 @@ export default class MfaEnable extends Component<Props, State> {
     }
   }
 
-  onTotpSubmit = (form: FormModel): Promise<*> => {
+  onTotpSubmit = (form: FormModel): Promise<void> => {
     this.setState({ isLoading: true });
 
     return this.props
diff --git a/src/components/profile/multiFactorAuth/MultiFactorAuth.js b/src/components/profile/multiFactorAuth/MultiFactorAuth.tsx
similarity index 80%
rename from src/components/profile/multiFactorAuth/MultiFactorAuth.js
rename to src/components/profile/multiFactorAuth/MultiFactorAuth.tsx
index 1604301..b7b479e 100644
--- a/src/components/profile/multiFactorAuth/MultiFactorAuth.js
+++ b/src/components/profile/multiFactorAuth/MultiFactorAuth.tsx
@@ -1,23 +1,20 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import Helmet from 'react-helmet';
 import { FormattedMessage as Message } from 'react-intl';
-
 import styles from 'components/profile/profileForm.scss';
 import { BackButton } from 'components/profile/ProfileForm';
+import { FormModel } from 'components/ui/form';
 
-import MfaEnable from './MfaEnable';
+import MfaEnable, { MfaStep } from './MfaEnable';
 import MfaDisable from './MfaDisable';
 import messages from './MultiFactorAuth.intl.json';
 
-import type { MfaStep } from './MfaEnable';
-
-class MultiFactorAuth extends Component<{
-  step: MfaStep,
-  isMfaEnabled: boolean,
-  onSubmit: Function,
-  onComplete: Function,
-  onChangeStep: Function,
+class MultiFactorAuth extends React.Component<{
+  step: MfaStep;
+  isMfaEnabled: boolean;
+  onSubmit: (form: FormModel, sendData: () => Promise<void>) => Promise<void>;
+  onComplete: () => void;
+  onChangeStep: (nextStep: number) => void;
 }> {
   render() {
     const {
diff --git a/src/components/profile/multiFactorAuth/confirmation/Confirmation.js b/src/components/profile/multiFactorAuth/confirmation/Confirmation.tsx
similarity index 88%
rename from src/components/profile/multiFactorAuth/confirmation/Confirmation.js
rename to src/components/profile/multiFactorAuth/confirmation/Confirmation.tsx
index 67d78cf..cf882aa 100644
--- a/src/components/profile/multiFactorAuth/confirmation/Confirmation.js
+++ b/src/components/profile/multiFactorAuth/confirmation/Confirmation.tsx
@@ -1,8 +1,5 @@
-// @flow
 import React from 'react';
-
 import { FormattedMessage as Message } from 'react-intl';
-
 import { Input, Form, FormModel } from 'components/ui/form';
 
 import profileForm from 'components/profile/profileForm.scss';
@@ -14,10 +11,10 @@ export default function Confirmation({
   onSubmit,
   onInvalid,
 }: {
-  form: FormModel,
-  formRef?: (el: ?Form) => void,
-  onSubmit: () => Promise<*>,
-  onInvalid: Function,
+  form: FormModel;
+  formRef?: (el: Form | null) => void;
+  onSubmit: (form: FormModel) => Promise<void>;
+  onInvalid: () => void;
 }) {
   return (
     <Form form={form} onSubmit={onSubmit} onInvalid={onInvalid} ref={formRef}>
diff --git a/src/components/profile/multiFactorAuth/confirmation/index.js b/src/components/profile/multiFactorAuth/confirmation/index.ts
similarity index 82%
rename from src/components/profile/multiFactorAuth/confirmation/index.js
rename to src/components/profile/multiFactorAuth/confirmation/index.ts
index 7a16691..5cce27f 100644
--- a/src/components/profile/multiFactorAuth/confirmation/index.js
+++ b/src/components/profile/multiFactorAuth/confirmation/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default } from './Confirmation';
diff --git a/src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.js b/src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.tsx
similarity index 89%
rename from src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.js
rename to src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.tsx
index 3a2301a..498b5a5 100644
--- a/src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.js
+++ b/src/components/profile/multiFactorAuth/disableForm/MfaDisableForm.tsx
@@ -1,15 +1,13 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
-
 import { Button, Input, Form, FormModel } from 'components/ui/form';
 import styles from 'components/profile/profileForm.scss';
 
 import messages from '../MultiFactorAuth.intl.json';
 import mfaStyles from '../mfa.scss';
 
-export default class MfaDisableForm extends Component<{
-  onSubmit: (form: FormModel) => Promise<*>,
+export default class MfaDisableForm extends React.Component<{
+  onSubmit: (form: FormModel) => Promise<void>;
 }> {
   form: FormModel = new FormModel();
 
diff --git a/src/components/profile/multiFactorAuth/index.js b/src/components/profile/multiFactorAuth/index.js
deleted file mode 100644
index ba6b0c9..0000000
--- a/src/components/profile/multiFactorAuth/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-export { default } from './MultiFactorAuth';
-export type { MfaStep } from './MfaEnable';
diff --git a/src/components/profile/multiFactorAuth/index.ts b/src/components/profile/multiFactorAuth/index.ts
new file mode 100644
index 0000000..dfe1a17
--- /dev/null
+++ b/src/components/profile/multiFactorAuth/index.ts
@@ -0,0 +1,2 @@
+export { default } from './MultiFactorAuth';
+export { MfaStep } from './MfaEnable';
diff --git a/src/components/profile/multiFactorAuth/instructions/Instructions.js b/src/components/profile/multiFactorAuth/instructions/Instructions.tsx
similarity index 87%
rename from src/components/profile/multiFactorAuth/instructions/Instructions.js
rename to src/components/profile/multiFactorAuth/instructions/Instructions.tsx
index 6ee5e68..f195e55 100644
--- a/src/components/profile/multiFactorAuth/instructions/Instructions.js
+++ b/src/components/profile/multiFactorAuth/instructions/Instructions.tsx
@@ -1,12 +1,9 @@
-// @flow
-import React, { Component } from 'react';
-
+import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import classNames from 'classnames';
-
 import profileForm from 'components/profile/profileForm.scss';
-import messages from '../MultiFactorAuth.intl.json';
 
+import messages from '../MultiFactorAuth.intl.json';
 import OsInstruction from './OsInstruction';
 import OsTile from './OsTile';
 import styles from './instructions.scss';
@@ -14,15 +11,12 @@ import androidLogo from './images/android.svg';
 import appleLogo from './images/apple.svg';
 import windowsLogo from './images/windows.svg';
 
-export default class Instructions extends Component<
-  {},
-  {
-    activeOs: null | 'android' | 'ios' | 'windows',
-  },
-> {
-  state: {
-    activeOs: null | 'android' | 'ios' | 'windows',
-  } = {
+interface State {
+  activeOs: null | 'android' | 'ios' | 'windows';
+}
+
+export default class Instructions extends React.Component<{}, State> {
+  state: State = {
     activeOs: null,
   };
 
@@ -79,7 +73,7 @@ export default class Instructions extends Component<
     );
   }
 
-  onChangeOs(event: MouseEvent, osName: 'android' | 'ios' | 'windows') {
+  onChangeOs(event: React.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.tsx
similarity index 96%
rename from src/components/profile/multiFactorAuth/instructions/OsInstruction.js
rename to src/components/profile/multiFactorAuth/instructions/OsInstruction.tsx
index 8d15947..dd6764f 100644
--- a/src/components/profile/multiFactorAuth/instructions/OsInstruction.js
+++ b/src/components/profile/multiFactorAuth/instructions/OsInstruction.tsx
@@ -1,6 +1,4 @@
-// @flow
 import React from 'react';
-
 import { FormattedMessage as Message } from 'react-intl';
 
 import messages from '../MultiFactorAuth.intl.json';
@@ -9,10 +7,10 @@ import styles from './instructions.scss';
 type OS = 'android' | 'ios' | 'windows';
 
 const linksByOs: {
-  [key: OS]: {
-    searchLink: string,
-    featured: Array<{ link: string, label: string }>,
-  },
+  [K in OS]: {
+    searchLink: string;
+    featured: Array<{ link: string; label: string }>;
+  };
 } = {
   android: {
     searchLink: 'https://play.google.com/store/search?q=totp%20authenticator',
diff --git a/src/components/profile/multiFactorAuth/instructions/OsTile.js b/src/components/profile/multiFactorAuth/instructions/OsTile.tsx
similarity index 79%
rename from src/components/profile/multiFactorAuth/instructions/OsTile.js
rename to src/components/profile/multiFactorAuth/instructions/OsTile.tsx
index b5afc1d..8bdfcc1 100644
--- a/src/components/profile/multiFactorAuth/instructions/OsTile.js
+++ b/src/components/profile/multiFactorAuth/instructions/OsTile.tsx
@@ -1,6 +1,4 @@
-// @flow
 import React from 'react';
-
 import classNames from 'classnames';
 
 import styles from './instructions.scss';
@@ -11,10 +9,10 @@ export default function OsInstruction({
   label,
   onClick,
 }: {
-  className: string,
-  logo: string,
-  label: string,
-  onClick: (event: MouseEvent) => void,
+  className: string;
+  logo: string;
+  label: string;
+  onClick: (event: React.MouseEvent<any>) => void;
 }) {
   return (
     <div className={classNames(styles.osTile, className)} onClick={onClick}>
diff --git a/src/components/profile/multiFactorAuth/instructions/index.js b/src/components/profile/multiFactorAuth/instructions/index.ts
similarity index 82%
rename from src/components/profile/multiFactorAuth/instructions/index.js
rename to src/components/profile/multiFactorAuth/instructions/index.ts
index 064bd11..2279fa5 100644
--- a/src/components/profile/multiFactorAuth/instructions/index.js
+++ b/src/components/profile/multiFactorAuth/instructions/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default } from './Instructions';
diff --git a/src/components/profile/multiFactorAuth/keyForm/KeyForm.js b/src/components/profile/multiFactorAuth/keyForm/KeyForm.tsx
similarity index 96%
rename from src/components/profile/multiFactorAuth/keyForm/KeyForm.js
rename to src/components/profile/multiFactorAuth/keyForm/KeyForm.tsx
index becc136..293b1eb 100644
--- a/src/components/profile/multiFactorAuth/keyForm/KeyForm.js
+++ b/src/components/profile/multiFactorAuth/keyForm/KeyForm.tsx
@@ -1,22 +1,18 @@
-// @flow
 import React from 'react';
-
 import classNames from 'classnames';
-
 import { FormattedMessage as Message } from 'react-intl';
-
 import { ImageLoader } from 'components/ui/loader';
 import profileForm from 'components/profile/profileForm.scss';
-import messages from '../MultiFactorAuth.intl.json';
 
+import messages from '../MultiFactorAuth.intl.json';
 import styles from './key-form.scss';
 
 export default function KeyForm({
   secret,
   qrCodeSrc,
 }: {
-  secret: string,
-  qrCodeSrc: string,
+  secret: string;
+  qrCodeSrc: string;
 }) {
   const formattedSecret = formatSecret(secret || new Array(24).join('X'));
 
diff --git a/src/components/profile/multiFactorAuth/keyForm/index.js b/src/components/profile/multiFactorAuth/keyForm/index.ts
similarity index 80%
rename from src/components/profile/multiFactorAuth/keyForm/index.js
rename to src/components/profile/multiFactorAuth/keyForm/index.ts
index 8202f84..54bd6fc 100644
--- a/src/components/profile/multiFactorAuth/keyForm/index.js
+++ b/src/components/profile/multiFactorAuth/keyForm/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default } from './KeyForm';
diff --git a/src/components/profile/multiFactorAuth/status/MfaStatus.js b/src/components/profile/multiFactorAuth/status/MfaStatus.tsx
similarity index 93%
rename from src/components/profile/multiFactorAuth/status/MfaStatus.js
rename to src/components/profile/multiFactorAuth/status/MfaStatus.tsx
index 7680fbd..a08eb78 100644
--- a/src/components/profile/multiFactorAuth/status/MfaStatus.js
+++ b/src/components/profile/multiFactorAuth/status/MfaStatus.tsx
@@ -1,15 +1,13 @@
-// @flow
 import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
-
-import styles from 'components/profile/profileForm.scss';
 import { ScrollIntoView } from 'components/ui/scroll';
+import styles from 'components/profile/profileForm.scss';
 import icons from 'components/ui/icons.scss';
 
 import messages from '../MultiFactorAuth.intl.json';
 import mfaStyles from '../mfa.scss';
 
-export default function MfaStatus({ onProceed }: { onProceed: Function }) {
+export default function MfaStatus({ onProceed }: { onProceed: () => void }) {
   return (
     <div className={styles.formBody}>
       <ScrollIntoView />
diff --git a/src/components/ui/Panel.js b/src/components/ui/Panel.tsx
similarity index 64%
rename from src/components/ui/Panel.js
rename to src/components/ui/Panel.tsx
index 3859774..49e6288 100644
--- a/src/components/ui/Panel.js
+++ b/src/components/ui/Panel.tsx
@@ -1,34 +1,32 @@
-// @flow
-import type { Node } from 'react';
-import React, { Component } from 'react';
-
+import React from 'react';
 import classNames from 'classnames';
-
 import { omit } from 'functions';
 
 import styles from './panel.scss';
 import icons from './icons.scss';
 
 export function Panel(props: {
-  title?: string,
-  icon?: string,
-  children: Node,
+  title?: string;
+  icon?: string;
+  children: React.ReactNode;
 }) {
-  let { title, icon } = props;
+  const { title: titleText, icon: iconType } = props;
+  let icon: React.ReactElement | undefined;
+  let title: React.ReactElement | undefined;
 
-  if (icon) {
+  if (iconType) {
     icon = (
       <button className={styles.headerControl}>
-        <span className={icons[icon]} />
+        <span className={icons[iconType]} />
       </button>
     );
   }
 
-  if (title) {
+  if (titleText) {
     title = (
       <PanelHeader>
         {icon}
-        {title}
+        {titleText}
       </PanelHeader>
     );
   }
@@ -42,7 +40,7 @@ export function Panel(props: {
   );
 }
 
-export function PanelHeader(props: { children: * }) {
+export function PanelHeader(props: { children: React.ReactNode }) {
   return (
     <div className={styles.header} {...props}>
       {props.children}
@@ -50,7 +48,7 @@ export function PanelHeader(props: { children: * }) {
   );
 }
 
-export function PanelBody(props: { children: * }) {
+export function PanelBody(props: { children: React.ReactNode }) {
   return (
     <div className={styles.body} {...props}>
       {props.children}
@@ -58,7 +56,7 @@ export function PanelBody(props: { children: * }) {
   );
 }
 
-export function PanelFooter(props: { children: * }) {
+export function PanelFooter(props: { children: React.ReactNode }) {
   return (
     <div className={styles.footer} {...props}>
       {props.children}
@@ -66,18 +64,18 @@ export function PanelFooter(props: { children: * }) {
   );
 }
 
-export class PanelBodyHeader extends Component<
+export class PanelBodyHeader extends React.Component<
   {
-    type: 'default' | 'error',
-    onClose: Function,
-    children: *,
+    type?: 'default' | 'error';
+    onClose?: () => void;
+    children: React.ReactNode;
   },
   {
-    isClosed: boolean,
-  },
+    isClosed: boolean;
+  }
 > {
   state: {
-    isClosed: boolean,
+    isClosed: boolean;
   } = {
     isClosed: false,
   };
@@ -105,12 +103,16 @@ export class PanelBodyHeader extends Component<
     );
   }
 
-  onClose = (event: MouseEvent) => {
+  onClose = (event: React.MouseEvent) => {
     event.preventDefault();
 
+    const { onClose } = this.props;
+
     this.setState({ isClosed: true });
 
-    this.props.onClose();
+    if (onClose) {
+      onClose();
+    }
   };
 }
 
diff --git a/src/components/ui/RelativeTime.js b/src/components/ui/RelativeTime.tsx
similarity index 86%
rename from src/components/ui/RelativeTime.js
rename to src/components/ui/RelativeTime.tsx
index 277df88..56545d9 100644
--- a/src/components/ui/RelativeTime.js
+++ b/src/components/ui/RelativeTime.tsx
@@ -1,10 +1,9 @@
-// @flow
 import React from 'react';
 import { FormattedRelativeTime } from 'react-intl';
 import { selectUnit } from '@formatjs/intl-utils';
 
 function RelativeTime({ timestamp }: { timestamp: number }) {
-  const { unit, value }: { unit: any, value: number } = selectUnit(timestamp);
+  const { unit, value }: { unit: any; value: number } = selectUnit(timestamp);
 
   return (
     <FormattedRelativeTime
diff --git a/src/components/ui/bsod/BSoD.js b/src/components/ui/bsod/BSoD.tsx
similarity index 86%
rename from src/components/ui/bsod/BSoD.js
rename to src/components/ui/bsod/BSoD.tsx
index 34e79a1..8ae5fcb 100644
--- a/src/components/ui/bsod/BSoD.js
+++ b/src/components/ui/bsod/BSoD.tsx
@@ -1,4 +1,3 @@
-// @flow
 import React from 'react';
 import { FormattedMessage as Message } from 'react-intl';
 import { IntlProvider } from 'components/i18n';
@@ -9,17 +8,14 @@ import styles from './styles.scss';
 import BoxesField from './BoxesField';
 import messages from './BSoD.intl.json';
 
+interface State {
+  lastEventId?: string | void;
+}
+
 // TODO: probably it is better to render this view from the App view
 // to remove dependencies from store and IntlProvider
-export default class BSoD extends React.Component<
-  {
-    store: Object,
-  },
-  {
-    lastEventId?: string,
-  },
-> {
-  state = {};
+class BSoD extends React.Component<{}, State> {
+  state: State = {};
 
   componentDidMount() {
     // poll for event id
@@ -37,7 +33,6 @@ export default class BSoD extends React.Component<
   }
 
   render() {
-    const { store } = this.props;
     const { lastEventId } = this.state;
 
     let emailUrl = 'mailto:support@ely.by';
@@ -47,11 +42,11 @@ export default class BSoD extends React.Component<
     }
 
     return (
-      <IntlProvider store={store}>
+      <IntlProvider>
         <div className={styles.body}>
           <canvas
             className={styles.canvas}
-            ref={(el: ?HTMLCanvasElement) => el && new BoxesField(el)}
+            ref={(el: HTMLCanvasElement | null) => el && new BoxesField(el)}
           />
 
           <div className={styles.wrapper}>
@@ -76,3 +71,5 @@ export default class BSoD extends React.Component<
     );
   }
 }
+
+export default BSoD;
diff --git a/src/components/ui/bsod/Box.js b/src/components/ui/bsod/Box.js
index 4c6b949..ed04b6d 100644
--- a/src/components/ui/bsod/Box.js
+++ b/src/components/ui/bsod/Box.js
@@ -2,6 +2,7 @@ export default class Box {
   constructor({ size, startX, startY, startRotate, color, shadowColor }) {
     this.color = color;
     this.shadowColor = shadowColor;
+    this.halfSize = 0;
     this.setSize(size);
     this.x = startX;
     this.y = startY;
diff --git a/src/components/ui/bsod/BoxesField.js b/src/components/ui/bsod/BoxesField.js
index edc45d5..7c279ca 100644
--- a/src/components/ui/bsod/BoxesField.js
+++ b/src/components/ui/bsod/BoxesField.js
@@ -5,7 +5,7 @@ import Box from './Box';
  */
 export default class BoxesField {
   /**
-   * @param {Node} elem - canvas DOM node
+   * @param {HTMLCanvasElement} elem - canvas DOM node
    * @param {object} params
    */
   constructor(
@@ -28,7 +28,13 @@ export default class BoxesField {
     },
   ) {
     this.elem = elem;
-    this.ctx = elem.getContext('2d');
+    const ctx = elem.getContext('2d');
+
+    if (!ctx) {
+      throw new Error('Can not get canvas 2d context');
+    }
+
+    this.ctx = ctx;
     this.params = params;
 
     this.light = {
diff --git a/src/components/ui/bsod/BsodMiddleware.js b/src/components/ui/bsod/BsodMiddleware.js
deleted file mode 100644
index 8bc36ce..0000000
--- a/src/components/ui/bsod/BsodMiddleware.js
+++ /dev/null
@@ -1,36 +0,0 @@
-// @flow
-import { InternalServerError } from 'services/request';
-
-import type { Resp } from 'services/request';
-import type { logger as Logger } from 'services/logger';
-
-const ABORT_ERR = 20;
-
-export default function BsodMiddleware(dispatchBsod: Function, logger: Logger) {
-  return {
-    catch<T: Resp<any> | InternalServerError | Error>(resp?: T): Promise<T> {
-      const originalResponse: Object = (resp && resp.originalResponse) || {};
-
-      if (
-        resp &&
-        ((resp instanceof InternalServerError &&
-          resp.error.code !== ABORT_ERR) ||
-          (originalResponse && /5\d\d/.test((originalResponse.status: string))))
-      ) {
-        dispatchBsod();
-
-        if (!resp.message || !/NetworkError/.test(resp.message)) {
-          let message = 'Unexpected response (BSoD)';
-
-          if (resp.message) {
-            message = `BSoD: ${resp.message}`;
-          }
-
-          logger.warn(message, { resp });
-        }
-      }
-
-      return Promise.reject(resp);
-    },
-  };
-}
diff --git a/src/components/ui/bsod/BsodMiddleware.test.js b/src/components/ui/bsod/BsodMiddleware.test.ts
similarity index 75%
rename from src/components/ui/bsod/BsodMiddleware.test.js
rename to src/components/ui/bsod/BsodMiddleware.test.ts
index fd0d683..0f49e5b 100644
--- a/src/components/ui/bsod/BsodMiddleware.test.js
+++ b/src/components/ui/bsod/BsodMiddleware.test.ts
@@ -10,14 +10,14 @@ describe('BsodMiddleware', () => {
         originalResponse: { status: code },
       };
 
-      const dispatch = sinon.spy();
+      const dispatchBsod = sinon.spy();
       const logger = { warn: sinon.spy() };
 
-      const middleware = new BsodMiddleware(dispatch, logger);
+      const middleware = new BsodMiddleware(dispatchBsod, logger as any);
 
       return expect(middleware.catch(resp), 'to be rejected with', resp).then(
         () => {
-          expect(dispatch, 'was called');
+          expect(dispatchBsod, 'was called');
           expect(logger.warn, 'to have a call satisfying', [
             'Unexpected response (BSoD)',
             { resp },
@@ -33,14 +33,14 @@ describe('BsodMiddleware', () => {
         originalResponse: { status: code },
       };
 
-      const dispatch = sinon.spy();
+      const dispatchBsod = sinon.spy();
       const logger = { warn: sinon.spy() };
 
-      const middleware = new BsodMiddleware(dispatch, logger);
+      const middleware = new BsodMiddleware(dispatchBsod, logger as any);
 
       return expect(middleware.catch(resp), 'to be rejected with', resp).then(
         () => {
-          expect(dispatch, 'was not called');
+          expect(dispatchBsod, 'was not called');
           expect(logger.warn, 'was not called');
         },
       );
diff --git a/src/components/ui/bsod/BsodMiddleware.ts b/src/components/ui/bsod/BsodMiddleware.ts
new file mode 100644
index 0000000..428e1c1
--- /dev/null
+++ b/src/components/ui/bsod/BsodMiddleware.ts
@@ -0,0 +1,49 @@
+import { InternalServerError } from 'services/request';
+import { Resp, Middleware } from 'services/request';
+import defaultLogger from 'services/logger';
+
+type Logger = typeof defaultLogger;
+
+const ABORT_ERR = 20;
+
+class BsodMiddleware implements Middleware {
+  dispatchBsod: () => any;
+  logger: Logger;
+
+  constructor(dispatchBsod: () => any, logger: Logger = defaultLogger) {
+    this.dispatchBsod = dispatchBsod;
+    this.logger = logger;
+  }
+
+  async catch<T extends Resp<any>>(
+    resp?: T | InternalServerError | Error,
+  ): Promise<T> {
+    const { originalResponse }: { originalResponse?: Resp<any> } = (resp ||
+      {}) as InternalServerError;
+
+    if (
+      resp &&
+      ((resp instanceof InternalServerError &&
+        (resp.error as any).code !== ABORT_ERR) ||
+        (originalResponse && /5\d\d/.test(originalResponse.status)))
+    ) {
+      this.dispatchBsod();
+
+      const { message: errorMessage } = resp as { [key: string]: any };
+
+      if (!errorMessage || !/NetworkError/.test(errorMessage)) {
+        let message = 'Unexpected response (BSoD)';
+
+        if (errorMessage) {
+          message = `BSoD: ${errorMessage}`;
+        }
+
+        this.logger.warn(message, { resp });
+      }
+    }
+
+    return Promise.reject(resp);
+  }
+}
+
+export default BsodMiddleware;
diff --git a/src/components/ui/bsod/dispatchBsod.js b/src/components/ui/bsod/dispatchBsod.js
index c59d2b6..41e8085 100644
--- a/src/components/ui/bsod/dispatchBsod.js
+++ b/src/components/ui/bsod/dispatchBsod.js
@@ -11,7 +11,7 @@ export default function dispatchBsod(store = injectedStore) {
   store.dispatch(bsod());
   onBsod && onBsod();
 
-  ReactDOM.render(<BSoD store={store} />, document.getElementById('app'));
+  ReactDOM.render(<BSoD />, document.getElementById('app'));
 }
 
 export function inject(store, stopLoading) {
diff --git a/src/components/ui/collapse/Collapse.js b/src/components/ui/collapse/Collapse.tsx
similarity index 91%
rename from src/components/ui/collapse/Collapse.js
rename to src/components/ui/collapse/Collapse.tsx
index cc200c6..89cd659 100644
--- a/src/components/ui/collapse/Collapse.js
+++ b/src/components/ui/collapse/Collapse.tsx
@@ -1,5 +1,3 @@
-// @flow
-import type { Node } from 'react';
 import React, { Component } from 'react';
 import { Motion, spring } from 'react-motion';
 import MeasureHeight from 'components/MeasureHeight';
@@ -7,17 +5,17 @@ import MeasureHeight from 'components/MeasureHeight';
 import styles from './collapse.scss';
 
 type Props = {
-  isOpened?: boolean,
-  children: Node,
-  onRest: () => void,
+  isOpened?: boolean;
+  children: React.ReactNode;
+  onRest: () => void;
 };
 
 export default class Collapse extends Component<
   Props,
   {
-    height: number,
-    wasInitialized: boolean,
-  },
+    height: number;
+    wasInitialized: boolean;
+  }
 > {
   state = {
     height: 0,
diff --git a/src/components/ui/collapse/index.js b/src/components/ui/collapse/index.ts
similarity index 80%
rename from src/components/ui/collapse/index.js
rename to src/components/ui/collapse/index.ts
index 940f5df..12bcb63 100644
--- a/src/components/ui/collapse/index.js
+++ b/src/components/ui/collapse/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default } from './Collapse';
diff --git a/src/components/ui/form/Button.js b/src/components/ui/form/Button.tsx
similarity index 51%
rename from src/components/ui/form/Button.js
rename to src/components/ui/form/Button.tsx
index cfc8416..db22a0a 100644
--- a/src/components/ui/form/Button.js
+++ b/src/components/ui/form/Button.tsx
@@ -1,39 +1,35 @@
-// @flow
-import type { MessageDescriptor } from 'react-intl';
-import type { ComponentType } from 'react';
-import type { Color } from 'components/ui';
 import React from 'react';
 import classNames from 'classnames';
 import buttons from 'components/ui/buttons.scss';
 import { COLOR_GREEN } from 'components/ui';
+import { MessageDescriptor } from 'react-intl';
+import { Color } from 'components/ui';
 
 import FormComponent from './FormComponent';
 
-export default class Button extends FormComponent<{
-  label: string | MessageDescriptor,
-  block?: boolean,
-  small?: boolean,
-  loading?: boolean,
-  className?: string,
-  color: Color,
-  disabled?: boolean,
-  component: string | ComponentType<any>,
-}> {
-  static defaultProps = {
-    color: COLOR_GREEN,
-    component: 'button',
-  };
-
+export default class Button extends FormComponent<
+  {
+    // TODO: drop MessageDescriptor support. It should be React.ReactNode only
+    label: string | MessageDescriptor | React.ReactElement;
+    block?: boolean;
+    small?: boolean;
+    loading?: boolean;
+    className?: string;
+    color?: Color;
+    disabled?: boolean;
+    component?: string | React.ComponentType<any>;
+  } & React.ButtonHTMLAttributes<HTMLButtonElement>
+> {
   render() {
     const {
-      color,
+      color = COLOR_GREEN,
       block,
       small,
       disabled,
       className,
       loading,
       label,
-      component: ComponentProp,
+      component: ComponentProp = 'button',
       ...restProps
     } = this.props;
 
@@ -52,7 +48,9 @@ export default class Button extends FormComponent<{
         disabled={disabled}
         {...restProps}
       >
-        {this.formatMessage(label)}
+        {typeof label === 'object' && React.isValidElement(label)
+          ? label
+          : this.formatMessage(label)}
       </ComponentProp>
     );
   }
diff --git a/src/components/ui/form/Captcha.js b/src/components/ui/form/Captcha.tsx
similarity index 90%
rename from src/components/ui/form/Captcha.js
rename to src/components/ui/form/Captcha.tsx
index 9c99b49..e6e19a8 100644
--- a/src/components/ui/form/Captcha.js
+++ b/src/components/ui/form/Captcha.tsx
@@ -1,8 +1,7 @@
-// @flow
 import React from 'react';
 import classNames from 'classnames';
-import type { CaptchaID } from 'services/captcha';
-import type { Skin } from 'components/ui';
+import { CaptchaID } from 'services/captcha';
+import { Skin } from 'components/ui';
 import captcha from 'services/captcha';
 import logger from 'services/logger';
 import { ComponentLoader } from 'components/ui/loader';
@@ -12,12 +11,12 @@ import FormInputComponent from './FormInputComponent';
 
 export default class Captcha extends FormInputComponent<
   {
-    delay: number,
-    skin: Skin,
+    delay: number;
+    skin: Skin;
   },
   {
-    code: string,
-  },
+    code: string;
+  }
 > {
   elRef = React.createRef<HTMLDivElement>();
   captchaId: CaptchaID;
diff --git a/src/components/ui/form/Checkbox.js b/src/components/ui/form/Checkbox.tsx
similarity index 84%
rename from src/components/ui/form/Checkbox.js
rename to src/components/ui/form/Checkbox.tsx
index 9b67e63..8d1a34d 100644
--- a/src/components/ui/form/Checkbox.js
+++ b/src/components/ui/form/Checkbox.tsx
@@ -1,18 +1,16 @@
-// @flow
-import type { Color, Skin } from 'components/ui';
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { MessageDescriptor } from 'react-intl';
 import classNames from 'classnames';
-import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
+import { SKIN_DARK, COLOR_GREEN, Color, Skin } from 'components/ui';
 import { omit } from 'functions';
 
 import styles from './form.scss';
 import FormInputComponent from './FormInputComponent';
 
 export default class Checkbox extends FormInputComponent<{
-  color: Color,
-  skin: Skin,
-  label: string | MessageDescriptor,
+  color: Color;
+  skin: Skin;
+  label: string | MessageDescriptor;
 }> {
   static defaultProps = {
     color: COLOR_GREEN,
diff --git a/src/components/ui/form/Dropdown.js b/src/components/ui/form/Dropdown.js
index 3d5a83a..5a612d1 100644
--- a/src/components/ui/form/Dropdown.js
+++ b/src/components/ui/form/Dropdown.js
@@ -108,7 +108,7 @@ export default class Dropdown extends FormInputComponent {
 
   getActiveItem() {
     const { items } = this.props;
-    let { activeItem } = this.state;
+    let { activeItem } = /** @type {any} */ (this.state);
 
     if (!activeItem) {
       activeItem = {
@@ -117,10 +117,11 @@ export default class Dropdown extends FormInputComponent {
       };
 
       if (!activeItem.label) {
-        const firstItem = Object.entries(items)[0];
+        const [[value, label]] = Object.entries(items);
+
         activeItem = {
-          label: firstItem[1],
-          value: firstItem[0],
+          label,
+          value,
         };
       }
     }
diff --git a/src/components/ui/form/Form.js b/src/components/ui/form/Form.tsx
similarity index 79%
rename from src/components/ui/form/Form.js
rename to src/components/ui/form/Form.tsx
index 6828f79..26fb186 100644
--- a/src/components/ui/form/Form.js
+++ b/src/components/ui/form/Form.tsx
@@ -1,27 +1,25 @@
-// @flow
-import type { Node } from 'react';
-import React, { Component } from 'react';
+import React from 'react';
 import classNames from 'classnames';
 import logger from 'services/logger';
 
-import type FormModel from './FormModel';
+import FormModel from './FormModel';
 import styles from './form.scss';
 
-type Props = {|
-  id: string,
-  isLoading: boolean,
-  form?: FormModel,
-  onSubmit: (form: FormModel | FormData) => void | Promise<void>,
-  onInvalid: (errors: { [errorKey: string]: string }) => void,
-  children: Node,
-|};
-type State = {
-  isTouched: boolean,
-  isLoading: boolean,
-};
+interface Props {
+  id: string;
+  isLoading: boolean;
+  form?: FormModel;
+  onSubmit: (form: FormModel | FormData) => void | Promise<void>;
+  onInvalid: (errors: { [errorKey: string]: string }) => void;
+  children: React.ReactNode;
+}
+interface State {
+  isTouched: boolean;
+  isLoading: boolean;
+}
 type InputElement = HTMLInputElement | HTMLTextAreaElement;
 
-export default class Form extends Component<Props, State> {
+export default class Form extends React.Component<Props, State> {
   static defaultProps = {
     id: 'default',
     isLoading: false,
@@ -34,7 +32,7 @@ export default class Form extends Component<Props, State> {
     isLoading: this.props.isLoading || false,
   };
 
-  formEl: ?HTMLFormElement;
+  formEl: HTMLFormElement | null;
 
   mounted = false;
 
@@ -88,7 +86,7 @@ export default class Form extends Component<Props, State> {
           [styles.formTouched]: this.state.isTouched,
         })}
         onSubmit={this.onFormSubmit}
-        ref={(el: ?HTMLFormElement) => (this.formEl = el)}
+        ref={(el: HTMLFormElement | null) => (this.formEl = el)}
         noValidate
       >
         {this.props.children}
@@ -124,17 +122,17 @@ export default class Form extends Component<Props, State> {
           .finally(() => this.mounted && this.setState({ isLoading: false }));
       }
     } else {
-      const invalidEls: NodeList<InputElement> = (form.querySelectorAll(
+      const invalidEls: NodeListOf<InputElement> = form.querySelectorAll(
         ':invalid',
-      ): any);
+      );
       const errors = {};
       invalidEls[0].focus(); // focus on first error
 
-      Array.from(invalidEls).reduce((errors, el: InputElement) => {
+      Array.from(invalidEls).reduce((acc, el: InputElement) => {
         if (!el.name) {
           logger.warn('Found an element without name', { el });
 
-          return errors;
+          return acc;
         }
 
         let errorMessage = el.validationMessage;
@@ -145,9 +143,9 @@ export default class Form extends Component<Props, State> {
           errorMessage = `error.${el.name}_invalid`;
         }
 
-        errors[el.name] = errorMessage;
+        acc[el.name] = errorMessage;
 
-        return errors;
+        return acc;
       }, errors);
 
       this.setErrors(errors);
@@ -159,7 +157,7 @@ export default class Form extends Component<Props, State> {
     this.props.onInvalid(errors);
   }
 
-  onFormSubmit = (event: Event) => {
+  onFormSubmit = (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
 
     this.submit();
diff --git a/src/components/ui/form/FormComponent.js b/src/components/ui/form/FormComponent.js
deleted file mode 100644
index 8ffc054..0000000
--- a/src/components/ui/form/FormComponent.js
+++ /dev/null
@@ -1,41 +0,0 @@
-// @flow
-import type { MessageDescriptor } from 'react-intl';
-import type { Element } from 'react';
-import { Component } from 'react';
-import i18n from 'services/i18n';
-
-class FormComponent<P, S = void> extends Component<P, S> {
-  /**
-   * Formats message resolving intl translations
-   *
-   * @param {string|object} message - message string, or intl message descriptor with an `id` field
-   *
-   * @returns {string}
-   */
-  formatMessage(
-    message: string | MessageDescriptor | Element<any>,
-  ): string | Element<any> {
-    if (typeof message === 'string') {
-      return message;
-    }
-
-    if (message && message.id) {
-      return i18n.getIntl().formatMessage(message);
-    }
-
-    return ((message: any): Element<any>);
-  }
-
-  /**
-   * Focuses this field
-   */
-  focus() {}
-
-  /**
-   * A hook, that called, when the form was submitted with invalid data
-   * This is usefull for the cases, when some field needs to be refreshed e.g. captcha
-   */
-  onFormInvalid() {}
-}
-
-export default FormComponent;
diff --git a/src/components/ui/form/FormComponent.tsx b/src/components/ui/form/FormComponent.tsx
new file mode 100644
index 0000000..23f728b
--- /dev/null
+++ b/src/components/ui/form/FormComponent.tsx
@@ -0,0 +1,41 @@
+import React from 'react';
+import { MessageDescriptor } from 'react-intl';
+import i18n from 'services/i18n';
+
+class FormComponent<P, S = {}> extends React.Component<P, S> {
+  /**
+   * Formats message resolving intl translations
+   *
+   * @param {string|object} message - message string, or intl message descriptor with an `id` field
+   *
+   * @returns {string}
+   */
+  formatMessage(message: string | MessageDescriptor): string {
+    if (!message) {
+      throw new Error('A message is required');
+    }
+
+    if (typeof message === 'string') {
+      return message;
+    }
+
+    if (!message.id) {
+      throw new Error(`Invalid message format: ${JSON.stringify(message)}`);
+    }
+
+    return i18n.getIntl().formatMessage(message);
+  }
+
+  /**
+   * Focuses this field
+   */
+  focus() {}
+
+  /**
+   * A hook, that called, when the form was submitted with invalid data
+   * This is useful for the cases, when some field needs to be refreshed e.g. captcha
+   */
+  onFormInvalid() {}
+}
+
+export default FormComponent;
diff --git a/src/components/ui/form/FormError.js b/src/components/ui/form/FormError.tsx
similarity index 71%
rename from src/components/ui/form/FormError.js
rename to src/components/ui/form/FormError.tsx
index b3d175e..472c553 100644
--- a/src/components/ui/form/FormError.js
+++ b/src/components/ui/form/FormError.tsx
@@ -1,11 +1,20 @@
-import PropTypes from 'prop-types';
 import React from 'react';
-
+import PropTypes from 'prop-types';
 import errorsDict from 'services/errorsDict';
 
 import styles from './form.scss';
 
-export default function FormError({ error }) {
+export default function FormError({
+  error,
+}: {
+  error?:
+    | string
+    | React.ReactNode
+    | {
+        type: string;
+        payload: { [key: string]: any };
+      };
+}) {
   return error ? (
     <div className={styles.fieldError}>{errorsDict.resolve(error)}</div>
   ) : null;
diff --git a/src/components/ui/form/FormInputComponent.js b/src/components/ui/form/FormInputComponent.tsx
similarity index 75%
rename from src/components/ui/form/FormInputComponent.js
rename to src/components/ui/form/FormInputComponent.tsx
index 9ac7bc0..47c2779 100644
--- a/src/components/ui/form/FormInputComponent.js
+++ b/src/components/ui/form/FormInputComponent.tsx
@@ -1,19 +1,18 @@
-// @flow
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { MessageDescriptor } from 'react-intl';
 
 import FormComponent from './FormComponent';
 import FormError from './FormError';
 
 type Error = string | MessageDescriptor;
 
-export default class FormInputComponent<P, S = void> extends FormComponent<
+export default class FormInputComponent<P, S = {}> extends FormComponent<
   P & {
-    error?: Error,
+    error?: Error;
   },
   S & {
-    error?: Error,
-  },
+    error?: Error;
+  }
 > {
   componentWillReceiveProps() {
     if (this.state && this.state.error) {
@@ -30,6 +29,7 @@ export default class FormInputComponent<P, S = void> extends FormComponent<
   }
 
   setError(error: Error) {
+    // @ts-ignore
     this.setState({ error });
   }
 }
diff --git a/src/components/ui/form/FormModel.js b/src/components/ui/form/FormModel.ts
similarity index 89%
rename from src/components/ui/form/FormModel.js
rename to src/components/ui/form/FormModel.ts
index 5bdf751..aabfc84 100644
--- a/src/components/ui/form/FormModel.js
+++ b/src/components/ui/form/FormModel.ts
@@ -1,11 +1,19 @@
-// @flow
 import FormInputComponent from './FormInputComponent';
 
 type LoadingListener = (isLoading: boolean) => void;
 
+type ValidationError =
+  | string
+  | {
+      type: string;
+      payload?: { [key: string]: any };
+    };
+
 export default class FormModel {
   fields = {};
-  errors = {};
+  errors: {
+    [fieldId: string]: ValidationError;
+  } = {};
   handlers: LoadingListener[] = [];
   renderErrors: boolean;
   _isLoading: boolean;
@@ -32,9 +40,9 @@ export default class FormModel {
   bindField(name: string) {
     this.fields[name] = {};
 
-    const props: Object = {
+    const props: { [key: string]: any } = {
       name,
-      ref: (el: ?FormInputComponent<any>) => {
+      ref: (el: FormInputComponent<any> | null) => {
         if (el) {
           if (!(el instanceof FormInputComponent)) {
             throw new Error('Expected FormInputComponent component');
@@ -100,7 +108,7 @@ export default class FormModel {
    *
    * @param {object} errors - object maping {fieldId: errorType}
    */
-  setErrors(errors: { [key: string]: string }) {
+  setErrors(errors: { [key: string]: ValidationError }) {
     if (typeof errors !== 'object' || errors === null) {
       throw new Error('Errors must be an object');
     }
@@ -121,11 +129,10 @@ export default class FormModel {
     });
   }
 
-  /**
-   * @returns {object|string|null}
-   */
-  getFirstError() {
-    return this.errors ? Object.values(this.errors).shift() : null;
+  getFirstError(): ValidationError | null {
+    const [error] = Object.values(this.errors);
+
+    return error || null;
   }
 
   /**
@@ -200,10 +207,7 @@ export default class FormModel {
     this.notifyHandlers();
   }
 
-  /**
-   * @api private
-   */
-  notifyHandlers() {
+  private notifyHandlers() {
     this.handlers.forEach(fn => fn(this._isLoading));
   }
 }
diff --git a/src/components/ui/form/Input.test.js b/src/components/ui/form/Input.test.tsx
similarity index 96%
rename from src/components/ui/form/Input.test.js
rename to src/components/ui/form/Input.test.tsx
index b0bc814..c977b1f 100644
--- a/src/components/ui/form/Input.test.js
+++ b/src/components/ui/form/Input.test.tsx
@@ -7,7 +7,8 @@ import Input from './Input';
 
 describe('Input', () => {
   it('should return input value', () => {
-    let component;
+    let component: any;
+
     const wrapper = mount(
       <IntlProvider locale="en" defaultLocale="en">
         <Input
diff --git a/src/components/ui/form/Input.js b/src/components/ui/form/Input.tsx
similarity index 61%
rename from src/components/ui/form/Input.js
rename to src/components/ui/form/Input.tsx
index f77a418..68796fb 100644
--- a/src/components/ui/form/Input.js
+++ b/src/components/ui/form/Input.tsx
@@ -1,33 +1,31 @@
-// @flow
-import type { Skin, Color } from 'components/ui';
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { MessageDescriptor } from 'react-intl';
 import classNames from 'classnames';
 import { uniqueId, omit } from 'functions';
 import copy from 'services/copy';
 import icons from 'components/ui/icons.scss';
-import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
+import { SKIN_DARK, COLOR_GREEN, Skin, Color } from 'components/ui';
 
 import styles from './form.scss';
 import FormInputComponent from './FormInputComponent';
 
-let copiedStateTimeout: TimeoutID;
+let copiedStateTimeout: NodeJS.Timeout;
 
 export default class Input extends FormInputComponent<
-  {
-    skin: Skin,
-    color: Color,
-    center: boolean,
-    disabled: boolean,
-    label?: string | MessageDescriptor,
-    placeholder?: string | MessageDescriptor,
-    error?: string | { type: string, payload: string },
-    icon?: string,
-    copy?: boolean,
+  Omit<React.InputHTMLAttributes<HTMLInputElement>, 'placeholder'> & {
+    skin: Skin;
+    color: Color;
+    center: boolean;
+    disabled: boolean;
+    label?: string | MessageDescriptor;
+    placeholder?: string | MessageDescriptor;
+    error?: string | { type: string; payload: string };
+    icon?: string;
+    copy?: boolean;
   },
   {
-    wasCopied: boolean,
-  },
+    wasCopied: boolean;
+  }
 > {
   static defaultProps = {
     color: COLOR_GREEN,
@@ -43,43 +41,68 @@ export default class Input extends FormInputComponent<
   elRef = React.createRef<HTMLInputElement>();
 
   render() {
-    const { color, skin, center } = this.props;
-    let { icon, label, copy } = this.props;
+    const {
+      color,
+      skin,
+      center,
+      icon: iconType,
+      copy: showCopyIcon,
+      placeholder: placeholderText,
+    } = this.props;
+    let { label: labelContent } = this.props;
     const { wasCopied } = this.state;
+    let placeholder: string | undefined;
 
     const props = omit(
       {
         type: 'text',
         ...this.props,
       },
-      ['label', 'error', 'skin', 'color', 'center', 'icon', 'copy'],
+      [
+        'label',
+        'placeholder',
+        'error',
+        'skin',
+        'color',
+        'center',
+        'icon',
+        'copy',
+      ],
     );
 
-    if (label) {
+    let label: React.ReactElement | null = null;
+    let copyIcon: React.ReactElement | null = null;
+    let icon: React.ReactElement | null = null;
+
+    if (labelContent) {
       if (!props.id) {
         props.id = uniqueId('input');
       }
 
-      label = this.formatMessage(label);
+      labelContent = this.formatMessage(labelContent);
 
       label = (
         <label className={styles.textFieldLabel} htmlFor={props.id}>
-          {label}
+          {labelContent}
         </label>
       );
     }
 
-    props.placeholder = this.formatMessage(props.placeholder);
+    if (placeholderText) {
+      placeholder = this.formatMessage(placeholderText);
+    }
 
     let baseClass = styles.formRow;
 
-    if (icon) {
+    if (iconType) {
       baseClass = styles.formIconRow;
-      icon = <span className={classNames(styles.textFieldIcon, icons[icon])} />;
+      icon = (
+        <span className={classNames(styles.textFieldIcon, icons[iconType])} />
+      );
     }
 
-    if (copy) {
-      copy = (
+    if (showCopyIcon) {
+      copyIcon = (
         <div
           className={classNames(styles.copyIcon, {
             [icons.clipboard]: !wasCopied,
@@ -104,10 +127,11 @@ export default class Input extends FormInputComponent<
                 [styles.textFieldCenter]: center,
               },
             )}
+            placeholder={placeholder}
             {...props}
           />
           {icon}
-          {copy}
+          {copyIcon}
         </div>
         {this.renderError()}
       </div>
diff --git a/src/components/ui/form/LinkButton.js b/src/components/ui/form/LinkButton.js
deleted file mode 100644
index dffcb5f..0000000
--- a/src/components/ui/form/LinkButton.js
+++ /dev/null
@@ -1,15 +0,0 @@
-// @flow
-import type { ElementConfig } from 'react';
-import React from 'react';
-import { Link } from 'react-router-dom';
-
-import Button from './Button';
-
-export default function LinkButton(props: {
-  ...$Exact<ElementConfig<typeof Button>>,
-  ...$Exact<ElementConfig<typeof Link>>,
-}) {
-  const { to, ...restProps } = props;
-
-  return <Button component={Link} to={to} {...restProps} />;
-}
diff --git a/src/components/ui/form/LinkButton.tsx b/src/components/ui/form/LinkButton.tsx
new file mode 100644
index 0000000..1865ac4
--- /dev/null
+++ b/src/components/ui/form/LinkButton.tsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+import Button from './Button';
+
+export default function LinkButton(
+  props: React.ComponentProps<typeof Button> &
+    React.ComponentProps<typeof Link>,
+) {
+  const { to, ...restProps } = props;
+
+  return (
+    <Button
+      component={linkProps => <Link {...linkProps} to={to} />}
+      {...restProps}
+    />
+  );
+}
diff --git a/src/components/ui/form/Radio.js b/src/components/ui/form/Radio.tsx
similarity index 81%
rename from src/components/ui/form/Radio.js
rename to src/components/ui/form/Radio.tsx
index 7539a2c..a76724a 100644
--- a/src/components/ui/form/Radio.js
+++ b/src/components/ui/form/Radio.tsx
@@ -1,19 +1,20 @@
-// @flow
-import type { Color, Skin } from 'components/ui';
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { MessageDescriptor } from 'react-intl';
 import classNames from 'classnames';
 import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
 import { omit } from 'functions';
+import { Color, Skin } from 'components/ui';
 
 import styles from './form.scss';
 import FormInputComponent from './FormInputComponent';
 
-export default class Radio extends FormInputComponent<{
-  color: Color,
-  skin: Skin,
-  label: string | MessageDescriptor,
-}> {
+export default class Radio extends FormInputComponent<
+  {
+    color: Color;
+    skin: Skin;
+    label: string | MessageDescriptor;
+  } & React.InputHTMLAttributes<HTMLInputElement>
+> {
   static defaultProps = {
     color: COLOR_GREEN,
     skin: SKIN_DARK,
diff --git a/src/components/ui/form/TextArea.js b/src/components/ui/form/TextArea.tsx
similarity index 59%
rename from src/components/ui/form/TextArea.js
rename to src/components/ui/form/TextArea.tsx
index 37db478..35eb4ba 100644
--- a/src/components/ui/form/TextArea.js
+++ b/src/components/ui/form/TextArea.tsx
@@ -1,31 +1,30 @@
-// @flow
-import type { Skin, Color } from 'components/ui';
-import type { MessageDescriptor } from 'react-intl';
 import React from 'react';
+import { MessageDescriptor } from 'react-intl';
 import TextareaAutosize from 'react-textarea-autosize';
 import classNames from 'classnames';
 import { uniqueId, omit } from 'functions';
-import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
+import { SKIN_DARK, COLOR_GREEN, Skin, Color } from 'components/ui';
 
 import styles from './form.scss';
 import FormInputComponent from './FormInputComponent';
 
 type TextareaAutosizeProps = {
-  onHeightChange?: (number, TextareaAutosizeProps) => void,
-  useCacheForDOMMeasurements?: boolean,
-  minRows?: number,
-  maxRows?: number,
-  inputRef?: (?HTMLTextAreaElement) => void,
+  onHeightChange?: (number, TextareaAutosizeProps) => void;
+  useCacheForDOMMeasurements?: boolean;
+  minRows?: number;
+  maxRows?: number;
+  inputRef?: (el?: HTMLTextAreaElement) => void;
 };
 
 export default class TextArea extends FormInputComponent<
   {
-    placeholder?: string | MessageDescriptor,
-    label?: string | MessageDescriptor,
-    error?: string,
-    skin: Skin,
-    color: Color,
-  } & TextareaAutosizeProps,
+    placeholder?: string | MessageDescriptor;
+    label?: string | MessageDescriptor;
+    error?: string;
+    skin: Skin;
+    color: Color;
+  } & TextareaAutosizeProps &
+    React.TextareaHTMLAttributes<HTMLTextAreaElement>
 > {
   static defaultProps = {
     color: COLOR_GREEN,
@@ -35,32 +34,38 @@ export default class TextArea extends FormInputComponent<
   elRef = React.createRef<HTMLTextAreaElement>();
 
   render() {
-    const { color, skin } = this.props;
-    let { label } = this.props;
+    const {
+      color,
+      skin,
+      label: labelText,
+      placeholder: placeholderText,
+    } = this.props;
+    let label: React.ReactElement | undefined;
+    let placeholder: string | undefined;
 
     const props = omit(
       {
         type: 'text',
         ...this.props,
       },
-      ['label', 'error', 'skin', 'color'],
+      ['label', 'placeholder', 'error', 'skin', 'color'],
     );
 
-    if (label) {
+    if (labelText) {
       if (!props.id) {
         props.id = uniqueId('textarea');
       }
 
-      label = this.formatMessage(label);
-
       label = (
         <label className={styles.textFieldLabel} htmlFor={props.id}>
-          {label}
+          {this.formatMessage(labelText)}
         </label>
       );
     }
 
-    props.placeholder = this.formatMessage(props.placeholder);
+    if (placeholderText) {
+      placeholder = this.formatMessage(placeholderText);
+    }
 
     return (
       <div className={styles.formRow}>
@@ -73,6 +78,7 @@ export default class TextArea extends FormInputComponent<
               styles[`${skin}TextField`],
               styles[`${color}TextField`],
             )}
+            placeholder={placeholder}
             {...props}
           />
         </div>
diff --git a/src/components/ui/form/index.js b/src/components/ui/form/index.ts
similarity index 100%
rename from src/components/ui/form/index.js
rename to src/components/ui/form/index.ts
diff --git a/src/components/ui/index.js b/src/components/ui/index.ts
similarity index 99%
rename from src/components/ui/index.js
rename to src/components/ui/index.ts
index 07ef719..7b30e06 100644
--- a/src/components/ui/index.js
+++ b/src/components/ui/index.ts
@@ -1,4 +1,3 @@
-// @flow
 export type Color =
   | 'green'
   | 'blue'
diff --git a/src/components/ui/loader/ComponentLoader.js b/src/components/ui/loader/ComponentLoader.tsx
similarity index 74%
rename from src/components/ui/loader/ComponentLoader.js
rename to src/components/ui/loader/ComponentLoader.tsx
index da32efe..1e76c96 100644
--- a/src/components/ui/loader/ComponentLoader.js
+++ b/src/components/ui/loader/ComponentLoader.tsx
@@ -1,11 +1,10 @@
-// @flow
-import type { Skin } from 'components/ui';
 import React from 'react';
 import classNames from 'classnames';
+import { Skin } from 'components/ui';
 
 import styles from './componentLoader.scss';
 
-export default function ComponentLoader({ skin }: { skin: Skin }) {
+function ComponentLoader({ skin = 'dark' }: { skin?: Skin }) {
   return (
     <div
       className={classNames(
@@ -25,6 +24,4 @@ export default function ComponentLoader({ skin }: { skin: Skin }) {
   );
 }
 
-ComponentLoader.defaultProps = {
-  skin: 'dark',
-};
+export default ComponentLoader;
diff --git a/src/components/ui/loader/ImageLoader.js b/src/components/ui/loader/ImageLoader.tsx
similarity index 90%
rename from src/components/ui/loader/ImageLoader.js
rename to src/components/ui/loader/ImageLoader.tsx
index 0135123..02b1497 100644
--- a/src/components/ui/loader/ImageLoader.js
+++ b/src/components/ui/loader/ImageLoader.tsx
@@ -1,4 +1,3 @@
-// @flow
 import React from 'react';
 import classNames from 'classnames';
 import { ComponentLoader } from 'components/ui/loader';
@@ -8,14 +7,14 @@ import styles from './imageLoader.scss';
 
 export default class ImageLoader extends React.Component<
   {
-    src: string,
-    alt: string,
-    ratio: number, // width:height ratio
-    onLoad?: Function,
+    src: string;
+    alt: string;
+    ratio: number; // width:height ratio
+    onLoad?: Function;
   },
   {
-    isLoading: boolean,
-  },
+    isLoading: boolean;
+  }
 > {
   state = {
     isLoading: true,
diff --git a/src/components/ui/loader/index.js b/src/components/ui/loader/index.ts
similarity index 92%
rename from src/components/ui/loader/index.js
rename to src/components/ui/loader/index.ts
index 779d454..4cbf36d 100644
--- a/src/components/ui/loader/index.js
+++ b/src/components/ui/loader/index.ts
@@ -1,4 +1,2 @@
-// @flow
-
 export { default as ImageLoader } from './ImageLoader';
 export { default as ComponentLoader } from './ComponentLoader';
diff --git a/src/components/ui/motion/SlideMotion.js b/src/components/ui/motion/SlideMotion.tsx
similarity index 86%
rename from src/components/ui/motion/SlideMotion.js
rename to src/components/ui/motion/SlideMotion.tsx
index 0d27520..094029a 100644
--- a/src/components/ui/motion/SlideMotion.js
+++ b/src/components/ui/motion/SlideMotion.tsx
@@ -1,23 +1,22 @@
-// @flow
-import React, { Component } from 'react';
-
+import React from 'react';
 import { Motion, spring } from 'react-motion';
 import MeasureHeight from 'components/MeasureHeight';
 
 import styles from './slide-motion.scss';
 
-export default class SlideMotion extends Component<
+interface State {
+  [stepHeight: string]: number;
+  version: number;
+}
+
+class SlideMotion extends React.Component<
   {
-    activeStep: number,
-    children: *,
-  },
-  {
-    version: number,
+    activeStep: number;
+    children: React.ReactNode;
   },
+  State
 > {
-  state: {
-    version: number,
-  } = {
+  state: State = {
     version: 0,
   };
 
@@ -58,7 +57,7 @@ export default class SlideMotion extends Component<
 
     return (
       <Motion style={motionStyle}>
-        {(interpolatingStyle: { height: number, transform: string }) => (
+        {(interpolatingStyle: { height: number; transform: string }) => (
           <div
             style={{
               overflow: 'hidden',
@@ -96,3 +95,5 @@ export default class SlideMotion extends Component<
       });
   }
 }
+
+export default SlideMotion;
diff --git a/src/components/ui/motion/index.js b/src/components/ui/motion/index.ts
similarity index 86%
rename from src/components/ui/motion/index.js
rename to src/components/ui/motion/index.ts
index 0270940..0c4f71f 100644
--- a/src/components/ui/motion/index.js
+++ b/src/components/ui/motion/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default as SlideMotion } from './SlideMotion';
diff --git a/src/components/ui/popup/PopupStack.test.js b/src/components/ui/popup/PopupStack.test.js
index b9368bf..9e49b1c 100644
--- a/src/components/ui/popup/PopupStack.test.js
+++ b/src/components/ui/popup/PopupStack.test.js
@@ -8,7 +8,7 @@ import { shallow, mount } from 'enzyme';
 import { PopupStack } from 'components/ui/popup/PopupStack';
 import styles from 'components/ui/popup/popup.scss';
 
-function DummyPopup() {
+function DummyPopup(/** @type {{[key: string]: any}} */ _props) {
   return null;
 }
 
@@ -133,6 +133,7 @@ describe('<PopupStack />', () => {
     mount(<PopupStack {...props} />);
 
     const event = new Event('keyup');
+    // @ts-ignore
     event.which = 27;
     document.dispatchEvent(event);
 
@@ -156,6 +157,7 @@ describe('<PopupStack />', () => {
     mount(<PopupStack {...props} />);
 
     const event = new Event('keyup');
+    // @ts-ignore
     event.which = 27;
     document.dispatchEvent(event);
 
@@ -178,6 +180,7 @@ describe('<PopupStack />', () => {
     mount(<PopupStack {...props} />);
 
     const event = new Event('keyup');
+    // @ts-ignore
     event.which = 27;
     document.dispatchEvent(event);
 
diff --git a/src/components/ui/popup/PopupStack.js b/src/components/ui/popup/PopupStack.tsx
similarity index 76%
rename from src/components/ui/popup/PopupStack.js
rename to src/components/ui/popup/PopupStack.tsx
index cdd7adb..a6b1f5b 100644
--- a/src/components/ui/popup/PopupStack.js
+++ b/src/components/ui/popup/PopupStack.tsx
@@ -1,22 +1,18 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
+import React from 'react';
 import { TransitionGroup, CSSTransition } from 'react-transition-group';
 import { browserHistory } from 'services/history';
 import { connect } from 'react-redux';
-import { destroy } from 'components/ui/popup/actions';
+import { RootState } from 'reducers';
 
+import { PopupConfig } from './reducer';
+import { destroy } from './actions';
 import styles from './popup.scss';
 
-export class PopupStack extends Component {
-  static propTypes = {
-    popups: PropTypes.arrayOf(
-      PropTypes.shape({
-        type: PropTypes.func,
-        props: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
-      }),
-    ),
-    destroy: PropTypes.func.isRequired,
-  };
+export class PopupStack extends React.Component<{
+  popups: PopupConfig[];
+  destroy: (popup: PopupConfig) => void;
+}> {
+  unlistenTransition: () => void;
 
   componentWillMount() {
     document.addEventListener('keyup', this.onKeyPress);
@@ -60,12 +56,12 @@ export class PopupStack extends Component {
     );
   }
 
-  onClose(popup) {
+  onClose(popup: PopupConfig) {
     return this.props.destroy.bind(null, popup);
   }
 
-  onOverlayClick(popup) {
-    return event => {
+  onOverlayClick(popup: PopupConfig) {
+    return (event: React.MouseEvent) => {
       if (event.target !== event.currentTarget || popup.disableOverlayClose) {
         return;
       }
@@ -77,14 +73,14 @@ export class PopupStack extends Component {
   }
 
   popStack() {
-    const popup = this.props.popups.slice(-1)[0];
+    const [popup] = this.props.popups.slice(-1);
 
     if (popup && !popup.disableOverlayClose) {
       this.props.destroy(popup);
     }
   }
 
-  onKeyPress = event => {
+  onKeyPress = (event: KeyboardEvent) => {
     if (event.which === 27) {
       // ESC key
       this.popStack();
@@ -99,7 +95,7 @@ export class PopupStack extends Component {
 }
 
 export default connect(
-  state => ({
+  (state: RootState) => ({
     ...state.popup,
   }),
   {
diff --git a/src/components/ui/popup/actions.js b/src/components/ui/popup/actions.js
deleted file mode 100644
index a920378..0000000
--- a/src/components/ui/popup/actions.js
+++ /dev/null
@@ -1,29 +0,0 @@
-// @flow
-import type { ElementType } from 'react';
-
-export const POPUP_CREATE = 'POPUP_CREATE';
-
-/**
- * @param {object|ReactComponent} payload - react component or options
- * @param {ReactComponent} payload.Popup
- * @param {bool} [payload.disableOverlayClose=false] - do not allow hiding popup
- *
- * @returns {object}
- */
-export function create(payload: {
-  Popup: ElementType,
-  disableOverlayClose?: boolean,
-}) {
-  return {
-    type: POPUP_CREATE,
-    payload,
-  };
-}
-
-export const POPUP_DESTROY = 'POPUP_DESTROY';
-export function destroy(popup: ElementType) {
-  return {
-    type: POPUP_DESTROY,
-    payload: popup,
-  };
-}
diff --git a/src/components/ui/popup/actions.ts b/src/components/ui/popup/actions.ts
new file mode 100644
index 0000000..2e236c6
--- /dev/null
+++ b/src/components/ui/popup/actions.ts
@@ -0,0 +1,17 @@
+import { PopupConfig } from './reducer';
+
+export const POPUP_CREATE = 'POPUP_CREATE';
+export function create(payload: PopupConfig) {
+  return {
+    type: POPUP_CREATE,
+    payload,
+  };
+}
+
+export const POPUP_DESTROY = 'POPUP_DESTROY';
+export function destroy(popup: PopupConfig) {
+  return {
+    type: POPUP_DESTROY,
+    payload: popup,
+  };
+}
diff --git a/src/components/ui/popup/reducer.js b/src/components/ui/popup/reducer.js
deleted file mode 100644
index 28fbe50..0000000
--- a/src/components/ui/popup/reducer.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { combineReducers } from 'redux';
-
-import { POPUP_CREATE, POPUP_DESTROY } from './actions';
-
-export default combineReducers({
-  popups,
-});
-
-function popups(popups = [], { type, payload = {} }) {
-  switch (type) {
-    case POPUP_CREATE:
-      if (!payload.Popup) {
-        throw new Error('Popup is required');
-      }
-
-      return popups.concat(payload);
-
-    case POPUP_DESTROY:
-      return popups.filter(popup => popup !== payload);
-
-    default:
-      return popups;
-  }
-}
diff --git a/src/components/ui/popup/reducer.test.js b/src/components/ui/popup/reducer.test.js
index 1eda455..17164b7 100644
--- a/src/components/ui/popup/reducer.test.js
+++ b/src/components/ui/popup/reducer.test.js
@@ -1,11 +1,13 @@
 import expect from 'test/unexpected';
-
+import React from 'react';
 import reducer from 'components/ui/popup/reducer';
 import { create, destroy } from 'components/ui/popup/actions';
 
 describe('popup/reducer', () => {
   it('should have no popups by default', () => {
-    const actual = reducer(undefined, {});
+    const actual = reducer(undefined, {
+      type: 'init',
+    });
 
     expect(actual.popups, 'to be an', 'array');
     expect(actual.popups, 'to be empty');
@@ -46,7 +48,12 @@ describe('popup/reducer', () => {
 
     it('throws when no type provided', () => {
       expect(
-        () => reducer(undefined, create({})),
+        () =>
+          reducer(
+            undefined,
+            // @ts-ignore
+            create({}),
+          ),
         'to throw',
         'Popup is required',
       );
@@ -86,4 +93,6 @@ describe('popup/reducer', () => {
   });
 });
 
-function FakeComponent() {}
+function FakeComponent() {
+  return <span />;
+}
diff --git a/src/components/ui/popup/reducer.ts b/src/components/ui/popup/reducer.ts
new file mode 100644
index 0000000..6b99e72
--- /dev/null
+++ b/src/components/ui/popup/reducer.ts
@@ -0,0 +1,36 @@
+import React from 'react';
+import { combineReducers } from 'redux';
+
+import { POPUP_CREATE, POPUP_DESTROY } from './actions';
+
+export interface PopupConfig {
+  Popup: React.ElementType;
+  props?: { [key: string]: any };
+  // do not allow hiding popup
+  disableOverlayClose?: boolean;
+}
+
+export type State = {
+  popups: PopupConfig[];
+};
+
+export default combineReducers<State>({
+  popups,
+});
+
+function popups(state: PopupConfig[] = [], { type, payload }) {
+  switch (type) {
+    case POPUP_CREATE:
+      if (!payload.Popup) {
+        throw new Error('Popup is required');
+      }
+
+      return state.concat(payload);
+
+    case POPUP_DESTROY:
+      return state.filter(popup => popup !== payload);
+
+    default:
+      return state;
+  }
+}
diff --git a/src/components/ui/scroll/ScrollIntoView.js b/src/components/ui/scroll/ScrollIntoView.tsx
similarity index 70%
rename from src/components/ui/scroll/ScrollIntoView.js
rename to src/components/ui/scroll/ScrollIntoView.tsx
index 0e05086..57babac 100644
--- a/src/components/ui/scroll/ScrollIntoView.js
+++ b/src/components/ui/scroll/ScrollIntoView.tsx
@@ -1,13 +1,13 @@
-// @flow
-import type { Location } from 'react-router-dom';
+import { RouteComponentProps } from 'react-router-dom';
 import React from 'react';
 import { withRouter } from 'react-router-dom';
 import { restoreScroll } from './scroll';
 
-class ScrollIntoView extends React.PureComponent<{
-  location: Location,
-  top?: boolean, // do not touch any DOM and simply scroll to top on location change
-}> {
+class ScrollIntoView extends React.PureComponent<
+  RouteComponentProps & {
+    top?: boolean; // do not touch any DOM and simply scroll to top on location change
+  }
+> {
   componentDidMount() {
     this.onPageUpdate();
   }
diff --git a/src/components/ui/scroll/index.js b/src/components/ui/scroll/index.ts
similarity index 86%
rename from src/components/ui/scroll/index.js
rename to src/components/ui/scroll/index.ts
index 2f17421..52e55cd 100644
--- a/src/components/ui/scroll/index.js
+++ b/src/components/ui/scroll/index.ts
@@ -1,3 +1 @@
-// @flow
-
 export { default as ScrollIntoView } from './ScrollIntoView';
diff --git a/src/components/ui/scroll/scroll.js b/src/components/ui/scroll/scroll.ts
similarity index 95%
rename from src/components/ui/scroll/scroll.js
rename to src/components/ui/scroll/scroll.ts
index 22ea2c7..402877e 100644
--- a/src/components/ui/scroll/scroll.js
+++ b/src/components/ui/scroll/scroll.ts
@@ -1,4 +1,3 @@
-// @flow
 /**
  * Implements scroll to animation with momentum effect
  *
@@ -10,7 +9,12 @@ const SCROLL_ANCHOR_OFFSET = 80; // 50 + 30 (header height + some spacing)
 // Первый скролл выполняется сразу после загрузки страницы, так что чтобы снизить
 // нагрузку на рендеринг мы откладываем первый скрол на 200ms
 let isFirstScroll = true;
-let scrollJob = null;
+let scrollJob: {
+  hasAmplitude: boolean;
+  start: number;
+  y: number;
+  amplitude: number;
+} | null = null;
 
 export function scrollTo(y: number) {
   if (scrollJob) {
@@ -107,7 +111,7 @@ function normalizeScrollPosition(y: number): number {
  *
  * @param {?HTMLElement} targetEl - the element to scroll to
  */
-export function restoreScroll(targetEl: ?HTMLElement = null) {
+export function restoreScroll(targetEl: HTMLElement | null = null) {
   const { hash } = window.location;
 
   setTimeout(
diff --git a/src/components/ui/stepper/Stepper.js b/src/components/ui/stepper/Stepper.tsx
similarity index 76%
rename from src/components/ui/stepper/Stepper.js
rename to src/components/ui/stepper/Stepper.tsx
index c62c3ee..55bdde4 100644
--- a/src/components/ui/stepper/Stepper.js
+++ b/src/components/ui/stepper/Stepper.tsx
@@ -1,22 +1,17 @@
-// @flow
 import React from 'react';
-
 import classNames from 'classnames';
-
-import { COLOR_GREEN } from 'components/ui';
+import { Color, COLOR_GREEN } from 'components/ui';
 
 import styles from './stepper.scss';
 
-import type { Color } from 'components/ui';
-
 export default function Stepper({
   totalSteps,
   activeStep,
   color = COLOR_GREEN,
 }: {
-  totalSteps: number,
-  activeStep: number,
-  color?: Color,
+  totalSteps: number;
+  activeStep: number;
+  color?: Color;
 }) {
   return (
     <div className={classNames(styles.steps, styles[`${color}Steps`])}>
diff --git a/src/components/ui/stepper/index.js b/src/components/ui/stepper/index.ts
similarity index 100%
rename from src/components/ui/stepper/index.js
rename to src/components/ui/stepper/index.ts
diff --git a/src/components/user/User.js b/src/components/user/User.ts
similarity index 100%
rename from src/components/user/User.js
rename to src/components/user/User.ts
diff --git a/src/components/user/actions.js b/src/components/user/actions.ts
similarity index 67%
rename from src/components/user/actions.js
rename to src/components/user/actions.ts
index 934c1cc..827eaf8 100644
--- a/src/components/user/actions.js
+++ b/src/components/user/actions.ts
@@ -1,13 +1,13 @@
-// @flow
-import type { User, State } from './reducer';
 import {
   getInfo as getInfoEndpoint,
   changeLang as changeLangEndpoint,
   acceptRules as acceptRulesEndpoint,
+  UserResponse,
 } from 'services/api/accounts';
 import { setLocale } from 'components/i18n/actions';
+import { ThunkAction } from 'reducers';
 
-type Dispatch = (action: Object) => Promise<*>;
+import { User } from './reducer';
 
 export const UPDATE = 'USER_UPDATE';
 /**
@@ -16,7 +16,7 @@ export const UPDATE = 'USER_UPDATE';
  * @param {object} payload
  * @returns {object} - action definition
  */
-export function updateUser(payload: $Shape<User>) {
+export function updateUser(payload: Partial<User>) {
   // Temp workaround
   return {
     type: UPDATE,
@@ -31,7 +31,7 @@ export const SET = 'USER_SET';
  * @param {User} payload
  * @returns {object} - action definition
  */
-export function setUser(payload: $Shape<User>) {
+export function setUser(payload: Partial<User>) {
   return {
     type: SET,
     payload,
@@ -39,8 +39,8 @@ export function setUser(payload: $Shape<User>) {
 }
 
 export const CHANGE_LANG = 'USER_CHANGE_LANG';
-export function changeLang(lang: string) {
-  return (dispatch: Dispatch, getState: () => State) =>
+export function changeLang(lang: string): ThunkAction<Promise<void>> {
+  return (dispatch, getState) =>
     dispatch(setLocale(lang)).then((lang: string) => {
       const { id, isGuest, lang: oldLang } = getState().user;
 
@@ -61,8 +61,8 @@ export function changeLang(lang: string) {
     });
 }
 
-export function setGuest() {
-  return (dispatch: Dispatch, getState: () => Object) => {
+export function setGuest(): ThunkAction<Promise<void>> {
+  return async (dispatch, getState) => {
     dispatch(
       setUser({
         lang: getState().user.lang,
@@ -72,10 +72,16 @@ export function setGuest() {
   };
 }
 
-export function fetchUserData() {
-  return async (dispatch: Dispatch, getState: () => State) => {
-    // $FlowFixMe
-    const resp = await getInfoEndpoint(getState().user.id);
+export function fetchUserData(): ThunkAction<Promise<UserResponse>> {
+  return async (dispatch, getState) => {
+    const { id } = getState().user;
+
+    if (!id) {
+      throw new Error('Can not fetch user data. No user.id available');
+    }
+
+    const resp = await getInfoEndpoint(id);
+
     dispatch(
       updateUser({
         isGuest: false,
@@ -88,8 +94,8 @@ export function fetchUserData() {
   };
 }
 
-export function acceptRules() {
-  return (dispatch: Dispatch, getState: () => State) => {
+export function acceptRules(): ThunkAction<Promise<{ success: boolean }>> {
+  return (dispatch, getState) => {
     const { id } = getState().user;
 
     if (!id) {
diff --git a/src/components/user/factory.js b/src/components/user/factory.ts
similarity index 76%
rename from src/components/user/factory.js
rename to src/components/user/factory.ts
index 74c6bc8..58286eb 100644
--- a/src/components/user/factory.js
+++ b/src/components/user/factory.ts
@@ -1,11 +1,13 @@
-import { changeLang } from 'components/user/actions';
 import { authenticate, logoutStrangers } from 'components/accounts/actions';
 import { getActiveAccount } from 'components/accounts/reducer';
 import request from 'services/request';
+import { Store } from 'reducers';
+
+import { changeLang } from './actions';
 import bearerHeaderMiddleware from './middlewares/bearerHeaderMiddleware';
 import refreshTokenMiddleware from './middlewares/refreshTokenMiddleware';
 
-let promise;
+let promise: Promise<void>;
 
 /**
  * Initializes User state with the fresh data
@@ -14,7 +16,7 @@ let promise;
  *
  * @returns {Promise<User>} - a promise, that resolves in User state
  */
-export function factory(store) {
+export function factory(store: Store): Promise<void> {
   if (promise) {
     return promise;
   }
@@ -24,22 +26,24 @@ export function factory(store) {
 
   promise = Promise.resolve()
     .then(() => store.dispatch(logoutStrangers()))
-    .then(() => {
+    .then(async () => {
       const activeAccount = getActiveAccount(store.getState());
 
       if (activeAccount) {
         // authorizing user if it is possible
-        return store.dispatch(authenticate(activeAccount));
+        await store.dispatch(authenticate(activeAccount));
+
+        return;
       }
 
       return Promise.reject();
     })
-    .catch(() => {
+    .catch(async () => {
       // the user is guest or user authentication failed
       const { user } = store.getState();
 
       // auto-detect guest language
-      return store.dispatch(changeLang(user.lang));
+      await store.dispatch(changeLang(user.lang));
     });
 
   return promise;
diff --git a/src/components/user/index.js b/src/components/user/index.js
deleted file mode 100644
index 10bc226..0000000
--- a/src/components/user/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-// @flow
-export type { User } from './reducer.js';
diff --git a/src/components/user/index.ts b/src/components/user/index.ts
new file mode 100644
index 0000000..d023bc5
--- /dev/null
+++ b/src/components/user/index.ts
@@ -0,0 +1 @@
+export { User } from './reducer.js';
diff --git a/src/components/user/middlewares/bearerHeaderMiddleware.test.js b/src/components/user/middlewares/bearerHeaderMiddleware.test.ts
similarity index 52%
rename from src/components/user/middlewares/bearerHeaderMiddleware.test.js
rename to src/components/user/middlewares/bearerHeaderMiddleware.test.ts
index 82993c2..4c559da 100644
--- a/src/components/user/middlewares/bearerHeaderMiddleware.test.js
+++ b/src/components/user/middlewares/bearerHeaderMiddleware.test.ts
@@ -1,15 +1,16 @@
 import expect from 'test/unexpected';
+import { RootState } from 'reducers';
 
 import bearerHeaderMiddleware from 'components/user/middlewares/bearerHeaderMiddleware';
 
 describe('bearerHeaderMiddleware', () => {
-  const emptyState = {
+  const emptyState: RootState = {
     user: {},
     accounts: {
       active: null,
       available: [],
     },
-  };
+  } as any;
 
   describe('when token available', () => {
     const token = 'foo';
@@ -22,69 +23,80 @@ describe('bearerHeaderMiddleware', () => {
             {
               id: 1,
               token,
+              username: 'username',
+              email: 'email',
+              refreshToken: null,
             },
           ],
         },
       }),
-    });
+    } as any);
 
-    it('should set Authorization header', () => {
-      let data = {
+    it('should set Authorization header', async () => {
+      let data: any = {
         options: {
           headers: {},
         },
       };
 
-      data = middleware.before(data);
+      data = middleware.before && (await middleware.before(data));
 
       expectBearerHeader(data, token);
     });
 
-    it('overrides user.token with options.token if available', () => {
+    it('overrides user.token with options.token if available', async () => {
       const tokenOverride = 'tokenOverride';
-      let data = {
+      let data: any = {
         options: {
           headers: {},
           token: tokenOverride,
         },
       };
 
-      data = middleware.before(data);
+      data = middleware.before && (await middleware.before(data));
 
       expectBearerHeader(data, tokenOverride);
     });
 
-    it('disables token if options.token is null', () => {
+    it('disables token if options.token is null', async () => {
       const tokenOverride = null;
-      let data = {
+      const data: any = {
         options: {
-          headers: {},
+          headers: {} as { [key: string]: any },
           token: tokenOverride,
         },
       };
 
-      data = middleware.before(data);
+      if (!middleware.before) {
+        throw new Error('No middleware.before');
+      }
 
-      expect(data.options.headers.Authorization, 'to be undefined');
+      const resp = await middleware.before(data);
+
+      expect(resp.options.headers.Authorization, 'to be undefined');
     });
   });
 
-  it('should not set Authorization header if no token', () => {
+  it('should not set Authorization header if no token', async () => {
     const middleware = bearerHeaderMiddleware({
       getState: () => ({
         ...emptyState,
       }),
-    });
+    } as any);
 
-    let data = {
+    const data: any = {
       options: {
-        headers: {},
+        headers: {} as { [key: string]: any },
       },
     };
 
-    data = middleware.before(data);
+    if (!middleware.before) {
+      throw new Error('No middleware.before');
+    }
 
-    expect(data.options.headers.Authorization, 'to be undefined');
+    const resp = await middleware.before(data);
+
+    expect(resp.options.headers.Authorization, 'to be undefined');
   });
 
   function expectBearerHeader(data, token) {
diff --git a/src/components/user/middlewares/bearerHeaderMiddleware.js b/src/components/user/middlewares/bearerHeaderMiddleware.ts
similarity index 66%
rename from src/components/user/middlewares/bearerHeaderMiddleware.js
rename to src/components/user/middlewares/bearerHeaderMiddleware.ts
index b8787d5..6716f30 100644
--- a/src/components/user/middlewares/bearerHeaderMiddleware.js
+++ b/src/components/user/middlewares/bearerHeaderMiddleware.ts
@@ -1,5 +1,6 @@
-// @flow
 import { getActiveAccount } from 'components/accounts/reducer';
+import { Store } from 'reducers';
+import { Middleware } from 'services/request';
 
 /**
  * Applies Bearer header for all requests
@@ -12,24 +13,15 @@ import { getActiveAccount } from 'components/accounts/reducer';
  *
  * @returns {object} - request middleware
  */
-export default function bearerHeaderMiddleware(store: {
-  getState: () => Object,
-}) {
+export default function bearerHeaderMiddleware(store: Store): Middleware {
   return {
-    before<
-      T: {
-        options: {
-          token?: ?string,
-          headers: Object,
-        },
-      },
-    >(req: T): T {
+    async before(req) {
       const activeAccount = getActiveAccount(store.getState());
 
-      let { token } = activeAccount || {};
+      let { token = null } = activeAccount || {};
 
       if (req.options.token || req.options.token === null) {
-        token = req.options.token;
+        ({ token } = req.options);
       }
 
       if (token) {
diff --git a/src/components/user/middlewares/refreshTokenMiddleware.test.js b/src/components/user/middlewares/refreshTokenMiddleware.test.ts
similarity index 92%
rename from src/components/user/middlewares/refreshTokenMiddleware.test.js
rename to src/components/user/middlewares/refreshTokenMiddleware.test.ts
index f0c8e70..284542f 100644
--- a/src/components/user/middlewares/refreshTokenMiddleware.test.js
+++ b/src/components/user/middlewares/refreshTokenMiddleware.test.ts
@@ -33,13 +33,13 @@ describe('refreshTokenMiddleware', () => {
       .spy(arg => (typeof arg === 'function' ? arg(dispatch, getState) : arg))
       .named('store.dispatch');
 
-    middleware = refreshTokenMiddleware({ getState, dispatch });
+    middleware = refreshTokenMiddleware({ getState, dispatch } as any);
   });
 
   afterEach(() => {
-    authentication.requestToken.restore();
-    authentication.logout.restore();
-    browserHistory.push.restore();
+    (authentication.requestToken as any).restore();
+    (authentication.logout as any).restore();
+    (browserHistory.push as any).restore();
   });
 
   function assertRelogin() {
@@ -63,6 +63,7 @@ describe('refreshTokenMiddleware', () => {
     describe('when token expired', () => {
       beforeEach(() => {
         const account = {
+          id: 42,
           email,
           token: expiredToken,
           refreshToken,
@@ -87,7 +88,9 @@ describe('refreshTokenMiddleware', () => {
           },
         };
 
-        authentication.requestToken.returns(Promise.resolve(validToken));
+        (authentication.requestToken as any).returns(
+          Promise.resolve(validToken),
+        );
 
         return middleware.before(data).then(resp => {
           expect(resp, 'to satisfy', data);
@@ -125,7 +128,9 @@ describe('refreshTokenMiddleware', () => {
           },
         };
 
-        authentication.requestToken.returns(Promise.resolve(validToken));
+        (authentication.requestToken as any).returns(
+          Promise.resolve(validToken),
+        );
 
         return middleware
           .before(data)
@@ -138,6 +143,7 @@ describe('refreshTokenMiddleware', () => {
 
       it('should relogin if token can not be parsed', () => {
         const account = {
+          id: 42,
           email,
           token: 'realy bad token',
           refreshToken,
@@ -165,7 +171,7 @@ describe('refreshTokenMiddleware', () => {
       });
 
       it('should relogin if token request failed', () => {
-        authentication.requestToken.returns(Promise.reject());
+        (authentication.requestToken as any).returns(Promise.reject());
 
         return expect(
           middleware.before({ url: 'foo', options: {} }),
@@ -174,9 +180,9 @@ describe('refreshTokenMiddleware', () => {
       });
 
       it('should not logout if request failed with 5xx', () => {
-        const resp = new InternalServerError(null, { status: 500 });
+        const resp = new InternalServerError({}, { status: 500 });
 
-        authentication.requestToken.returns(Promise.reject(resp));
+        (authentication.requestToken as any).returns(Promise.reject(resp));
 
         return expect(
           middleware.before({ url: 'foo', options: {} }),
@@ -256,7 +262,7 @@ describe('refreshTokenMiddleware', () => {
 
       restart = sinon.stub().named('restart');
 
-      authentication.requestToken.returns(Promise.resolve(validToken));
+      (authentication.requestToken as any).returns(Promise.resolve(validToken));
     });
 
     function assertNewTokenRequest() {
diff --git a/src/components/user/middlewares/refreshTokenMiddleware.js b/src/components/user/middlewares/refreshTokenMiddleware.ts
similarity index 77%
rename from src/components/user/middlewares/refreshTokenMiddleware.js
rename to src/components/user/middlewares/refreshTokenMiddleware.ts
index 5adde93..a9db069 100644
--- a/src/components/user/middlewares/refreshTokenMiddleware.js
+++ b/src/components/user/middlewares/refreshTokenMiddleware.ts
@@ -1,9 +1,10 @@
-// @flow
 import {
   ensureToken,
   recoverFromTokenError,
 } from 'components/accounts/actions';
 import { getActiveAccount } from 'components/accounts/reducer';
+import { Store } from 'reducers';
+import { Middleware } from 'services/request';
 
 /**
  * Ensures, that all user's requests have fresh access token
@@ -17,14 +18,9 @@ import { getActiveAccount } from 'components/accounts/reducer';
 export default function refreshTokenMiddleware({
   dispatch,
   getState,
-}: {
-  dispatch: Object => *,
-  getState: () => Object,
-}) {
+}: Store): Middleware {
   return {
-    before<T: { options: { token?: string }, url: string }>(
-      req: T,
-    ): Promise<T> {
+    async before(req) {
       const activeAccount = getActiveAccount(getState());
       const disableMiddleware =
         !!req.options.token || req.options.token === null;
@@ -38,11 +34,11 @@ export default function refreshTokenMiddleware({
       return dispatch(ensureToken()).then(() => req);
     },
 
-    catch(
-      resp: { status: number, message: string },
-      req: { options: { token?: string } },
-      restart: () => Promise<mixed>,
-    ): Promise<*> {
+    async catch(
+      resp: { status: number; message: string },
+      req,
+      restart,
+    ): Promise<any> {
       const disableMiddleware =
         !!req.options.token || req.options.token === null;
 
diff --git a/src/components/user/reducer.js b/src/components/user/reducer.ts
similarity index 73%
rename from src/components/user/reducer.js
rename to src/components/user/reducer.ts
index 9adbf92..a791e2b 100644
--- a/src/components/user/reducer.js
+++ b/src/components/user/reducer.ts
@@ -1,25 +1,24 @@
-// @flow
 import { UPDATE, SET, CHANGE_LANG } from './actions';
 
-export type User = {|
-  id: ?number,
-  uuid: ?string,
-  token: string,
-  username: string,
-  email: string,
-  avatar: string,
-  lang: string,
-  isGuest: boolean,
-  isActive: boolean,
-  isOtpEnabled: boolean,
-  passwordChangedAt: number,
-  hasMojangUsernameCollision: boolean,
-  maskedEmail?: string,
-  shouldAcceptRules?: boolean,
-|};
+export interface User {
+  id: number | null;
+  uuid: string | null;
+  token: string;
+  username: string;
+  email: string;
+  avatar: string;
+  lang: string;
+  isGuest: boolean;
+  isActive: boolean;
+  isOtpEnabled: boolean;
+  passwordChangedAt: number;
+  hasMojangUsernameCollision: boolean;
+  maskedEmail?: string;
+  shouldAcceptRules?: boolean;
+}
 
 export type State = {
-  user: User, // TODO: replace with centralized global state
+  user: User; // TODO: replace with centralized global state
 };
 
 const defaults: User = {
@@ -45,7 +44,7 @@ const defaults: User = {
 
 export default function user(
   state: User = defaults,
-  { type, payload }: { type: string, payload: ?Object },
+  { type, payload }: { type: string; payload: any },
 ) {
   switch (type) {
     case CHANGE_LANG:
diff --git a/src/components/userbar/LoggedInPanel.js b/src/components/userbar/LoggedInPanel.tsx
similarity index 90%
rename from src/components/userbar/LoggedInPanel.js
rename to src/components/userbar/LoggedInPanel.tsx
index e00def3..64bbd8b 100644
--- a/src/components/userbar/LoggedInPanel.js
+++ b/src/components/userbar/LoggedInPanel.tsx
@@ -1,24 +1,23 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import classNames from 'classnames';
 import { AccountSwitcher } from 'components/accounts';
 
 import styles from './loggedInPanel.scss';
 
-export default class LoggedInPanel extends Component<
+export default class LoggedInPanel extends React.Component<
   {
-    username: string,
+    username: string;
   },
   {
-    isAccountSwitcherActive: boolean,
-  },
+    isAccountSwitcherActive: boolean;
+  }
 > {
   state = {
     isAccountSwitcherActive: false,
   };
 
   _isMounted: boolean = false;
-  el: ?HTMLElement;
+  el: HTMLElement | null;
 
   componentDidMount() {
     if (window.document) {
@@ -80,7 +79,7 @@ export default class LoggedInPanel extends Component<
     this.toggleAccountSwitcher();
   };
 
-  onExpandAccountSwitcher = (event: Event) => {
+  onExpandAccountSwitcher = (event: React.MouseEvent<HTMLButtonElement>) => {
     event.preventDefault();
 
     this.toggleAccountSwitcher();
@@ -106,9 +105,9 @@ export default class LoggedInPanel extends Component<
  * @returns {Function}
  */
 function createOnOutsideComponentClickHandler(
-  getEl: () => ?HTMLElement,
+  getEl: () => HTMLElement | null,
   isActive: () => boolean,
-  callback: Function,
+  callback: () => void,
 ) {
   // TODO: we have the same logic in LangMenu
   // Probably we should decouple this into some helper function
diff --git a/src/components/userbar/Userbar.js b/src/components/userbar/Userbar.tsx
similarity index 80%
rename from src/components/userbar/Userbar.js
rename to src/components/userbar/Userbar.tsx
index 6fe52cf..cf42c5f 100644
--- a/src/components/userbar/Userbar.js
+++ b/src/components/userbar/Userbar.tsx
@@ -1,8 +1,7 @@
-// @flow
-import type { Account } from 'components/accounts/reducer';
 import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
 import { FormattedMessage as Message } from 'react-intl';
+import { Account } from 'components/accounts/reducer';
 import buttons from 'components/ui/buttons.scss';
 
 import messages from './Userbar.intl.json';
@@ -10,8 +9,8 @@ import styles from './userbar.scss';
 import LoggedInPanel from './LoggedInPanel';
 
 export default class Userbar extends Component<{
-  account: ?Account,
-  guestAction: 'register' | 'login',
+  account: Account | null;
+  guestAction: 'register' | 'login';
 }> {
   static displayName = 'Userbar';
 
@@ -20,10 +19,11 @@ export default class Userbar extends Component<{
   };
 
   render() {
-    const { account } = this.props;
-    let { guestAction } = this.props;
+    const { account, guestAction: actionType } = this.props;
 
-    switch (guestAction) {
+    let guestAction: React.ReactElement;
+
+    switch (actionType) {
       case 'login':
         guestAction = (
           <Link to="/login" className={buttons.blue}>
diff --git a/src/containers/AuthFlowRoute.js b/src/containers/AuthFlowRoute.js
deleted file mode 100644
index 91ff635..0000000
--- a/src/containers/AuthFlowRoute.js
+++ /dev/null
@@ -1,18 +0,0 @@
-// @flow
-import React from 'react';
-import { Route } from 'react-router-dom';
-
-import AuthFlowRouteContents from './AuthFlowRouteContents';
-
-export default function AuthFlowRoute(props: { component: any }) {
-  const { component: Component, ...routeProps } = props;
-
-  return (
-    <Route
-      {...routeProps}
-      render={props => (
-        <AuthFlowRouteContents routerProps={props} component={Component} />
-      )}
-    />
-  );
-}
diff --git a/src/containers/AuthFlowRoute.tsx b/src/containers/AuthFlowRoute.tsx
new file mode 100644
index 0000000..2c9858a
--- /dev/null
+++ b/src/containers/AuthFlowRoute.tsx
@@ -0,0 +1,20 @@
+import React from 'react';
+import { Route, RouteProps } from 'react-router-dom';
+
+import AuthFlowRouteContents from './AuthFlowRouteContents';
+
+export default function AuthFlowRoute(props: RouteProps) {
+  const { component: Component, ...routeProps } = props;
+
+  return (
+    <Route
+      {...routeProps}
+      render={routerProps => (
+        <AuthFlowRouteContents
+          routerProps={routerProps}
+          component={Component}
+        />
+      )}
+    />
+  );
+}
diff --git a/src/containers/AuthFlowRouteContents.test.js b/src/containers/AuthFlowRouteContents.test.tsx
similarity index 92%
rename from src/containers/AuthFlowRouteContents.test.js
rename to src/containers/AuthFlowRouteContents.test.tsx
index d82c2bd..3dd7440 100644
--- a/src/containers/AuthFlowRouteContents.test.js
+++ b/src/containers/AuthFlowRouteContents.test.tsx
@@ -13,7 +13,7 @@ describe('AuthFlowRouteContents', () => {
   });
 
   afterEach(() => {
-    authFlow.handleRequest.restore();
+    (authFlow.handleRequest as any).restore();
   });
 
   function Component() {
@@ -37,7 +37,7 @@ describe('AuthFlowRouteContents', () => {
       },
     };
 
-    authFlow.handleRequest.callsArg(2);
+    (authFlow.handleRequest as any).callsArg(2);
 
     const wrapper = mount(
       <AuthFlowRouteContents routerProps={routerProps} component={Component} />,
diff --git a/src/containers/AuthFlowRouteContents.js b/src/containers/AuthFlowRouteContents.tsx
similarity index 86%
rename from src/containers/AuthFlowRouteContents.js
rename to src/containers/AuthFlowRouteContents.tsx
index 818ec3a..36df068 100644
--- a/src/containers/AuthFlowRouteContents.js
+++ b/src/containers/AuthFlowRouteContents.tsx
@@ -1,22 +1,21 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import { Redirect } from 'react-router-dom';
 
 import authFlow from 'services/authFlow';
 
 type ComponentProps = {
-  component: any,
-  routerProps: Object,
+  component: any;
+  routerProps: { [key: string]: any };
 };
 
-export default class AuthFlowRouteContents extends Component<
+export default class AuthFlowRouteContents extends React.Component<
   ComponentProps,
   {
-    component: any,
-  },
+    component: any;
+  }
 > {
   state: {
-    component: any,
+    component: any;
   } = {
     component: null,
   };
diff --git a/src/containers/PrivateRoute.js b/src/containers/PrivateRoute.js
deleted file mode 100644
index 71507d7..0000000
--- a/src/containers/PrivateRoute.js
+++ /dev/null
@@ -1,35 +0,0 @@
-// @flow
-import type { ComponentType, ElementConfig } from 'react';
-import type { Account } from 'components/accounts';
-import type { Location } from 'react-router-dom';
-import React from 'react';
-import { Route, Redirect } from 'react-router-dom';
-import { connect } from 'react-redux';
-import { getActiveAccount } from 'components/accounts/reducer';
-
-type OwnProps = {|
-  ...$Exact<ElementConfig<typeof Route>>,
-  component: ComponentType<any>,
-|};
-
-type Props = {
-  ...OwnProps,
-  account: ?Account,
-};
-
-const PrivateRoute = ({ account, component: Component, ...rest }: Props) => (
-  <Route
-    {...rest}
-    render={(props: { location: Location }) =>
-      !account || !account.token ? (
-        <Redirect to="/login" />
-      ) : (
-        <Component {...props} />
-      )
-    }
-  />
-);
-
-export default connect<Props, OwnProps, _, _, _, _>(state => ({
-  account: getActiveAccount(state),
-}))(PrivateRoute);
diff --git a/src/containers/PrivateRoute.tsx b/src/containers/PrivateRoute.tsx
new file mode 100644
index 0000000..fce4216
--- /dev/null
+++ b/src/containers/PrivateRoute.tsx
@@ -0,0 +1,29 @@
+import React, { ComponentType } from 'react';
+import { Route, Redirect, RouteProps } from 'react-router-dom';
+import { Location } from 'history';
+import { connect } from 'react-redux';
+import { getActiveAccount } from 'components/accounts/reducer';
+import { Account } from 'components/accounts';
+import { RootState } from 'reducers';
+
+interface Props extends RouteProps {
+  component: ComponentType<any>;
+  account: Account | null;
+}
+
+const PrivateRoute = ({ account, component: Component, ...rest }: Props) => (
+  <Route
+    {...rest}
+    render={(props: { location: Location }) =>
+      !account || !account.token ? (
+        <Redirect to="/login" />
+      ) : (
+        <Component {...props} />
+      )
+    }
+  />
+);
+
+export default connect((state: RootState) => ({
+  account: getActiveAccount(state),
+}))(PrivateRoute);
diff --git a/src/functions.js b/src/functions.ts
similarity index 88%
rename from src/functions.js
rename to src/functions.ts
index 89166a7..902783e 100644
--- a/src/functions.js
+++ b/src/functions.ts
@@ -1,4 +1,3 @@
-// @flow
 let lastId = 0;
 export function uniqueId(prefix: string = 'id'): string {
   return `${prefix}${++lastId}`;
@@ -10,7 +9,10 @@ export function uniqueId(prefix: string = 'id'): string {
  *
  * @returns {object}
  */
-export function omit(obj: Object, keys: Array<string>): Object {
+export function omit(
+  obj: { [key: string]: any },
+  keys: Array<string>,
+): { [key: string]: any } {
   const newObj = { ...obj };
 
   keys.forEach(key => {
@@ -27,7 +29,7 @@ export function omit(obj: Object, keys: Array<string>): Object {
  *
  * @returns {Promise}
  */
-export function loadScript(src: string): Promise<*> {
+export function loadScript(src: string): Promise<void> {
   const script = document.createElement('script');
 
   script.async = true;
@@ -35,7 +37,7 @@ export function loadScript(src: string): Promise<*> {
   script.src = src;
 
   return new Promise((resolve, reject) => {
-    script.onload = resolve;
+    script.onload = () => resolve();
     script.onerror = reject;
 
     if (document && document.body) {
@@ -69,9 +71,9 @@ export { default as debounce } from 'debounce';
 export function getJwtPayloads(
   jwt: string,
 ): {
-  sub: string,
-  jti: number,
-  exp: number,
+  sub: string;
+  jti: number;
+  exp: number;
 } {
   const parts = (jwt || '').split('.');
 
diff --git a/src/i18n/index.js b/src/i18n/index.js
new file mode 100644
index 0000000..96c3289
--- /dev/null
+++ b/src/i18n/index.js
@@ -0,0 +1,86 @@
+module.exports = {
+  be: {
+    code: 'be',
+    name: 'Беларуская',
+    englishName: 'Belarusian',
+    progress: 100,
+    isReleased: true,
+  },
+  en: {
+    code: 'en',
+    name: 'English',
+    englishName: 'English',
+    progress: 100,
+    isReleased: true,
+  },
+  fr: {
+    code: 'fr',
+    name: 'Français',
+    englishName: 'French',
+    progress: 73.5,
+    isReleased: true,
+  },
+  id: {
+    code: 'id',
+    name: 'Bahasa Indonesia',
+    englishName: 'Indonesian',
+    progress: 100,
+    isReleased: true,
+  },
+  lt: {
+    code: 'lt',
+    name: 'Lietuvių',
+    englishName: 'Lithuanian',
+    progress: 81.1,
+    isReleased: false,
+  },
+  pl: {
+    code: 'pl',
+    name: 'Polski',
+    englishName: 'Polish',
+    progress: 81.5,
+    isReleased: false,
+  },
+  pt: {
+    code: 'pt',
+    name: 'Português do Brasil',
+    englishName: 'Portuguese, Brazilian',
+    progress: 100,
+    isReleased: true,
+  },
+  ru: {
+    code: 'ru',
+    name: 'Русский',
+    englishName: 'Russian',
+    progress: 100,
+    isReleased: true,
+  },
+  sr: {
+    code: 'sr',
+    name: 'Српски',
+    englishName: 'Serbian',
+    progress: 100,
+    isReleased: false,
+  },
+  uk: {
+    code: 'uk',
+    name: 'Українська',
+    englishName: 'Ukrainian',
+    progress: 100,
+    isReleased: true,
+  },
+  vi: {
+    code: 'vi',
+    name: 'Tiếng Việt',
+    englishName: 'Vietnamese',
+    progress: 100,
+    isReleased: true,
+  },
+  zh: {
+    code: 'zh',
+    name: '简体中文',
+    englishName: 'Simplified Chinese',
+    progress: 100,
+    isReleased: true,
+  },
+};
diff --git a/src/i18n/index.json b/src/i18n/index.json
deleted file mode 100644
index c89979d..0000000
--- a/src/i18n/index.json
+++ /dev/null
@@ -1,86 +0,0 @@
-{
-  "be": {
-    "code": "be",
-    "name": "Беларуская",
-    "englishName": "Belarusian",
-    "progress": 100,
-    "isReleased": true
-  },
-  "en": {
-    "code": "en",
-    "name": "English",
-    "englishName": "English",
-    "progress": 100,
-    "isReleased": true
-  },
-  "fr": {
-    "code": "fr",
-    "name": "Français",
-    "englishName": "French",
-    "progress": 73.5,
-    "isReleased": true
-  },
-  "id": {
-    "code": "id",
-    "name": "Bahasa Indonesia",
-    "englishName": "Indonesian",
-    "progress": 100,
-    "isReleased": true
-  },
-  "lt": {
-    "code": "lt",
-    "name": "Lietuvių",
-    "englishName": "Lithuanian",
-    "progress": 81.1,
-    "isReleased": false
-  },
-  "pl": {
-    "code": "pl",
-    "name": "Polski",
-    "englishName": "Polish",
-    "progress": 81.5,
-    "isReleased": false
-  },
-  "pt": {
-    "code": "pt",
-    "name": "Português do Brasil",
-    "englishName": "Portuguese, Brazilian",
-    "progress": 100,
-    "isReleased": true
-  },
-  "ru": {
-    "code": "ru",
-    "name": "Русский",
-    "englishName": "Russian",
-    "progress": 100,
-    "isReleased": true
-  },
-  "sr": {
-    "code": "sr",
-    "name": "Српски",
-    "englishName": "Serbian",
-    "progress": 100,
-    "isReleased": false
-  },
-  "uk": {
-    "code": "uk",
-    "name": "Українська",
-    "englishName": "Ukrainian",
-    "progress": 100,
-    "isReleased": true
-  },
-  "vi": {
-    "code": "vi",
-    "name": "Tiếng Việt",
-    "englishName": "Vietnamese",
-    "progress": 100,
-    "isReleased": true
-  },
-  "zh": {
-    "code": "zh",
-    "name": "简体中文",
-    "englishName": "Simplified Chinese",
-    "progress": 100,
-    "isReleased": true
-  }
-}
diff --git a/src/index.js b/src/index.tsx
similarity index 84%
rename from src/index.js
rename to src/index.tsx
index a2c0407..b968471 100644
--- a/src/index.js
+++ b/src/index.tsx
@@ -16,10 +16,12 @@ import { loadScript, debounce } from 'functions';
 
 import App from './App';
 
+const win: { [key: string]: any } = window as any;
+
 history.init();
 
 logger.init({
-  sentryCdn: window.SENTRY_CDN,
+  sentryCdn: (window as any).SENTRY_CDN as string,
 });
 
 const store = storeFactory();
@@ -42,15 +44,18 @@ Promise.all([
 
 const trackPageView = debounce(_trackPageView);
 function initAnalytics() {
-  if (!window.ga) {
-    const ga = function(...args) {
+  if (!win.ga) {
+    const ga: {
+      [key: string]: any;
+      (...args: any[]): void;
+    } = function(...args) {
       // eslint-disable-next-line id-length
       (ga.q = ga.q || []).push(args);
     };
-    window.ga = ga;
+    win.ga = ga;
     ga.l = Date.now(); // eslint-disable-line
 
-    if (window.GA_ID) {
+    if (win.GA_ID) {
       // when GA is not available, we will continue to push into array
       // for debug purposes
       // Catch to prevent "unhandled rejection" error
@@ -59,7 +64,7 @@ function initAnalytics() {
       ).catch(() => {});
     }
 
-    ga('create', window.GA_ID, 'auto');
+    ga('create', win.GA_ID, 'auto');
     trackPageView(location);
 
     browserHistory.listen(trackPageView);
@@ -67,7 +72,7 @@ function initAnalytics() {
 }
 
 function _trackPageView(location) {
-  const { ga } = window;
+  const { ga } = win;
 
   ga('set', 'page', location.pathname + location.search);
   ga('send', 'pageview');
@@ -76,23 +81,23 @@ function _trackPageView(location) {
 /* global process: false */
 if (process.env.NODE_ENV !== 'production') {
   // some shortcuts for testing on localhost
-  window.testOAuth = (loginHint = '') =>
+  win.testOAuth = (loginHint = '') =>
     (location.href = `/oauth2/v1/ely?client_id=ely&redirect_uri=http%3A%2F%2Fely.by%2Fauthorization%2Foauth&response_type=code&scope=account_info%2Caccount_email&login_hint=${loginHint}`);
-  window.testOAuthPermissions = () =>
+  win.testOAuthPermissions = () =>
     (location.href =
       '/oauth2/v1/tlauncher?client_id=tlauncher&redirect_uri=http%3A%2F%2Flocalhost%3A8080&response_type=code&scope=account_info,account_email');
-  window.testOAuthPromptAccount = () =>
+  win.testOAuthPromptAccount = () =>
     (location.href =
       '/oauth2/v1/ely?client_id=ely&redirect_uri=http%3A%2F%2Fely.by%2Fauthorization%2Foauth&response_type=code&scope=account_info%2Caccount_email&prompt=select_account');
-  window.testOAuthPromptPermissions = (loginHint = '') =>
+  win.testOAuthPromptPermissions = (loginHint = '') =>
     (location.href = `/oauth2/v1/ely?client_id=ely&redirect_uri=http%3A%2F%2Fely.by%2Fauthorization%2Foauth&response_type=code&scope=account_info%2Caccount_email&prompt=consent&login_hint=${loginHint}`);
-  window.testOAuthPromptAll = () =>
+  win.testOAuthPromptAll = () =>
     (location.href =
       '/oauth2/v1/ely?client_id=ely&redirect_uri=http%3A%2F%2Fely.by%2Fauthorization%2Foauth&response_type=code&scope=account_info%2Caccount_email&prompt=select_account,consent');
-  window.testOAuthStatic = () =>
+  win.testOAuthStatic = () =>
     (location.href =
       '/oauth2/v1/ely?client_id=ely&redirect_uri=static_page_with_code&response_type=code&scope=account_info%2Caccount_email');
-  window.testOAuthStaticCode = () =>
+  win.testOAuthStaticCode = () =>
     (location.href =
       '/oauth2/v1/ely?client_id=ely&redirect_uri=static_page&response_type=code&scope=account_info%2Caccount_email');
 }
diff --git a/src/pages/auth/AuthPage.js b/src/pages/auth/AuthPage.tsx
similarity index 92%
rename from src/pages/auth/AuthPage.js
rename to src/pages/auth/AuthPage.tsx
index c533cf3..802d415 100644
--- a/src/pages/auth/AuthPage.js
+++ b/src/pages/auth/AuthPage.tsx
@@ -1,11 +1,7 @@
-// @flow
-import React, { Component } from 'react';
-
+import React from 'react';
 import { Route, Switch, Redirect } from 'react-router-dom';
-
 import AppInfo from 'components/auth/appInfo/AppInfo';
 import PanelTransition from 'components/auth/PanelTransition';
-
 import Register from 'components/auth/register/Register';
 import Login from 'components/auth/login/Login';
 import Permissions from 'components/auth/permissions/Permissions';
@@ -20,6 +16,8 @@ import Mfa from 'components/auth/mfa/Mfa';
 import Finish from 'components/auth/finish/Finish';
 import { connect } from 'react-redux';
 import { withRouter } from 'react-router-dom';
+import { RootState } from 'reducers';
+import { Client } from 'components/auth/reducer';
 
 import styles from './auth.scss';
 
@@ -29,22 +27,15 @@ import styles from './auth.scss';
 // so that it persist disregarding remounts
 let isSidebarHiddenCache = false;
 
-type OwnProps = {||};
+interface Props {
+  client: Client | null;
+}
 
-type Props = {
-  ...OwnProps,
-  client: {
-    id: string,
-    name: string,
-    description: string,
-  },
-};
-
-class AuthPage extends Component<
+class AuthPage extends React.Component<
   Props,
   {
-    isSidebarHidden: boolean,
-  },
+    isSidebarHidden: boolean;
+  }
 > {
   state = {
     isSidebarHidden: isSidebarHiddenCache,
@@ -132,7 +123,7 @@ function renderPanelTransition(factory) {
 }
 
 export default withRouter(
-  connect<Props, OwnProps, _, _, _, _>(state => ({
+  connect((state: RootState) => ({
     client: state.auth.client,
   }))(AuthPage),
 );
diff --git a/src/pages/auth/SuccessOauthPage.js b/src/pages/auth/SuccessOauthPage.tsx
similarity index 90%
rename from src/pages/auth/SuccessOauthPage.js
rename to src/pages/auth/SuccessOauthPage.tsx
index 08d6846..3c9ce3a 100644
--- a/src/pages/auth/SuccessOauthPage.js
+++ b/src/pages/auth/SuccessOauthPage.tsx
@@ -1,22 +1,18 @@
-// @flow
-import React, { Component } from 'react';
-
+import React from 'react';
 import { Link } from 'react-router-dom';
 import { FormattedMessage as Message } from 'react-intl';
 import Helmet from 'react-helmet';
-
 import loader from 'services/loader';
 import rootMessages from 'pages/root/RootPage.intl.json';
+import { Query } from 'services/request';
 
 import styles from './success-oauth.scss';
 import messages from './SuccessOauthPage.intl.json';
 
-import type { Query } from 'services/request';
-
-export default class SuccessOauthPage extends Component<{
+export default class SuccessOauthPage extends React.Component<{
   location: {
-    query: Query<'appName'>,
-  },
+    query: Query<'appName'>;
+  };
 }> {
   componentDidMount() {
     this.onPageUpdate();
@@ -24,6 +20,7 @@ export default class SuccessOauthPage extends Component<{
     setTimeout(() => {
       try {
         // try to close window if possible
+        // @ts-ignore
         window.open('', '_self').close();
       } catch (err) {
         // don't care
diff --git a/src/pages/dev/ApplicationsListPage.js b/src/pages/dev/ApplicationsListPage.tsx
similarity index 68%
rename from src/pages/dev/ApplicationsListPage.js
rename to src/pages/dev/ApplicationsListPage.tsx
index 94436fe..6dddf5a 100644
--- a/src/pages/dev/ApplicationsListPage.js
+++ b/src/pages/dev/ApplicationsListPage.tsx
@@ -1,8 +1,5 @@
-// @flow
-import type { Location, RouterHistory } from 'react-router-dom';
-import type { User } from 'components/user';
-import type { OauthAppResponse } from 'services/api/oauth';
-import React, { Component } from 'react';
+import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
 import { connect } from 'react-redux';
 import {
   fetchAvailableApps,
@@ -10,27 +7,24 @@ import {
   deleteApp,
 } from 'components/dev/apps/actions';
 import ApplicationsIndex from 'components/dev/apps/ApplicationsIndex';
+import { User } from 'components/user';
+import { OauthAppResponse } from 'services/api/oauth';
+import { RootState } from 'reducers';
 
-type OwnProps = {|
-  location: Location,
-  history: RouterHistory,
-|};
-
-type Props = {
-  ...OwnProps,
-  user: User,
-  apps: OauthAppResponse[],
-  fetchAvailableApps: () => Promise<void>,
-  deleteApp: string => Promise<void>,
-  resetApp: (string, boolean) => Promise<void>,
-};
+interface Props extends RouteComponentProps {
+  user: User;
+  apps: OauthAppResponse[];
+  fetchAvailableApps: () => Promise<void>;
+  deleteApp: (clientId: string) => Promise<void>;
+  resetApp: (clientId: string, resetClientSecret: boolean) => Promise<void>;
+}
 
 type State = {
-  isLoading: boolean,
-  forceUpdate: boolean,
+  isLoading: boolean;
+  forceUpdate: boolean;
 };
 
-class ApplicationsListPage extends Component<Props, State> {
+class ApplicationsListPage extends React.Component<Props, State> {
   state = {
     isLoading: false,
     forceUpdate: false,
@@ -84,12 +78,11 @@ class ApplicationsListPage extends Component<Props, State> {
   };
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
-  state => ({
+export default connect(
+  (state: RootState) => ({
     user: state.user,
     apps: state.apps.available,
   }),
-  // $FlowFixMe: we need a better action typings for thunks
   {
     fetchAvailableApps,
     resetApp,
diff --git a/src/pages/dev/CreateNewApplicationPage.js b/src/pages/dev/CreateNewApplicationPage.tsx
similarity index 87%
rename from src/pages/dev/CreateNewApplicationPage.js
rename to src/pages/dev/CreateNewApplicationPage.tsx
index d54fa5c..65d37c7 100644
--- a/src/pages/dev/CreateNewApplicationPage.js
+++ b/src/pages/dev/CreateNewApplicationPage.tsx
@@ -1,11 +1,10 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
-import type { ApplicationType } from 'components/dev/apps';
 import React, { Component } from 'react';
 import { FormModel } from 'components/ui/form';
 import ApplicationForm from 'components/dev/apps/applicationForm/ApplicationForm';
 import oauth from 'services/api/oauth';
 import { browserHistory } from 'services/history';
+import { OauthAppResponse } from 'services/api/oauth';
+import { ApplicationType } from 'components/dev/apps';
 
 const app: OauthAppResponse = {
   clientId: '',
@@ -20,13 +19,12 @@ const app: OauthAppResponse = {
   minecraftServerIp: '',
 };
 
-export default class CreateNewApplicationPage extends Component<
-  {},
-  {
-    type: ?ApplicationType,
-  },
-> {
-  state = {
+interface State {
+  type: ApplicationType | null;
+}
+
+export default class CreateNewApplicationPage extends Component<{}, State> {
+  state: State = {
     type: null,
   };
 
diff --git a/src/pages/dev/DevPage.js b/src/pages/dev/DevPage.tsx
similarity index 99%
rename from src/pages/dev/DevPage.js
rename to src/pages/dev/DevPage.tsx
index 33ccdee..63d09a3 100644
--- a/src/pages/dev/DevPage.js
+++ b/src/pages/dev/DevPage.tsx
@@ -1,4 +1,3 @@
-// @flow
 import React from 'react';
 import { Redirect, Route, Switch } from 'react-router-dom';
 import { FooterMenu } from 'components/footerMenu';
diff --git a/src/pages/dev/UpdateApplicationPage.js b/src/pages/dev/UpdateApplicationPage.tsx
similarity index 76%
rename from src/pages/dev/UpdateApplicationPage.js
rename to src/pages/dev/UpdateApplicationPage.tsx
index 7ad0bcd..7027082 100644
--- a/src/pages/dev/UpdateApplicationPage.js
+++ b/src/pages/dev/UpdateApplicationPage.tsx
@@ -1,35 +1,34 @@
-// @flow
-import type { OauthAppResponse } from 'services/api/oauth';
-import React, { Component } from 'react';
+import React from 'react';
 import { connect } from 'react-redux';
 import logger from 'services/logger';
+import { RouteComponentProps } from 'react-router';
 import { FormModel } from 'components/ui/form';
 import { browserHistory } from 'services/history';
 import oauth from 'services/api/oauth';
 import loader from 'services/loader';
 import PageNotFound from 'pages/404/PageNotFound';
-import { getApp, fetchApp } from 'components/dev/apps/actions';
+import {
+  getApp,
+  fetchApp as fetchAppAction,
+} from 'components/dev/apps/actions';
 import ApplicationForm from 'components/dev/apps/applicationForm/ApplicationForm';
+import { OauthAppResponse } from 'services/api/oauth';
+import { RootState } from 'reducers';
 
-type OwnProps = {|
-  match: {
-    params: {
-      clientId: string,
-    },
-  },
-|};
+type OwnProps = RouteComponentProps<{
+  clientId: string;
+}>;
 
-type Props = {
-  ...OwnProps,
-  app: ?OauthAppResponse,
-  fetchApp: string => Promise<void>,
-};
+interface Props extends OwnProps {
+  app: OauthAppResponse | null;
+  fetchApp: (app: string) => Promise<void>;
+}
 
-class UpdateApplicationPage extends Component<
+class UpdateApplicationPage extends React.Component<
   Props,
   {
-    isNotFound: boolean,
-  },
+    isNotFound: boolean;
+  }
 > {
   form: FormModel = new FormModel();
 
@@ -111,11 +110,11 @@ class UpdateApplicationPage extends Component<
     browserHistory.push(`/dev/applications${hash ? `#${hash}` : ''}`);
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
-  (state, props) => ({
+export default connect(
+  (state: RootState, props: OwnProps) => ({
     app: getApp(state, props.match.params.clientId),
   }),
   {
-    fetchApp,
+    fetchApp: fetchAppAction,
   },
 )(UpdateApplicationPage);
diff --git a/src/pages/profile/ChangeEmailPage.js b/src/pages/profile/ChangeEmailPage.tsx
similarity index 79%
rename from src/pages/profile/ChangeEmailPage.js
rename to src/pages/profile/ChangeEmailPage.tsx
index 5bc0fed..f420baf 100644
--- a/src/pages/profile/ChangeEmailPage.js
+++ b/src/pages/profile/ChangeEmailPage.tsx
@@ -1,36 +1,27 @@
-// @flow
-import type { RouterHistory, Match } from 'react-router-dom';
-import type FormModel from 'components/ui/form/FormModel';
+import React from 'react';
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import { RouteComponentProps } from 'react-router-dom';
+import FormModel from 'components/ui/form/FormModel';
 import ChangeEmail from 'components/profile/changeEmail/ChangeEmail';
 import {
   requestEmailChange,
   setNewEmail,
   confirmNewEmail,
 } from 'services/api/accounts';
+import { RootState } from 'reducers';
 
-type OwnProps = {|
-  history: RouterHistory,
-  match: {
-    ...Match,
-    params: {
-      step: 'step1' | 'step2' | 'step3',
-      code: string,
-    },
-  },
-|};
+interface RouteParams {
+  step: 'step1' | 'step2' | 'step3';
+  code: string;
+}
 
-type Props = {
-  ...OwnProps,
-  lang: string,
-  email: string,
-};
-
-class ChangeEmailPage extends Component<Props> {
-  static displayName = 'ChangeEmailPage';
+interface Props extends RouteComponentProps<RouteParams> {
+  lang: string;
+  email: string;
+}
 
+class ChangeEmailPage extends React.Component<Props> {
   static contextTypes = {
     userId: PropTypes.number.isRequired,
     onSubmit: PropTypes.func.isRequired,
@@ -54,7 +45,7 @@ class ChangeEmailPage extends Component<Props> {
         onSubmit={this.onSubmit}
         email={this.props.email}
         lang={this.props.lang}
-        step={((step.slice(-1): any): number) * 1 - 1}
+        step={Number(step.slice(-1)) - 1}
         onChangeStep={this.onChangeStep}
         code={code}
       />
@@ -97,7 +88,7 @@ class ChangeEmailPage extends Component<Props> {
   };
 }
 
-function handleErrors(repeatUrl) {
+function handleErrors(repeatUrl: string | void) {
   return resp => {
     if (resp.errors) {
       if (resp.errors.key) {
@@ -123,7 +114,7 @@ function handleErrors(repeatUrl) {
   };
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(state => ({
+export default connect((state: RootState) => ({
   email: state.user.email,
   lang: state.user.lang,
 }))(ChangeEmailPage);
diff --git a/src/pages/profile/ChangePasswordPage.js b/src/pages/profile/ChangePasswordPage.tsx
similarity index 73%
rename from src/pages/profile/ChangePasswordPage.js
rename to src/pages/profile/ChangePasswordPage.tsx
index e811edf..1e0800c 100644
--- a/src/pages/profile/ChangePasswordPage.js
+++ b/src/pages/profile/ChangePasswordPage.tsx
@@ -1,22 +1,19 @@
-// @flow
-import type { User } from 'components/user';
+import React from 'react';
+import { connect } from 'react-redux';
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
 import { changePassword } from 'services/api/accounts';
 import { FormModel } from 'components/ui/form';
 import ChangePassword from 'components/profile/changePassword/ChangePassword';
+import { User } from 'components/user';
+import { updateUser } from 'components/user/actions';
 
-type OwnProps = {||};
+type OwnProps = {};
 
-type Props = {
-  ...OwnProps,
-  updateUser: (fields: $Shape<User>) => void,
+type Props = OwnProps & {
+  updateUser: (fields: Partial<User>) => void;
 };
 
-class ChangePasswordPage extends Component<Props> {
-  static displayName = 'ChangePasswordPage';
-
+class ChangePasswordPage extends React.Component<Props> {
   static contextTypes = {
     userId: PropTypes.number.isRequired,
     onSubmit: PropTypes.func.isRequired,
@@ -46,9 +43,6 @@ class ChangePasswordPage extends Component<Props> {
   };
 }
 
-import { connect } from 'react-redux';
-import { updateUser } from 'components/user/actions';
-
-export default connect<Props, OwnProps, _, _, _, _>(null, {
+export default connect(null, {
   updateUser,
 })(ChangePasswordPage);
diff --git a/src/pages/profile/ChangeUsernamePage.js b/src/pages/profile/ChangeUsernamePage.tsx
similarity index 86%
rename from src/pages/profile/ChangeUsernamePage.js
rename to src/pages/profile/ChangeUsernamePage.tsx
index 68c8315..c47d03f 100644
--- a/src/pages/profile/ChangeUsernamePage.js
+++ b/src/pages/profile/ChangeUsernamePage.tsx
@@ -1,19 +1,20 @@
-// @flow
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-
+import React from 'react';
+import { connect } from 'react-redux';
+import { updateUser } from 'components/user/actions';
+import { RootState } from 'reducers';
 import { changeUsername } from 'services/api/accounts';
 import { FormModel } from 'components/ui/form';
 import ChangeUsername from 'components/profile/changeUsername/ChangeUsername';
 
-type OwnProps = {||};
+type OwnProps = {};
 
 type Props = {
-  username: string,
-  updateUsername: (username: string) => void,
+  username: string;
+  updateUsername: (username: string) => void;
 };
 
-class ChangeUsernamePage extends Component<Props> {
+class ChangeUsernamePage extends React.Component<Props> {
   static contextTypes = {
     userId: PropTypes.number.isRequired,
     onSubmit: PropTypes.func.isRequired,
@@ -73,11 +74,8 @@ class ChangeUsernamePage extends Component<Props> {
   };
 }
 
-import { connect } from 'react-redux';
-import { updateUser } from 'components/user/actions';
-
-export default connect<Props, OwnProps, _, _, _, _>(
-  state => ({
+export default connect(
+  (state: RootState) => ({
     username: state.user.username,
   }),
   {
diff --git a/src/pages/profile/MultiFactorAuthPage.js b/src/pages/profile/MultiFactorAuthPage.tsx
similarity index 58%
rename from src/pages/profile/MultiFactorAuthPage.js
rename to src/pages/profile/MultiFactorAuthPage.tsx
index dd7acae..73bfe83 100644
--- a/src/pages/profile/MultiFactorAuthPage.js
+++ b/src/pages/profile/MultiFactorAuthPage.tsx
@@ -1,30 +1,20 @@
-// @flow
-import type { RouterHistory, Match } from 'react-router-dom';
-import React, { Component } from 'react';
+import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
+import MultiFactorAuth, { MfaStep } from 'components/profile/multiFactorAuth';
+import { FormModel } from 'components/ui/form';
+import { User } from 'components/user';
+import { RootState } from 'reducers';
 
-import MultiFactorAuth from 'components/profile/multiFactorAuth';
-import type { MfaStep } from 'components/profile/multiFactorAuth';
-import type { FormModel } from 'components/ui/form';
-import type { User } from 'components/user';
+interface Props
+  extends RouteComponentProps<{
+    step?: '1' | '2' | '3';
+  }> {
+  user: User;
+}
 
-type OwnProps = {|
-  history: RouterHistory,
-  match: {
-    ...Match,
-    params: {
-      step?: '1' | '2' | '3',
-    },
-  },
-|};
-
-type Props = {
-  ...OwnProps,
-  user: User,
-};
-
-class MultiFactorAuthPage extends Component<Props> {
+class MultiFactorAuthPage extends React.Component<Props> {
   static contextTypes = {
     onSubmit: PropTypes.func.isRequired,
     goToProfile: PropTypes.func.isRequired,
@@ -63,10 +53,9 @@ class MultiFactorAuthPage extends Component<Props> {
   }
 
   getStep(): MfaStep {
-    const step = (parseInt(this.props.match.params.step, 10) || 1) - 1;
+    const step = Number(this.props.match.params.step) - 1;
 
     if (step !== 0 && step !== 1 && step !== 2) {
-      // NOTE: flow does not understand Array.includes()
       return 1;
     }
 
@@ -77,7 +66,7 @@ class MultiFactorAuthPage extends Component<Props> {
     this.props.history.push(`/profile/mfa/step${step + 1}`);
   };
 
-  onSubmit = (form: FormModel, sendData: () => Promise<*>) => {
+  onSubmit = (form: FormModel, sendData: () => Promise<void>) => {
     return this.context.onSubmit({
       form,
       sendData,
@@ -89,6 +78,6 @@ class MultiFactorAuthPage extends Component<Props> {
   };
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(({ user }) => ({ user }))(
+export default connect(({ user }: RootState) => ({ user }))(
   MultiFactorAuthPage,
 );
diff --git a/src/pages/profile/ProfilePage.js b/src/pages/profile/ProfilePage.tsx
similarity index 90%
rename from src/pages/profile/ProfilePage.js
rename to src/pages/profile/ProfilePage.tsx
index 4ee90ec..156fdb2 100644
--- a/src/pages/profile/ProfilePage.js
+++ b/src/pages/profile/ProfilePage.tsx
@@ -1,9 +1,7 @@
-// @flow
-import React, { Component } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { Route, Switch, Redirect } from 'react-router-dom';
 import { connect } from 'react-redux';
-
 import { fetchUserData } from 'components/user/actions';
 import { create as createPopup } from 'components/ui/popup/actions';
 import PasswordRequestForm from 'components/profile/passwordRequestForm/PasswordRequestForm';
@@ -15,21 +13,21 @@ import ChangePasswordPage from 'pages/profile/ChangePasswordPage';
 import ChangeUsernamePage from 'pages/profile/ChangeUsernamePage';
 import ChangeEmailPage from 'pages/profile/ChangeEmailPage';
 import MultiFactorAuthPage from 'pages/profile/MultiFactorAuthPage';
+import { FormModel } from 'components/ui/form';
+import { RootState } from 'reducers';
 
 import styles from './profile.scss';
 
-import type { FormModel } from 'components/ui/form';
+interface Props {
+  userId: number;
+  onSubmit: (options: {
+    form: FormModel;
+    sendData: () => Promise<any>;
+  }) => void;
+  fetchUserData: () => Promise<any>;
+}
 
-type OwnProps = {||};
-
-type Props = {
-  ...OwnProps,
-  userId: number,
-  onSubmit: ({ form: FormModel, sendData: () => Promise<*> }) => void,
-  fetchUserData: () => Promise<*>,
-};
-
-class ProfilePage extends Component<Props> {
+class ProfilePage extends React.Component<Props> {
   static childContextTypes = {
     userId: PropTypes.number,
     onSubmit: PropTypes.func,
@@ -82,8 +80,8 @@ class ProfilePage extends Component<Props> {
   goToProfile = () => browserHistory.push('/');
 }
 
-export default connect<Props, OwnProps, _, _, _, _>(
-  state => ({
+export default connect(
+  (state: RootState) => ({
     userId: state.user.id,
   }),
   {
@@ -92,8 +90,8 @@ export default connect<Props, OwnProps, _, _, _, _>(
       form,
       sendData,
     }: {
-      form: FormModel,
-      sendData: () => Promise<*>,
+      form: FormModel;
+      sendData: () => Promise<any>;
     }) => dispatch => {
       form.beginLoading();
 
@@ -143,7 +141,7 @@ export default connect<Props, OwnProps, _, _, _, _>(
         return new Promise((resolve, reject) => {
           dispatch(
             createPopup({
-              Popup(props: { onClose: Function }) {
+              Popup(props: { onClose: () => Promise<any> }) {
                 const onSubmit = () => {
                   form.beginLoading();
 
diff --git a/src/pages/root/RootPage.js b/src/pages/root/RootPage.tsx
similarity index 90%
rename from src/pages/root/RootPage.js
rename to src/pages/root/RootPage.tsx
index 2e7b9e0..c2259f3 100644
--- a/src/pages/root/RootPage.js
+++ b/src/pages/root/RootPage.tsx
@@ -1,6 +1,3 @@
-// @flow
-import type { User } from 'components/user';
-import type { Account } from 'components/accounts/reducer';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { resetAuth } from 'components/auth/actions';
@@ -21,18 +18,21 @@ import Userbar from 'components/userbar/Userbar';
 import PopupStack from 'components/ui/popup/PopupStack';
 import loader from 'services/loader';
 import { getActiveAccount } from 'components/accounts/reducer';
+import { User } from 'components/user';
+import { Account } from 'components/accounts/reducer';
+import { RootState } from 'reducers';
 
 import styles from './root.scss';
 import messages from './RootPage.intl.json';
 
 class RootPage extends Component<{
-  account: ?Account,
-  user: User,
-  isPopupActive: boolean,
-  onLogoClick: Function,
+  account: Account | null;
+  user: User;
+  isPopupActive: boolean;
+  onLogoClick: (event: React.MouseEvent<HTMLAnchorElement>) => void;
   location: {
-    pathname: string,
-  },
+    pathname: string;
+  };
 }> {
   componentDidMount() {
     this.onPageUpdate();
@@ -102,7 +102,7 @@ class RootPage extends Component<{
 
 export default withRouter(
   connect(
-    state => ({
+    (state: RootState) => ({
       user: state.user,
       account: getActiveAccount(state),
       isPopupActive: state.popup.popups.length > 0,
diff --git a/src/pages/rules/RulesPage.test.js b/src/pages/rules/RulesPage.test.tsx
similarity index 93%
rename from src/pages/rules/RulesPage.test.js
rename to src/pages/rules/RulesPage.test.tsx
index 6cf87f3..c840fdf 100644
--- a/src/pages/rules/RulesPage.test.js
+++ b/src/pages/rules/RulesPage.test.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-
 import sinon from 'sinon';
 import expect from 'test/unexpected';
 import { shallow } from 'enzyme';
@@ -18,7 +17,10 @@ describe('RulesPage', () => {
       replace = sinon.stub().named('history.replace');
 
       page = shallow(
-        <RulesPage location={{ pathname, search }} history={{ replace }} />,
+        <RulesPage
+          location={{ pathname, search } as any}
+          history={{ replace }}
+        />,
       );
     });
 
diff --git a/src/pages/rules/RulesPage.js b/src/pages/rules/RulesPage.tsx
similarity index 96%
rename from src/pages/rules/RulesPage.js
rename to src/pages/rules/RulesPage.tsx
index 3ec7343..f7e9cce 100644
--- a/src/pages/rules/RulesPage.js
+++ b/src/pages/rules/RulesPage.tsx
@@ -1,14 +1,10 @@
-// @flow
 import React, { Component } from 'react';
-
 import { Link } from 'react-router-dom';
 import { FormattedMessage as Message } from 'react-intl';
 import Helmet from 'react-helmet';
-
 import { FooterMenu } from 'components/footerMenu';
 
 import styles from './rules.scss';
-
 import messages from './RulesPage.intl.json';
 import appInfo from 'components/auth/appInfo/AppInfo.intl.json';
 
@@ -83,14 +79,14 @@ const rules = [
 
 export default class RulesPage extends Component<{
   location: {
-    pathname: string,
-    search: string,
-    hash: string,
-  },
+    pathname: string;
+    search: string;
+    hash: string;
+  };
 
   history: {
-    replace: Function,
-  },
+    replace: Function;
+  };
 }> {
   render() {
     let { hash } = this.props.location;
@@ -153,7 +149,7 @@ export default class RulesPage extends Component<{
     );
   }
 
-  onRuleClick(event: SyntheticMouseEvent<HTMLElement>) {
+  onRuleClick(event: React.SyntheticEvent<HTMLElement>) {
     if (
       event.defaultPrevented ||
       !event.currentTarget.id ||
diff --git a/src/reducers.js b/src/reducers.js
deleted file mode 100644
index 7fa2573..0000000
--- a/src/reducers.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import { combineReducers } from 'redux';
-
-import auth from 'components/auth/reducer';
-import user from 'components/user/reducer';
-import accounts from 'components/accounts/reducer';
-import i18n from 'components/i18n/reducer';
-import popup from 'components/ui/popup/reducer';
-import bsod from 'components/ui/bsod/reducer';
-import apps from 'components/dev/apps/reducer';
-
-export default combineReducers({
-  bsod,
-  auth,
-  user,
-  accounts,
-  i18n,
-  popup,
-  apps,
-});
diff --git a/src/reducers.ts b/src/reducers.ts
new file mode 100644
index 0000000..63d1923
--- /dev/null
+++ b/src/reducers.ts
@@ -0,0 +1,50 @@
+import { combineReducers } from 'redux';
+
+import auth, { State as AuthState } from 'components/auth/reducer';
+import user, { User } from 'components/user/reducer';
+import accounts, { State as AccountsState } from 'components/accounts/reducer';
+import i18n, { State as I18nState } from 'components/i18n/reducer';
+import popup, { State as PopupState } from 'components/ui/popup/reducer';
+import bsod from 'components/ui/bsod/reducer';
+import apps, { Apps } from 'components/dev/apps/reducer';
+import { ThunkDispatch, ThunkAction as ReduxThunkAction } from 'redux-thunk';
+import { Store as ReduxStore } from 'redux';
+
+export interface RootState {
+  auth: AuthState;
+  accounts: AccountsState;
+  user: User;
+  popup: PopupState;
+  apps: Apps;
+  i18n: I18nState;
+}
+
+export interface Action<T = any> {
+  type: string;
+  payload?: T;
+}
+export type Dispatch<T extends Action = Action> = ThunkDispatch<
+  RootState,
+  undefined,
+  T
+>;
+export type GetState = () => RootState;
+export type ThunkAction<T = any> = ReduxThunkAction<
+  T,
+  RootState,
+  undefined,
+  Action
+>;
+export type Store = ReduxStore<RootState> & {
+  dispatch: Dispatch;
+};
+
+export default combineReducers({
+  bsod,
+  auth,
+  user,
+  accounts,
+  i18n,
+  popup,
+  apps,
+});
diff --git a/src/services/api/accounts.js b/src/services/api/accounts.ts
similarity index 76%
rename from src/services/api/accounts.js
rename to src/services/api/accounts.ts
index 7ab57c3..21cb06b 100644
--- a/src/services/api/accounts.js
+++ b/src/services/api/accounts.ts
@@ -1,20 +1,19 @@
-// @flow
 import request from 'services/request';
 
-export type UserResponse = {
-  elyProfileLink: string,
-  email: string,
-  hasMojangUsernameCollision: boolean,
-  id: number,
-  isActive: boolean,
-  isOtpEnabled: boolean,
-  lang: string,
-  passwordChangedAt: number, // timestamp
-  registeredAt: number, // timestamp
-  shouldAcceptRules: boolean,
-  username: string,
-  uuid: string,
-};
+export interface UserResponse {
+  elyProfileLink: string;
+  email: string;
+  hasMojangUsernameCollision: boolean;
+  id: number;
+  isActive: boolean;
+  isOtpEnabled: boolean;
+  lang: string;
+  passwordChangedAt: number; // timestamp
+  registeredAt: number; // timestamp
+  shouldAcceptRules: boolean;
+  username: string;
+  uuid: string;
+}
 
 export function getInfo(id: number, token?: string): Promise<UserResponse> {
   return request.get(
@@ -34,10 +33,10 @@ export function changePassword(
     newRePassword = '',
     logoutAll = true,
   }: {
-    password?: string,
-    newPassword?: string,
-    newRePassword?: string,
-    logoutAll?: boolean,
+    password?: string;
+    newPassword?: string;
+    newRePassword?: string;
+    logoutAll?: boolean;
   },
 ): Promise<{ success: boolean }> {
   return request.post(`/api/v1/accounts/${id}/password`, {
@@ -54,8 +53,8 @@ export function acceptRules(id: number): Promise<{ success: boolean }> {
 
 export function changeUsername(
   id: number,
-  username: ?string,
-  password: ?string,
+  username: string | void,
+  password: string | void,
 ): Promise<{ success: boolean }> {
   return request.post(`/api/v1/accounts/${id}/username`, {
     username,
diff --git a/src/services/api/activate.test.js b/src/services/api/activate.test.ts
similarity index 95%
rename from src/services/api/activate.test.js
rename to src/services/api/activate.test.ts
index 44fc4e7..7e1d56e 100644
--- a/src/services/api/activate.test.js
+++ b/src/services/api/activate.test.ts
@@ -21,7 +21,7 @@ describe('signup api', () => {
     });
 
     afterEach(() => {
-      request.post.restore();
+      (request.post as any).restore();
     });
 
     it('should post to register api', () => {
@@ -55,7 +55,7 @@ describe('signup api', () => {
     });
 
     afterEach(() => {
-      request.post.restore();
+      (request.post as any).restore();
     });
 
     it('should post to confirmation api', () => {
diff --git a/src/services/api/authentication.test.js b/src/services/api/authentication.test.ts
similarity index 86%
rename from src/services/api/authentication.test.js
rename to src/services/api/authentication.test.ts
index a4bdaa5..285a1fa 100644
--- a/src/services/api/authentication.test.js
+++ b/src/services/api/authentication.test.ts
@@ -1,4 +1,4 @@
-/* eslint-disable camelcase */
+/* eslint-disable @typescript-eslint/camelcase */
 import expect from 'test/unexpected';
 import sinon from 'sinon';
 
@@ -39,11 +39,11 @@ describe('authentication api', () => {
     beforeEach(() => {
       sinon.stub(request, 'post').named('request.post');
 
-      request.post.returns(Promise.resolve());
+      (request.post as any).returns(Promise.resolve());
     });
 
     afterEach(() => {
-      request.post.restore();
+      (request.post as any).restore();
     });
 
     it('should post to login api', () => {
@@ -71,15 +71,19 @@ describe('authentication api', () => {
     const validToken = 'foo';
     const validRefreshToken = 'bar';
     const user = { id: 1 };
-    const validateTokenArgs = [user.id, validToken, validRefreshToken];
+    const validateTokenArgs: [number, string, string] = [
+      user.id,
+      validToken,
+      validRefreshToken,
+    ];
 
     beforeEach(() => {
       sinon.stub(accounts, 'getInfo');
-      accounts.getInfo.returns(Promise.resolve(user));
+      (accounts.getInfo as any).returns(Promise.resolve(user));
     });
 
     afterEach(() => {
-      accounts.getInfo.restore();
+      (accounts.getInfo as any).restore();
     });
 
     it('should request accounts.getInfo', () =>
@@ -106,7 +110,7 @@ describe('authentication api', () => {
 
     it('rejects if token has a bad type', () =>
       expect(
-        authentication.validateToken(user.id, {}),
+        authentication.validateToken(user.id, {} as any),
         'to be rejected with',
         'token must be a string',
       ));
@@ -119,7 +123,7 @@ describe('authentication api', () => {
 
     it('rejects if accounts.getInfo request is unexpectedly failed', () => {
       const error = 'Something wrong';
-      accounts.getInfo.returns(Promise.reject(error));
+      (accounts.getInfo as any).returns(Promise.reject(error));
 
       return expect(
         authentication.validateToken(...validateTokenArgs),
@@ -141,12 +145,14 @@ describe('authentication api', () => {
       beforeEach(() => {
         sinon.stub(authentication, 'requestToken');
 
-        accounts.getInfo.onCall(0).returns(Promise.reject(expiredResponse));
-        authentication.requestToken.returns(Promise.resolve(newToken));
+        (accounts.getInfo as any)
+          .onCall(0)
+          .returns(Promise.reject(expiredResponse));
+        (authentication.requestToken as any).returns(Promise.resolve(newToken));
       });
 
       afterEach(() => {
-        authentication.requestToken.restore();
+        (authentication.requestToken as any).restore();
       });
 
       it('resolves with new token and user object', async () => {
@@ -193,7 +199,9 @@ describe('authentication api', () => {
       const newToken = 'baz';
 
       beforeEach(() => {
-        accounts.getInfo.onCall(0).returns(Promise.reject(expiredResponse));
+        (accounts.getInfo as any)
+          .onCall(0)
+          .returns(Promise.reject(expiredResponse));
       });
 
       it('resolves with new token and user object', async () => {
@@ -236,7 +244,7 @@ describe('authentication api', () => {
     });
 
     afterEach(() => {
-      request.post.restore();
+      (request.post as any).restore();
     });
 
     it('should request logout api', () => {
@@ -250,7 +258,7 @@ describe('authentication api', () => {
     });
 
     it('returns a promise', () => {
-      request.post.returns(Promise.resolve());
+      (request.post as any).returns(Promise.resolve());
 
       return expect(authentication.logout(), 'to be fulfilled');
     });
@@ -276,11 +284,11 @@ describe('authentication api', () => {
     });
 
     afterEach(() => {
-      request.post.restore();
+      (request.post as any).restore();
     });
 
     it('should request refresh-token api', () => {
-      request.post.returns(Promise.resolve({}));
+      (request.post as any).returns(Promise.resolve({}));
 
       authentication.requestToken(refreshToken);
 
@@ -294,7 +302,7 @@ describe('authentication api', () => {
     });
 
     it('should disable bearer auth for request', () => {
-      request.post.returns(Promise.resolve({}));
+      (request.post as any).returns(Promise.resolve({}));
 
       authentication.requestToken(refreshToken);
 
@@ -310,7 +318,7 @@ describe('authentication api', () => {
     it('should resolve with token', () => {
       const token = 'token';
 
-      request.post.returns(
+      (request.post as any).returns(
         Promise.resolve({
           access_token: token, // eslint-disable-line
         }),
diff --git a/src/services/api/authentication.js b/src/services/api/authentication.ts
similarity index 86%
rename from src/services/api/authentication.js
rename to src/services/api/authentication.ts
index f9dfe6b..e9d9f76 100644
--- a/src/services/api/authentication.js
+++ b/src/services/api/authentication.ts
@@ -1,5 +1,4 @@
-// @flow
-import type { UserResponse } from 'services/api/accounts';
+import { UserResponse } from 'services/api/accounts';
 import logger from 'services/logger';
 import request, { InternalServerError } from 'services/request';
 import { getInfo as getInfoEndpoint } from 'services/api/accounts';
@@ -17,10 +16,10 @@ export function login({
   totp,
   rememberMe = false,
 }: {
-  login: string,
-  password?: string,
-  totp?: string,
-  rememberMe: boolean,
+  login: string;
+  password?: string;
+  totp?: string;
+  rememberMe: boolean;
 }): Promise<OAuthResponse> {
   return request.post(
     '/api/authentication/login',
@@ -54,15 +53,15 @@ export function forgotPassword(
   login: string,
   captcha: string,
 ): Promise<{
-  success: boolean,
+  success: boolean;
   data: {
-    canRepeatIn: number,
-    emailMask: ?string,
-    repeatFrequency: number,
-  },
+    canRepeatIn: number;
+    emailMask: string | void;
+    repeatFrequency: number;
+  };
   errors: {
-    [key: string]: string,
-  },
+    [key: string]: string;
+  };
 }> {
   return request.post(
     '/api/authentication/forgot-password',
@@ -105,16 +104,18 @@ export function recoverPassword(
 export async function validateToken(
   id: number,
   token: string,
-  refreshToken: ?string,
+  refreshToken: string | void | null,
 ): Promise<{
-  token: string,
-  refreshToken: ?string,
-  user: UserResponse,
+  token: string;
+  refreshToken: string | null;
+  user: UserResponse;
 }> {
   if (typeof token !== 'string') {
     throw new Error('token must be a string');
   }
 
+  refreshToken = refreshToken || null;
+
   let user: UserResponse;
   try {
     user = await getInfoEndpoint(id, token);
@@ -138,7 +139,7 @@ const recoverableErrors = [
 
 function handleTokenError(
   resp: Error | { message: string },
-  refreshToken: ?string,
+  refreshToken: string | null,
 ): Promise<string> {
   if (resp instanceof InternalServerError) {
     // delegate error recovering to the bsod middleware
@@ -168,7 +169,8 @@ export async function requestToken(refreshToken: string): Promise<string> {
     const response: OAuthResponse = await request.post(
       '/api/authentication/refresh-token',
       {
-        refresh_token: refreshToken, // eslint-disable-line camelcase
+        // eslint-disable-next-line @typescript-eslint/camelcase
+        refresh_token: refreshToken,
       },
       {
         token: null,
diff --git a/src/services/api/feedback.js b/src/services/api/feedback.ts
similarity index 100%
rename from src/services/api/feedback.js
rename to src/services/api/feedback.ts
diff --git a/src/services/api/mfa.js b/src/services/api/mfa.ts
similarity index 70%
rename from src/services/api/mfa.js
rename to src/services/api/mfa.ts
index 0aef4f1..41aeefb 100644
--- a/src/services/api/mfa.js
+++ b/src/services/api/mfa.ts
@@ -1,15 +1,13 @@
-// @flow
-import type { Resp } from 'services/request';
-import request from 'services/request';
+import request, { Resp } from 'services/request';
 
 export function getSecret(
   id: number,
 ): Promise<
   Resp<{
-    qr: string,
-    secret: string,
-    uri: string,
-  }>,
+    qr: string;
+    secret: string;
+    uri: string;
+  }>
 > {
   return request.get(`/api/v1/accounts/${id}/two-factor-auth`);
 }
@@ -18,7 +16,7 @@ export function enable(
   id: number,
   totp: string,
   password?: string,
-): Promise<Resp<*>> {
+): Promise<Resp<any>> {
   return request.post(`/api/v1/accounts/${id}/two-factor-auth`, {
     totp,
     password,
@@ -29,7 +27,7 @@ export function disable(
   id: number,
   totp: string,
   password?: string,
-): Promise<Resp<*>> {
+): Promise<Resp<any>> {
   return request.delete(`/api/v1/accounts/${id}/two-factor-auth`, {
     totp,
     password,
diff --git a/src/services/api/oauth.js b/src/services/api/oauth.ts
similarity index 67%
rename from src/services/api/oauth.js
rename to src/services/api/oauth.ts
index 8dd55e3..2f92b25 100644
--- a/src/services/api/oauth.js
+++ b/src/services/api/oauth.ts
@@ -1,6 +1,5 @@
-// @flow
-/* eslint camelcase: off */
-import type { ApplicationType } from 'components/dev/apps';
+/* eslint-disable @typescript-eslint/camelcase */
+import { ApplicationType } from 'components/dev/apps';
 import request from 'services/request';
 
 export type Scope =
@@ -9,67 +8,67 @@ export type Scope =
   | 'account_info'
   | 'account_email';
 
-export type Client = {|
-  id: string,
-  name: string,
-  description: string,
-|};
+export type Client = {
+  id: string;
+  name: string;
+  description: string;
+};
 
 export type OauthAppResponse = {
-  clientId: string,
-  clientSecret: string,
-  type: ApplicationType,
-  name: string,
-  websiteUrl: string,
-  createdAt: number,
+  clientId: string;
+  clientSecret: string;
+  type: ApplicationType;
+  name: string;
+  websiteUrl: string;
+  createdAt: number;
   // fields for 'application' type
-  countUsers?: number,
-  description?: string,
-  redirectUri?: string,
+  countUsers?: number;
+  description?: string;
+  redirectUri?: string;
   // fields for 'minecraft-server' type
-  minecraftServerIp?: string,
+  minecraftServerIp?: string;
 };
 
 type OauthRequestData = {
-  client_id: string,
-  redirect_uri: string,
-  response_type: string,
-  description: string,
-  scope: Scope,
-  prompt: string,
-  login_hint?: string,
-  state?: string,
+  client_id: string;
+  redirect_uri: string;
+  response_type: string;
+  description: string;
+  scope: string;
+  prompt: string;
+  login_hint?: string;
+  state?: string;
 };
 
 export type OauthData = {
-  clientId: string,
-  redirectUrl: string,
-  responseType: string,
-  description: string,
-  scope: Scope,
-  prompt: 'none' | 'consent' | 'select_account',
-  loginHint?: string,
-  state?: string,
+  clientId: string;
+  redirectUrl: string;
+  responseType: string;
+  description: string;
+  scope: string;
+  prompt: string; // comma separated list of 'none' | 'consent' | 'select_account';
+  loginHint?: string;
+  state?: string;
 };
 
 type FormPayloads = {
-  name?: string,
-  description?: string,
-  websiteUrl?: string,
-  redirectUri?: string,
-  minecraftServerIp?: string,
+  name?: string;
+  description?: string;
+  websiteUrl?: string;
+  redirectUri?: string;
+  minecraftServerIp?: string;
 };
 
 const api = {
   validate(oauthData: OauthData) {
     return request
-      .get<{|
-        session: {|
-          scopes: Scope[],
-        |},
-        client: Client,
-        oAuth: {||},
-      |}>('/api/oauth2/v1/validate', getOAuthRequest(oauthData))
+      .get<{
+        session: {
+          scopes: Scope[];
+        };
+        client: Client;
+        oAuth: {};
+      }>('/api/oauth2/v1/validate', getOAuthRequest(oauthData))
       .catch(handleOauthParamsValidation);
   },
 
@@ -77,15 +76,15 @@ const api = {
     oauthData: OauthData,
     params: { accept?: boolean } = {},
   ): Promise<{
-    success: boolean,
-    redirectUri: string,
+    success: boolean;
+    redirectUri: string;
   }> {
     const query = request.buildQuery(getOAuthRequest(oauthData));
 
     return request
       .post<{
-        success: boolean,
-        redirectUri: string,
+        success: boolean;
+        redirectUri: string;
       }>(
         `/api/oauth2/v1/complete?${query}`,
         typeof params.accept === 'undefined' ? {} : { accept: params.accept },
@@ -101,13 +100,15 @@ const api = {
         }
 
         if (resp.status === 401 && resp.name === 'Unauthorized') {
-          const error: Object = new Error('Unauthorized');
+          const error: { [key: string]: any } = new Error('Unauthorized');
           error.unauthorized = true;
           throw error;
         }
 
         if (resp.statusCode === 401 && resp.error === 'accept_required') {
-          const error: Object = new Error('Permissions accept required');
+          const error: { [key: string]: any } = new Error(
+            'Permissions accept required',
+          );
           error.acceptRequired = true;
           throw error;
         }
@@ -117,14 +118,14 @@ const api = {
   },
 
   create(type: string, formParams: FormPayloads) {
-    return request.post<{ success: boolean, data: OauthAppResponse }>(
+    return request.post<{ success: boolean; data: OauthAppResponse }>(
       `/api/v1/oauth2/${type}`,
       formParams,
     );
   },
 
   update(clientId: string, formParams: FormPayloads) {
-    return request.put<{ success: boolean, data: OauthAppResponse }>(
+    return request.put<{ success: boolean; data: OauthAppResponse }>(
       `/api/v1/oauth2/${clientId}`,
       formParams,
     );
@@ -139,7 +140,7 @@ const api = {
   },
 
   reset(clientId: string, regenerateSecret: boolean = false) {
-    return request.post<{ success: boolean, data: OauthAppResponse }>(
+    return request.post<{ success: boolean; data: OauthAppResponse }>(
       `/api/v1/oauth2/${clientId}/reset${
         regenerateSecret ? '?regenerateSecret' : ''
       }`,
@@ -151,8 +152,8 @@ const api = {
   },
 };
 
-if (window.Cypress) {
-  window.oauthApi = api;
+if ('Cypress' in window) {
+  (window as any).oauthApi = api;
 }
 
 export default api;
@@ -181,7 +182,7 @@ function getOAuthRequest(oauthData: OauthData): OauthRequestData {
   };
 }
 
-function handleOauthParamsValidation(resp = {}) {
+function handleOauthParamsValidation(resp: { [key: string]: any } = {}) {
   if (resp.statusCode === 400 && resp.error === 'invalid_request') {
     resp.userMessage = `Invalid request (${resp.parameter} required).`;
   } else if (
diff --git a/src/services/api/options.js b/src/services/api/options.js
deleted file mode 100644
index 9df9edf..0000000
--- a/src/services/api/options.js
+++ /dev/null
@@ -1,18 +0,0 @@
-// @flow
-import request from 'services/request';
-
-let options;
-
-export default {
-  get(): Promise<{ reCaptchaPublicKey: string }> {
-    if (options) {
-      return Promise.resolve(options);
-    }
-
-    return request.get('/api/options', {}, { token: null }).then(resp => {
-      options = resp;
-
-      return resp;
-    });
-  },
-};
diff --git a/src/services/api/options.test.js b/src/services/api/options.test.ts
similarity index 96%
rename from src/services/api/options.test.js
rename to src/services/api/options.test.ts
index 0092217..b509c29 100644
--- a/src/services/api/options.test.js
+++ b/src/services/api/options.test.ts
@@ -14,7 +14,7 @@ describe('services/api/options', () => {
   });
 
   afterEach(() => {
-    request.get.restore();
+    (request.get as any).restore();
   });
 
   it('should request options without token', () =>
diff --git a/src/services/api/options.ts b/src/services/api/options.ts
new file mode 100644
index 0000000..4b64947
--- /dev/null
+++ b/src/services/api/options.ts
@@ -0,0 +1,23 @@
+import request, { Resp } from 'services/request';
+
+type Options = { reCaptchaPublicKey: string };
+
+let options: Resp<Options>;
+
+export default {
+  async get(): Promise<Resp<Options>> {
+    if (options) {
+      return Promise.resolve(options);
+    }
+
+    const resp = await request.get<Options>(
+      '/api/options',
+      {},
+      { token: null },
+    );
+
+    options = resp;
+
+    return resp;
+  },
+};
diff --git a/src/services/api/signup.js b/src/services/api/signup.ts
similarity index 76%
rename from src/services/api/signup.js
rename to src/services/api/signup.ts
index 873c2ca..6aa0697 100644
--- a/src/services/api/signup.js
+++ b/src/services/api/signup.ts
@@ -1,5 +1,7 @@
 import request from 'services/request';
 
+import { OAuthResponse } from './authentication';
+
 export default {
   register({
     email = '',
@@ -18,7 +20,11 @@ export default {
   },
 
   activate({ key = '' }) {
-    return request.post('/api/signup/confirm', { key }, { token: null });
+    return request.post<OAuthResponse>(
+      '/api/signup/confirm',
+      { key },
+      { token: null },
+    );
   },
 
   resendActivation({ email = '', captcha }) {
diff --git a/src/services/authFlow/AbstractState.js b/src/services/authFlow/AbstractState.js
deleted file mode 100644
index c78fd90..0000000
--- a/src/services/authFlow/AbstractState.js
+++ /dev/null
@@ -1,13 +0,0 @@
-// @flow
-/* eslint no-unused-vars: off */
-import type { AuthContext } from 'services/authFlow';
-
-export default class AbstractState {
-  resolve(context: AuthContext, payload: Object): * {}
-  goBack(context: AuthContext): * {
-    throw new Error('There is no way back');
-  }
-  reject(context: AuthContext, payload: Object): * {}
-  enter(context: AuthContext): * {}
-  leave(context: AuthContext): * {}
-}
diff --git a/src/services/authFlow/AbstractState.ts b/src/services/authFlow/AbstractState.ts
new file mode 100644
index 0000000..ead34ce
--- /dev/null
+++ b/src/services/authFlow/AbstractState.ts
@@ -0,0 +1,12 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { AuthContext } from 'services/authFlow';
+
+export default class AbstractState {
+  resolve(context: AuthContext, payload: { [key: string]: any }): any {}
+  goBack(context: AuthContext): any {
+    throw new Error('There is no way back');
+  }
+  reject(context: AuthContext, payload: { [key: string]: any }): any {}
+  enter(context: AuthContext): any {}
+  leave(context: AuthContext): any {}
+}
diff --git a/src/services/authFlow/AcceptRulesState.test.js b/src/services/authFlow/AcceptRulesState.test.ts
similarity index 100%
rename from src/services/authFlow/AcceptRulesState.test.js
rename to src/services/authFlow/AcceptRulesState.test.ts
diff --git a/src/services/authFlow/AcceptRulesState.js b/src/services/authFlow/AcceptRulesState.ts
similarity index 100%
rename from src/services/authFlow/AcceptRulesState.js
rename to src/services/authFlow/AcceptRulesState.ts
diff --git a/src/services/authFlow/ActivationState.test.js b/src/services/authFlow/ActivationState.test.ts
similarity index 100%
rename from src/services/authFlow/ActivationState.test.js
rename to src/services/authFlow/ActivationState.test.ts
diff --git a/src/services/authFlow/ActivationState.js b/src/services/authFlow/ActivationState.ts
similarity index 86%
rename from src/services/authFlow/ActivationState.js
rename to src/services/authFlow/ActivationState.ts
index dcdf50a..38fc953 100644
--- a/src/services/authFlow/ActivationState.js
+++ b/src/services/authFlow/ActivationState.ts
@@ -1,10 +1,9 @@
-// @flow
 import logger from 'services/logger';
+import { AuthContext } from 'services/authFlow';
 
 import AbstractState from './AbstractState';
 import CompleteState from './CompleteState';
 import ResendActivationState from './ResendActivationState';
-import type { AuthContext } from 'services/authFlow';
 
 export default class ActivationState extends AbstractState {
   enter(context: AuthContext) {
@@ -14,7 +13,7 @@ export default class ActivationState extends AbstractState {
     context.navigate(url);
   }
 
-  resolve(context: AuthContext, payload: Object) {
+  resolve(context: AuthContext, payload: { [key: string]: any }) {
     context
       .run('activate', payload)
       .then(() => context.setState(new CompleteState()))
diff --git a/src/services/authFlow/AuthFlow.functional.test.js b/src/services/authFlow/AuthFlow.functional.test.ts
similarity index 97%
rename from src/services/authFlow/AuthFlow.functional.test.js
rename to src/services/authFlow/AuthFlow.functional.test.ts
index 0aebe2a..412b018 100644
--- a/src/services/authFlow/AuthFlow.functional.test.js
+++ b/src/services/authFlow/AuthFlow.functional.test.ts
@@ -33,10 +33,12 @@ describe('AuthFlow.functional', () => {
     flow = new AuthFlow(actions);
     flow.setStore(store);
 
+    let lastUrl: string;
+
     navigate = function navigate(path, extra = {}) {
       // emulates router behaviour
-      if (navigate.lastUrl !== path) {
-        navigate.lastUrl = path;
+      if (lastUrl !== path) {
+        lastUrl = path;
         flow.handleRequest(
           { path, query: new URLSearchParams(), params: {}, ...extra },
           navigate,
diff --git a/src/services/authFlow/AuthFlow.test.js b/src/services/authFlow/AuthFlow.test.ts
similarity index 99%
rename from src/services/authFlow/AuthFlow.test.js
rename to src/services/authFlow/AuthFlow.test.ts
index 1ed43b4..d3c0d68 100644
--- a/src/services/authFlow/AuthFlow.test.js
+++ b/src/services/authFlow/AuthFlow.test.ts
@@ -30,6 +30,7 @@ describe('AuthFlow', () => {
 
   it('throws when no actions provided', () => {
     expect(
+      // @ts-ignore
       () => new AuthFlow(),
       'to throw',
       'AuthFlow requires an actions object',
diff --git a/src/services/authFlow/AuthFlow.js b/src/services/authFlow/AuthFlow.ts
similarity index 83%
rename from src/services/authFlow/AuthFlow.js
rename to src/services/authFlow/AuthFlow.ts
index 73fb508..1a9f43a 100644
--- a/src/services/authFlow/AuthFlow.js
+++ b/src/services/authFlow/AuthFlow.ts
@@ -1,8 +1,7 @@
-// @flow
 import { browserHistory } from 'services/history';
-
 import logger from 'services/logger';
 import localStorage from 'services/localStorage';
+import { RootState } from 'reducers';
 
 import RegisterState from './RegisterState';
 import LoginState from './LoginState';
@@ -13,12 +12,12 @@ import ActivationState from './ActivationState';
 import CompleteState from './CompleteState';
 import ChooseAccountState from './ChooseAccountState';
 import ResendActivationState from './ResendActivationState';
-import type AbstractState from './AbstractState';
+import AbstractState from './AbstractState';
 
 type Request = {
-  path: string,
-  query: URLSearchParams,
-  params: Object,
+  path: string;
+  query: URLSearchParams;
+  params: { [key: string]: any };
 };
 
 // TODO: temporary added to improve typing without major refactoring
@@ -54,30 +53,34 @@ type ActionId =
   | 'setLoadingState';
 
 export interface AuthContext {
-  run(actionId: ActionId, payload?: mixed): *;
-  setState(newState: AbstractState): Promise<*> | void;
-  getState(): Object;
-  navigate(route: string): void;
+  run(actionId: ActionId, payload?: any): Promise<any>;
+  setState(newState: AbstractState): Promise<void> | void;
+  getState(): RootState;
+  navigate(route: string, options?: { replace?: boolean }): void;
   getRequest(): Request;
   prevState: AbstractState;
 }
 
+export type ActionsDict = {
+  [key: string]: (action: any) => { [key: string]: any };
+};
+
 export default class AuthFlow implements AuthContext {
-  actions: { [key: string]: (mixed) => Object };
+  actions: ActionsDict;
   state: AbstractState;
   prevState: AbstractState;
   /**
    * A callback from router, that allows to replace (perform redirect) route
    * during route transition
    */
-  replace: ?(string) => void;
-  onReady: Function;
-  navigate: Function;
+  replace: ((path: string) => void) | null;
+  onReady: () => void;
+  navigate: (route: string, options: { replace?: boolean }) => void;
   currentRequest: Request;
-  dispatch: (action: Object) => void;
-  getState: () => Object;
+  dispatch: (action: { [key: string]: any }) => void;
+  getState: () => RootState;
 
-  constructor(actions: { [key: string]: Function }) {
+  constructor(actions: ActionsDict) {
     if (typeof actions !== 'object') {
       throw new Error('AuthFlow requires an actions object');
     }
@@ -89,7 +92,12 @@ export default class AuthFlow implements AuthContext {
     }
   }
 
-  setStore(store: *) {
+  setStore(store: {
+    getState: () => { [key: string]: any };
+    dispatch: (
+      action: { [key: string]: any } | ((...args: any[]) => any),
+    ) => void;
+  }) {
     /**
      * @param {string} route
      * @param {object} options
@@ -126,11 +134,11 @@ export default class AuthFlow implements AuthContext {
     this.dispatch = store.dispatch.bind(store);
   }
 
-  resolve(payload: Object = {}) {
+  resolve(payload: { [key: string]: any } = {}) {
     this.state.resolve(this, payload);
   }
 
-  reject(payload: Object = {}) {
+  reject(payload: { [key: string]: any } = {}) {
     this.state.reject(this, payload);
   }
 
@@ -138,7 +146,7 @@ export default class AuthFlow implements AuthContext {
     this.state.goBack(this);
   }
 
-  run(actionId: ActionId, payload?: mixed): Promise<any> {
+  run(actionId: ActionId, payload?: { [key: string]: any }): Promise<any> {
     const action = this.actions[actionId];
 
     if (!action) {
@@ -195,14 +203,13 @@ export default class AuthFlow implements AuthContext {
    * @param {object} request.params
    * @param {URLSearchParams} request.query
    * @param {Function} replace
-   * @param callback
-   * @param {Function} [callback = function() {}] - an optional callback function to be called, when state will be stabilized
+   * @param {Function} [callback=function() {}] - an optional callback function to be called, when state will be stabilized
    * (state's enter function's promise resolved)
    */
   handleRequest(
     request: Request,
-    replace: Function,
-    callback: Function = function() {},
+    replace: (path: string) => void,
+    callback: () => void = () => {},
   ) {
     const { path } = request;
     this.replace = replace;
diff --git a/src/services/authFlow/ChooseAccountState.test.js b/src/services/authFlow/ChooseAccountState.test.ts
similarity index 100%
rename from src/services/authFlow/ChooseAccountState.test.js
rename to src/services/authFlow/ChooseAccountState.test.ts
diff --git a/src/services/authFlow/ChooseAccountState.js b/src/services/authFlow/ChooseAccountState.ts
similarity index 100%
rename from src/services/authFlow/ChooseAccountState.js
rename to src/services/authFlow/ChooseAccountState.ts
diff --git a/src/services/authFlow/CompleteState.test.js b/src/services/authFlow/CompleteState.test.ts
similarity index 100%
rename from src/services/authFlow/CompleteState.test.js
rename to src/services/authFlow/CompleteState.test.ts
diff --git a/src/services/authFlow/CompleteState.js b/src/services/authFlow/CompleteState.ts
similarity index 79%
rename from src/services/authFlow/CompleteState.js
rename to src/services/authFlow/CompleteState.ts
index 4df3b26..488ce4c 100644
--- a/src/services/authFlow/CompleteState.js
+++ b/src/services/authFlow/CompleteState.ts
@@ -1,4 +1,3 @@
-// @flow
 import { getActiveAccount } from 'components/accounts/reducer';
 import AbstractState from './AbstractState';
 import LoginState from './LoginState';
@@ -7,7 +6,7 @@ import ChooseAccountState from './ChooseAccountState';
 import ActivationState from './ActivationState';
 import AcceptRulesState from './AcceptRulesState';
 import FinishState from './FinishState';
-import type { AuthContext } from './AuthFlow';
+import { AuthContext } from './AuthFlow';
 
 const PROMPT_ACCOUNT_CHOOSE = 'select_account';
 const PROMPT_PERMISSIONS = 'consent';
@@ -17,7 +16,7 @@ export default class CompleteState extends AbstractState {
 
   constructor(
     options: {
-      accept?: boolean,
+      accept?: boolean;
     } = {},
   ) {
     super();
@@ -26,7 +25,10 @@ export default class CompleteState extends AbstractState {
   }
 
   enter(context: AuthContext) {
-    const { auth = {}, user } = context.getState();
+    const {
+      auth: { oauth },
+      user,
+    } = context.getState();
 
     if (user.isGuest) {
       context.setState(new LoginState());
@@ -34,7 +36,7 @@ export default class CompleteState extends AbstractState {
       context.setState(new ActivationState());
     } else if (user.shouldAcceptRules) {
       context.setState(new AcceptRulesState());
-    } else if (auth.oauth && auth.oauth.clientId) {
+    } else if (oauth && oauth.clientId) {
       return this.processOAuth(context);
     } else {
       context.navigate('/');
@@ -42,18 +44,24 @@ export default class CompleteState extends AbstractState {
   }
 
   processOAuth(context: AuthContext) {
-    const { auth = {}, accounts } = context.getState();
+    const { auth, accounts } = context.getState();
 
     let { isSwitcherEnabled } = auth;
-    const { loginHint } = auth.oauth;
+    const { oauth } = auth;
+
+    if (!oauth) {
+      throw new Error('Empty oauth state');
+    }
+
+    const { loginHint } = oauth;
 
     if (loginHint) {
-      const account = accounts.available.filter(
-        account =>
-          account.id === loginHint * 1 ||
-          account.email === loginHint ||
-          account.username === loginHint,
-      )[0];
+      const account = accounts.available.find(
+        item =>
+          item.id === Number(loginHint) ||
+          item.email === loginHint ||
+          item.username === loginHint,
+      );
       const activeAccount = getActiveAccount(context.getState());
 
       if (account) {
@@ -73,19 +81,19 @@ export default class CompleteState extends AbstractState {
     if (
       isSwitcherEnabled &&
       (accounts.available.length > 1 ||
-        auth.oauth.prompt.includes(PROMPT_ACCOUNT_CHOOSE))
+        oauth.prompt.includes(PROMPT_ACCOUNT_CHOOSE))
     ) {
       context.setState(new ChooseAccountState());
-    } else if (auth.oauth.code) {
+    } else if (oauth.code) {
       context.setState(new FinishState());
     } else {
-      const data = {};
+      const data: { [key: string]: any } = {};
 
       if (typeof this.isPermissionsAccepted !== 'undefined') {
         data.accept = this.isPermissionsAccepted;
       } else if (
-        auth.oauth.acceptRequired ||
-        auth.oauth.prompt.includes(PROMPT_PERMISSIONS)
+        oauth.acceptRequired ||
+        oauth.prompt.includes(PROMPT_PERMISSIONS)
       ) {
         context.setState(new PermissionsState());
 
diff --git a/src/services/authFlow/FinishState.test.js b/src/services/authFlow/FinishState.test.ts
similarity index 100%
rename from src/services/authFlow/FinishState.test.js
rename to src/services/authFlow/FinishState.test.ts
diff --git a/src/services/authFlow/FinishState.js b/src/services/authFlow/FinishState.ts
similarity index 100%
rename from src/services/authFlow/FinishState.js
rename to src/services/authFlow/FinishState.ts
diff --git a/src/services/authFlow/ForgotPasswordState.test.js b/src/services/authFlow/ForgotPasswordState.test.ts
similarity index 100%
rename from src/services/authFlow/ForgotPasswordState.test.js
rename to src/services/authFlow/ForgotPasswordState.test.ts
diff --git a/src/services/authFlow/ForgotPasswordState.js b/src/services/authFlow/ForgotPasswordState.ts
similarity index 90%
rename from src/services/authFlow/ForgotPasswordState.js
rename to src/services/authFlow/ForgotPasswordState.ts
index 099d31e..fe2c8cb 100644
--- a/src/services/authFlow/ForgotPasswordState.js
+++ b/src/services/authFlow/ForgotPasswordState.ts
@@ -9,7 +9,12 @@ export default class ForgotPasswordState extends AbstractState {
     context.navigate('/forgot-password');
   }
 
-  resolve(context, payload = {}) {
+  resolve(
+    context,
+    payload: {
+      login?: string;
+    } = {},
+  ) {
     context
       .run('forgotPassword', payload)
       .then(() => {
diff --git a/src/services/authFlow/LoginState.test.js b/src/services/authFlow/LoginState.test.ts
similarity index 100%
rename from src/services/authFlow/LoginState.test.js
rename to src/services/authFlow/LoginState.test.ts
diff --git a/src/services/authFlow/LoginState.js b/src/services/authFlow/LoginState.ts
similarity index 94%
rename from src/services/authFlow/LoginState.js
rename to src/services/authFlow/LoginState.ts
index 8faae04..13f1494 100644
--- a/src/services/authFlow/LoginState.js
+++ b/src/services/authFlow/LoginState.ts
@@ -1,12 +1,10 @@
-// @flow
 import logger from 'services/logger';
 import { getLogin } from 'components/auth/reducer';
 
 import AbstractState from './AbstractState';
 import PasswordState from './PasswordState';
 import RegisterState from './RegisterState';
-
-import type { AuthContext } from './AuthFlow';
+import { AuthContext } from './AuthFlow';
 
 export default class LoginState extends AbstractState {
   enter(context: AuthContext) {
@@ -30,7 +28,7 @@ export default class LoginState extends AbstractState {
   resolve(
     context: AuthContext,
     payload: {
-      login: string,
+      login: string;
     },
   ) {
     context
diff --git a/src/services/authFlow/MfaState.test.js b/src/services/authFlow/MfaState.test.ts
similarity index 100%
rename from src/services/authFlow/MfaState.test.js
rename to src/services/authFlow/MfaState.test.ts
diff --git a/src/services/authFlow/MfaState.js b/src/services/authFlow/MfaState.ts
similarity index 94%
rename from src/services/authFlow/MfaState.js
rename to src/services/authFlow/MfaState.ts
index a1b17f5..0ba4fa6 100644
--- a/src/services/authFlow/MfaState.js
+++ b/src/services/authFlow/MfaState.ts
@@ -1,4 +1,3 @@
-// @flow
 import logger from 'services/logger';
 
 import { getCredentials } from 'components/auth/reducer';
@@ -6,8 +5,7 @@ import { getCredentials } from 'components/auth/reducer';
 import AbstractState from './AbstractState';
 import CompleteState from './CompleteState';
 import PasswordState from './PasswordState';
-
-import type { AuthContext } from './AuthFlow';
+import { AuthContext } from './AuthFlow';
 
 export default class MfaState extends AbstractState {
   enter(context: AuthContext) {
diff --git a/src/services/authFlow/OAuthState.test.js b/src/services/authFlow/OAuthState.test.ts
similarity index 98%
rename from src/services/authFlow/OAuthState.test.js
rename to src/services/authFlow/OAuthState.test.ts
index 795a8eb..4576dcf 100644
--- a/src/services/authFlow/OAuthState.test.js
+++ b/src/services/authFlow/OAuthState.test.ts
@@ -1,4 +1,4 @@
-/* eslint camelcase: off */
+/* eslint @typescript-eslint/camelcase: off */
 import sinon from 'sinon';
 
 import OAuthState from 'services/authFlow/OAuthState';
diff --git a/src/services/authFlow/OAuthState.js b/src/services/authFlow/OAuthState.ts
similarity index 100%
rename from src/services/authFlow/OAuthState.js
rename to src/services/authFlow/OAuthState.ts
diff --git a/src/services/authFlow/PasswordState.test.js b/src/services/authFlow/PasswordState.test.ts
similarity index 100%
rename from src/services/authFlow/PasswordState.test.js
rename to src/services/authFlow/PasswordState.test.ts
diff --git a/src/services/authFlow/PasswordState.js b/src/services/authFlow/PasswordState.ts
similarity index 95%
rename from src/services/authFlow/PasswordState.js
rename to src/services/authFlow/PasswordState.ts
index 15b3ade..7e57b2c 100644
--- a/src/services/authFlow/PasswordState.js
+++ b/src/services/authFlow/PasswordState.ts
@@ -1,4 +1,3 @@
-// @flow
 import logger from 'services/logger';
 import { getCredentials } from 'components/auth/reducer';
 import {
@@ -12,8 +11,7 @@ import CompleteState from './CompleteState';
 import ForgotPasswordState from './ForgotPasswordState';
 import LoginState from './LoginState';
 import MfaState from './MfaState';
-
-import type { AuthContext } from './AuthFlow';
+import { AuthContext } from './AuthFlow';
 
 export default class PasswordState extends AbstractState {
   enter(context: AuthContext) {
@@ -32,8 +30,8 @@ export default class PasswordState extends AbstractState {
       password,
       rememberMe,
     }: {
-      password: string,
-      rememberMe: boolean,
+      password: string;
+      rememberMe: boolean;
     },
   ) {
     const { login, returnUrl } = getCredentials(context.getState());
diff --git a/src/services/authFlow/PermissionsState.test.js b/src/services/authFlow/PermissionsState.test.ts
similarity index 100%
rename from src/services/authFlow/PermissionsState.test.js
rename to src/services/authFlow/PermissionsState.test.ts
diff --git a/src/services/authFlow/PermissionsState.js b/src/services/authFlow/PermissionsState.ts
similarity index 100%
rename from src/services/authFlow/PermissionsState.js
rename to src/services/authFlow/PermissionsState.ts
diff --git a/src/services/authFlow/RecoverPasswordState.test.js b/src/services/authFlow/RecoverPasswordState.test.ts
similarity index 100%
rename from src/services/authFlow/RecoverPasswordState.test.js
rename to src/services/authFlow/RecoverPasswordState.test.ts
diff --git a/src/services/authFlow/RecoverPasswordState.js b/src/services/authFlow/RecoverPasswordState.ts
similarity index 100%
rename from src/services/authFlow/RecoverPasswordState.js
rename to src/services/authFlow/RecoverPasswordState.ts
diff --git a/src/services/authFlow/RegisterState.test.js b/src/services/authFlow/RegisterState.test.ts
similarity index 100%
rename from src/services/authFlow/RegisterState.test.js
rename to src/services/authFlow/RegisterState.test.ts
diff --git a/src/services/authFlow/RegisterState.js b/src/services/authFlow/RegisterState.ts
similarity index 100%
rename from src/services/authFlow/RegisterState.js
rename to src/services/authFlow/RegisterState.ts
diff --git a/src/services/authFlow/ResendActivationState.test.js b/src/services/authFlow/ResendActivationState.test.ts
similarity index 100%
rename from src/services/authFlow/ResendActivationState.test.js
rename to src/services/authFlow/ResendActivationState.test.ts
diff --git a/src/services/authFlow/ResendActivationState.js b/src/services/authFlow/ResendActivationState.ts
similarity index 87%
rename from src/services/authFlow/ResendActivationState.js
rename to src/services/authFlow/ResendActivationState.ts
index 5549598..296d4ad 100644
--- a/src/services/authFlow/ResendActivationState.js
+++ b/src/services/authFlow/ResendActivationState.ts
@@ -1,5 +1,4 @@
-// @flow
-import type { AuthContext } from 'services/authFlow';
+import { AuthContext } from 'services/authFlow';
 import logger from 'services/logger';
 
 import AbstractState from './AbstractState';
@@ -11,7 +10,7 @@ export default class ResendActivationState extends AbstractState {
     context.navigate('/resend-activation');
   }
 
-  resolve(context: AuthContext, payload: Object) {
+  resolve(context: AuthContext, payload: { [key: string]: any }) {
     context
       .run('resendActivation', payload)
       .then(() => context.setState(new ActivationState()))
diff --git a/src/services/authFlow/helpers.js b/src/services/authFlow/helpers.ts
similarity index 90%
rename from src/services/authFlow/helpers.js
rename to src/services/authFlow/helpers.ts
index 1246f08..2c5f987 100644
--- a/src/services/authFlow/helpers.js
+++ b/src/services/authFlow/helpers.ts
@@ -28,7 +28,11 @@ export function expectState(mock, state) {
     .withExactArgs(sinon.match.instanceOf(state));
 }
 
-export function expectNavigate(mock, route, options) {
+export function expectNavigate(
+  mock,
+  route,
+  options: { [key: string]: any } | void,
+) {
   if (options) {
     return mock
       .expects('navigate')
diff --git a/src/services/authFlow/index.js b/src/services/authFlow/index.ts
similarity index 88%
rename from src/services/authFlow/index.js
rename to src/services/authFlow/index.ts
index e795776..c708b2c 100644
--- a/src/services/authFlow/index.js
+++ b/src/services/authFlow/index.ts
@@ -1,6 +1,4 @@
-// @flow
-import AuthFlow from './AuthFlow';
-export type { AuthContext } from './AuthFlow';
+import AuthFlow, { ActionsDict } from './AuthFlow';
 
 import * as actions from 'components/auth/actions';
 
@@ -36,4 +34,5 @@ const availableActions = {
   setLoadingState: actions.setLoadingState,
 };
 
-export default new AuthFlow(availableActions);
+export { AuthContext } from './AuthFlow';
+export default new AuthFlow(availableActions as ActionsDict);
diff --git a/src/services/captcha.js b/src/services/captcha.ts
similarity index 84%
rename from src/services/captcha.js
rename to src/services/captcha.ts
index e768694..5f8e1d8 100644
--- a/src/services/captcha.js
+++ b/src/services/captcha.ts
@@ -1,12 +1,11 @@
-// @flow
 import { loadScript } from 'functions';
 import options from 'services/api/options';
 
-let readyPromise;
+let readyPromise: Promise<void>;
 let lang = 'en';
 let sitekey;
 
-export opaque type CaptchaID = string;
+export type CaptchaID = string;
 
 export default {
   /**
@@ -23,12 +22,12 @@ export default {
       skin: theme,
       onSetCode: callback,
     }: {
-      skin: 'dark' | 'light',
-      onSetCode: string => void,
+      skin: 'dark' | 'light';
+      onSetCode: (code: string) => void;
     },
   ): Promise<CaptchaID> {
     return this.loadApi().then(() =>
-      window.grecaptcha.render(el, {
+      (window as any).grecaptcha.render(el, {
         sitekey,
         theme,
         callback,
@@ -40,7 +39,7 @@ export default {
    * @param {string} captchaId - captcha id, returned from render promise
    */
   reset(captchaId: CaptchaID) {
-    this.loadApi().then(() => window.grecaptcha.reset(captchaId));
+    this.loadApi().then(() => (window as any).grecaptcha.reset(captchaId));
   },
 
   /**
@@ -70,7 +69,7 @@ export default {
     if (!readyPromise) {
       readyPromise = Promise.all([
         new Promise(resolve => {
-          window.onReCaptchaReady = resolve;
+          (window as any).onReCaptchaReady = resolve;
         }),
         options.get().then(resp => this.setApiKey(resp.reCaptchaPublicKey)),
       ]).then(() => {});
diff --git a/src/services/copy.js b/src/services/copy.ts
similarity index 78%
rename from src/services/copy.js
rename to src/services/copy.ts
index 3328bdd..8209691 100644
--- a/src/services/copy.js
+++ b/src/services/copy.ts
@@ -1,4 +1,3 @@
-// @flow
 import copyToClipboard from 'copy-to-clipboard';
 
 /**
@@ -9,10 +8,9 @@ import copyToClipboard from 'copy-to-clipboard';
  * @returns {Promise<*>}
  */
 export default async function copy(content: string): Promise<void> {
-  // $FlowFixMe there is no typing for navigator.clipboard
   if (navigator.clipboard) {
     return navigator.clipboard.writeText(content);
   }
 
-  return copyToClipboard(content);
+  copyToClipboard(content);
 }
diff --git a/src/services/errorsDict/errorsDict.js b/src/services/errorsDict/errorsDict.js
index 93e0c83..9b0de6d 100644
--- a/src/services/errorsDict/errorsDict.js
+++ b/src/services/errorsDict/errorsDict.js
@@ -96,7 +96,7 @@ const errorsMap = {
       {...messages.emailFrequency}
       values={{
         // for msLeft @see AuthError.jsx
-        time: <RelativeTime value={props.msLeft} />,
+        time: <RelativeTime timestamp={props.msLeft} />,
       }}
     />
   ),
diff --git a/src/services/font.js b/src/services/font.ts
similarity index 69%
rename from src/services/font.js
rename to src/services/font.ts
index c663d13..7a1cf23 100644
--- a/src/services/font.js
+++ b/src/services/font.ts
@@ -5,12 +5,17 @@ export default {
   /**
    * @param {Array} families
    * @param {object} options
-   * @param {bool} [options.external=false] - whether the font should be loaded from external source (e.g. google)
+   * @param {boolean} [options.external=false] - whether the font should be loaded from external source (e.g. google)
    *
    * @returns {Promise}
    */
-  load(families = [], options = {}) {
-    let config = {
+  load(
+    families: string[] = [],
+    options: {
+      external?: boolean;
+    } = {},
+  ): Promise<void> {
+    let config: { [key: string]: any } = {
       custom: { families },
     };
 
diff --git a/src/services/history.js b/src/services/history.js
index 75cf917..cae2287 100644
--- a/src/services/history.js
+++ b/src/services/history.js
@@ -24,7 +24,7 @@ export default {
   },
 
   /**
-   * @returns {bool} - whether history.back() can be safetly called
+   * @returns {boolean} - whether history.back() can be safetly called
    */
   canGoBack() {
     return (
diff --git a/src/services/i18n/i18n.js b/src/services/i18n/i18n.ts
similarity index 77%
rename from src/services/i18n/i18n.js
rename to src/services/i18n/i18n.ts
index 1072b71..ae4c780 100644
--- a/src/services/i18n/i18n.js
+++ b/src/services/i18n/i18n.ts
@@ -1,8 +1,6 @@
-// @flow
-import type { IntlShape } from 'react-intl';
-import { createIntl, createIntlCache } from 'react-intl';
+import { IntlShape, createIntl, createIntlCache } from 'react-intl';
 import captcha from 'services/captcha';
-import locales from 'i18n/index.json';
+import locales from 'i18n';
 
 import intlPolyfill from './intlPolyfill';
 
@@ -10,7 +8,12 @@ const SUPPORTED_LANGUAGES = Object.keys(locales);
 const DEFAULT_LANGUAGE = 'en';
 
 function getBrowserPreferredLanguages(): string[] {
-  return [].concat(navigator.languages || []).concat(navigator.language || []);
+  return []
+    .concat(
+      // @ts-ignore
+      navigator.languages || [],
+    )
+    .concat(navigator.language || []);
 }
 
 function detectLanguage(
@@ -20,12 +23,7 @@ function detectLanguage(
 ): string {
   return (
     userLanguages
-      .map(lang =>
-        lang
-          .split('-')
-          .shift()
-          .toLowerCase(),
-      )
+      .map(lang => (lang.split('-').shift() || '').toLowerCase())
       .find(lang => availableLanguages.indexOf(lang) !== -1) || defaultLanguage
   );
 }
@@ -35,7 +33,7 @@ const cache = createIntlCache();
 let intl: IntlShape;
 
 class I18N {
-  detectLanguage(lang: string): string {
+  detectLanguage(lang: string = ''): string {
     return detectLanguage(
       [lang].concat(getBrowserPreferredLanguages()).filter(item => !!item),
       SUPPORTED_LANGUAGES,
@@ -80,8 +78,8 @@ class I18N {
   async require(
     locale: string,
   ): Promise<{
-    locale: string,
-    messages: { [string]: string },
+    locale: string;
+    messages: { [key: string]: string };
   }> {
     const [{ default: messages }] = await Promise.all([
       import(/* webpackChunkName: "locale-[request]" */ `i18n/${locale}.json`),
diff --git a/src/services/i18n/index.js b/src/services/i18n/index.ts
similarity index 79%
rename from src/services/i18n/index.js
rename to src/services/i18n/index.ts
index 7c364f9..25ec0f5 100644
--- a/src/services/i18n/index.js
+++ b/src/services/i18n/index.ts
@@ -1,2 +1 @@
-// @flow
 export { default } from './i18n';
diff --git a/src/services/i18n/intlPolyfill.js b/src/services/i18n/intlPolyfill.ts
similarity index 96%
rename from src/services/i18n/intlPolyfill.js
rename to src/services/i18n/intlPolyfill.ts
index a974b5e..a9e5d3f 100644
--- a/src/services/i18n/intlPolyfill.js
+++ b/src/services/i18n/intlPolyfill.ts
@@ -1,9 +1,9 @@
-// @flow
 import logger from 'services/logger';
 
 const needs = {
   intl: !window.Intl,
   plural: !window?.Intl?.PluralRules,
+  // @ts-ignore ts has a little bit outdated definitions
   relative: !window?.Intl?.RelativeTimeFormat,
 };
 
@@ -13,7 +13,7 @@ const needs = {
  */
 
 async function polyfill(locale: string): Promise<void> {
-  const promises = [];
+  const promises: Promise<void>[] = [];
 
   if (
     !needs.intl &&
diff --git a/src/services/loader.js b/src/services/loader.js
index 138a9a2..01b8bca 100644
--- a/src/services/loader.js
+++ b/src/services/loader.js
@@ -4,16 +4,26 @@ let stack = 1;
 export default {
   show() {
     if (++stack >= 0) {
-      document.getElementById('loader').classList.add('is-active');
+      const loader = document.getElementById('loader');
+
+      if (!loader) {
+        throw new Error('Can not find loader element');
+      }
+
+      loader.classList.add('is-active');
     }
   },
 
   hide() {
     if (--stack <= 0) {
       stack = 0;
-      document
-        .getElementById('loader')
-        .classList.remove('is-active', 'is-first-launch');
+      const loader = document.getElementById('loader');
+
+      if (!loader) {
+        throw new Error('Can not find loader element');
+      }
+
+      loader.classList.remove('is-active', 'is-first-launch');
     }
   },
 };
diff --git a/src/services/localStorage.js b/src/services/localStorage.js
index 1f2c898..61bc03f 100644
--- a/src/services/localStorage.js
+++ b/src/services/localStorage.js
@@ -17,20 +17,18 @@ export function hasStorage() {
   return _hasStorage;
 }
 
-function DummyStorage() {
-  return {
-    getItem(key) {
-      return this[key] || null;
-    },
+class DummyStorage {
+  getItem(key) {
+    return this[key] || null;
+  }
 
-    setItem(key, value) {
-      this[key] = value;
-    },
+  setItem(key, value) {
+    this[key] = value;
+  }
 
-    removeItem(key) {
-      Reflect.deleteProperty(this, key);
-    },
-  };
+  removeItem(key) {
+    Reflect.deleteProperty(this, key);
+  }
 }
 
 export const localStorage = _hasStorage
diff --git a/src/services/logger/abbreviate.js b/src/services/logger/abbreviate.js
index 0ac543d..98d38b7 100644
--- a/src/services/logger/abbreviate.js
+++ b/src/services/logger/abbreviate.js
@@ -6,10 +6,10 @@ const STRING_MAX_LENGTH = 128 * 1024;
  *
  * @param {any}    obj     Any data structure
  * @param {object} options
- * @param {Function} options.filter - callback that is called on every object's key with (key,value) and should return
+ * @param {Function=} options.filter - callback that is called on every object's key with (key,value) and should return
  *        value to use (may return undefined to remove unwanted keys). See nodeFilter and browserFilter.
- * @param {number} options.depth - maximum recursion depth. Elements deeper than that are stringified with util.inspect()
- * @param {number} options.maxSize - roughly maximum allowed size of data after JSON serialisation (but it's not guaranteed
+ * @param {number=} options.depth - maximum recursion depth. Elements deeper than that are stringified with util.inspect()
+ * @param {number=} options.maxSize - roughly maximum allowed size of data after JSON serialisation (but it's not guaranteed
  *        that it won't exceed the limit)
  *
  * @see https://github.com/ftlabs/js-abbreviate
diff --git a/src/services/logger/index.js b/src/services/logger/index.js
deleted file mode 100644
index 0e991df..0000000
--- a/src/services/logger/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import logger from './logger';
-
-export default logger;
diff --git a/src/services/logger/index.ts b/src/services/logger/index.ts
new file mode 100644
index 0000000..8a6f923
--- /dev/null
+++ b/src/services/logger/index.ts
@@ -0,0 +1 @@
+export { default } from './logger';
diff --git a/src/services/logger/logger.js b/src/services/logger/logger.ts
similarity index 87%
rename from src/services/logger/logger.js
rename to src/services/logger/logger.ts
index eb398af..e4a4301 100644
--- a/src/services/logger/logger.js
+++ b/src/services/logger/logger.ts
@@ -1,5 +1,3 @@
-// @flow
-import type { User } from 'components/user';
 import Raven from 'raven-js';
 
 import abbreviate from './abbreviate';
@@ -46,7 +44,11 @@ class Logger {
     }
   }
 
-  setUser(user: User) {
+  setUser(user: {
+    username: string | null;
+    email: string | null;
+    id: number | null;
+  }) {
     Raven.setUserContext({
       username: user.username,
       email: user.email,
@@ -54,22 +56,22 @@ class Logger {
     });
   }
 
-  unexpected(message: string | Error, previous: mixed) {
+  unexpected(message: string | Error, previous: any) {
     // TODO: check whether previous was already handled. Cover with tests
     this.error(message, {
       error: previous,
     });
   }
 
-  error(message: string | Error, context: Object) {
+  error(message: string | Error, context?: { [key: string]: any }) {
     log('error', message, context);
   }
 
-  info(message: string | Error, context: Object) {
+  info(message: string | Error, context?: { [key: string]: any }) {
     log('info', message, context);
   }
 
-  warn(message: string | Error, context: Object) {
+  warn(message: string | Error, context?: { [key: string]: any }) {
     log('warning', message, context);
   }
 
@@ -81,7 +83,7 @@ class Logger {
 function log(
   level: 'error' | 'warning' | 'info' | 'debug',
   message: string | Error,
-  context: Object,
+  context?: { [key: string]: any },
 ) {
   const method: 'error' | 'warn' | 'info' | 'debug' =
     level === 'warning' ? 'warn' : level;
@@ -115,7 +117,7 @@ function log(
  *
  * @returns {Promise}
  */
-function prepareContext(context: any) {
+function prepareContext(context: { [key: string]: any }) {
   if (context instanceof Response) {
     // TODO: rewrite abbreviate to use promises and recursively find Response
     return context
diff --git a/src/services/request/InternalServerError.js b/src/services/request/InternalServerError.js
deleted file mode 100644
index 245ba42..0000000
--- a/src/services/request/InternalServerError.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// @flow
-function InternalServerError(
-  error: Error | string | Object,
-  resp?: Response | Object,
-) {
-  error = error || {};
-
-  this.name = 'InternalServerError';
-  this.message = 'InternalServerError';
-  this.error = error;
-  this.stack = new Error().stack;
-
-  if (resp) {
-    this.originalResponse = resp;
-  }
-
-  if (error.message) {
-    this.message = error.message;
-  }
-
-  if (typeof error === 'string') {
-    this.message = error;
-  } else {
-    this.error = error;
-    Object.assign(this, error);
-  }
-}
-
-InternalServerError.prototype = Object.create(Error.prototype);
-InternalServerError.prototype.constructor = InternalServerError;
-
-export default InternalServerError;
diff --git a/src/services/request/InternalServerError.ts b/src/services/request/InternalServerError.ts
new file mode 100644
index 0000000..1591526
--- /dev/null
+++ b/src/services/request/InternalServerError.ts
@@ -0,0 +1,36 @@
+import { Resp } from './request';
+
+class InternalServerError extends Error {
+  error: Error | { [key: string]: any };
+  originalResponse: Resp<any>;
+
+  constructor(
+    error: Error | string | { [key: string]: any },
+    resp?: Response | { [key: string]: any },
+  ) {
+    super();
+
+    error = error || 'no error message';
+
+    this.name = this.constructor.name;
+    this.message = this.constructor.name;
+    this.stack = new Error().stack;
+
+    if (resp) {
+      this.originalResponse = resp;
+    }
+
+    if (typeof error === 'string') {
+      error = new Error(error);
+    }
+
+    if ('message' in error) {
+      this.message = error.message;
+    }
+
+    this.error = error;
+    Object.assign(this, error);
+  }
+}
+
+export default InternalServerError;
diff --git a/src/services/request/PromiseMiddlewareLayer.js b/src/services/request/PromiseMiddlewareLayer.js
deleted file mode 100644
index bfa0a55..0000000
--- a/src/services/request/PromiseMiddlewareLayer.js
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- * A class to handle middleware layer
- */
-export default class PromiseMiddlewareLayer {
-  /**
-   * @private
-   */
-  middlewares = [];
-
-  /**
-   * Adds middleware into layer.
-   *
-   * `middleware` is an object, that may have multiple keys of type function.
-   * Each key is a name of an action that may be passed through the layer. Each
-   * function should return a Promise. An action with name catch has a special
-   * meaning: it will be invoked as catch callback on Promise (for middlewares,
-   * that should handle errors)
-   *
-   * @param {object} middleware
-   */
-  add(middleware) {
-    if (typeof middleware !== 'object') {
-      throw new Error('A middleware must be an object');
-    }
-
-    if (!this.middlewares.some(mdware => mdware === middleware)) {
-      this.middlewares.push(middleware);
-    }
-  }
-
-  /**
-   * @param {string} action - the name of middleware's hook
-   * @param {object} data - the initial data to pass through middlewares chain
-   * @param {Function} restart - a function to restart current request (for `catch` hook)
-   *
-   * @returns {Promise}
-   */
-  run(action, data, restart) {
-    const promiseMethod = action === 'catch' ? 'catch' : 'then';
-
-    return this.middlewares
-      .filter(middleware => middleware[action])
-      .reduce(
-        (promise, middleware) =>
-          promise[promiseMethod](resp => middleware[action](resp, restart)),
-        Promise[action === 'catch' ? 'reject' : 'resolve'](data),
-      );
-  }
-}
diff --git a/src/services/request/PromiseMiddlewareLayer.test.js b/src/services/request/PromiseMiddlewareLayer.test.ts
similarity index 74%
rename from src/services/request/PromiseMiddlewareLayer.test.js
rename to src/services/request/PromiseMiddlewareLayer.test.ts
index f2535a4..d6d8377 100644
--- a/src/services/request/PromiseMiddlewareLayer.test.js
+++ b/src/services/request/PromiseMiddlewareLayer.test.ts
@@ -28,7 +28,7 @@ describe('PromiseMiddlewareLayer', () => {
 
   describe('#run()', () => {
     it('should return promise', () => {
-      const layer = new PromiseMiddlewareLayer();
+      const layer: any = new PromiseMiddlewareLayer();
 
       expect(layer.run('then'), 'to be a', Promise);
     });
@@ -39,7 +39,7 @@ describe('PromiseMiddlewareLayer', () => {
     function testAction(name) {
       describe(`run('${name}')`, () => {
         it('should run middleware', () => {
-          const layer = new PromiseMiddlewareLayer();
+          const layer: any = new PromiseMiddlewareLayer();
           const middleware = {
             [name]: sinon
               .spy(() => Promise.resolve())
@@ -54,7 +54,7 @@ describe('PromiseMiddlewareLayer', () => {
         });
 
         it('should pass data', () => {
-          const layer = new PromiseMiddlewareLayer();
+          const layer: any = new PromiseMiddlewareLayer();
           const middleware = {
             [name]: sinon
               .spy(() => Promise.resolve())
@@ -65,19 +65,18 @@ describe('PromiseMiddlewareLayer', () => {
           layer.add(middleware);
 
           return layer.run(name, data).then(() => {
-            expect(middleware[name], 'to have a call satisfying', [
-              data,
-              undefined,
-            ]);
+            expect(middleware[name], 'to have a call satisfying', [data]);
           });
         });
 
-        it('should call multiple middlewares', () => {
-          const layer = new PromiseMiddlewareLayer();
+        it('should call multiple middlewares', async () => {
+          const layer: any = new PromiseMiddlewareLayer();
+          const initialValue = 'initialValue';
+          const options = { foo: 'bar' };
           const firstMethod = name === 'catch' ? 'reject' : 'resolve';
           const middleware1 = {
             [name]: sinon
-              .spy(() => Promise[firstMethod]('new data'))
+              .spy(() => (Promise[firstMethod] as any)('new data'))
               .named(`middleware1.${name}`),
           };
           const middleware2 = {
@@ -89,20 +88,23 @@ describe('PromiseMiddlewareLayer', () => {
           layer.add(middleware1);
           layer.add(middleware2);
 
-          return layer.run(name).then(resp => {
-            expect(middleware1[name], 'was called');
-            expect(middleware2[name], 'to have a call satisfying', [
-              'new data',
-              undefined,
-            ]);
-            expect(resp, 'to equal', 'the last data');
-          });
+          const resp = await layer.run(name, initialValue, options);
+
+          expect(middleware1[name], 'to have a call satisfying', [
+            initialValue,
+            options,
+          ]);
+          expect(middleware2[name], 'to have a call satisfying', [
+            'new data',
+            options,
+          ]);
+          expect(resp, 'to equal', 'the last data');
         });
       });
     }
 
     it('should not call wrong actions', () => {
-      const layer = new PromiseMiddlewareLayer();
+      const layer: any = new PromiseMiddlewareLayer();
       const middleware = {
         then: () => {},
         wrongAction: sinon
@@ -110,7 +112,7 @@ describe('PromiseMiddlewareLayer', () => {
           .named('middleware.wrongAction'),
       };
 
-      layer.add(middleware);
+      layer.add(middleware as any);
 
       return layer.run('then').then(() => {
         expect(middleware.wrongAction, 'was not called');
@@ -118,7 +120,7 @@ describe('PromiseMiddlewareLayer', () => {
     });
 
     it('should not call next catch middleware if previous was resolved', () => {
-      const layer = new PromiseMiddlewareLayer();
+      const layer: any = new PromiseMiddlewareLayer();
       const middleware1 = {
         catch: () => Promise.resolve(),
       };
@@ -135,16 +137,17 @@ describe('PromiseMiddlewareLayer', () => {
     });
 
     it('should pass restart callback if any', () => {
-      const layer = new PromiseMiddlewareLayer();
+      const layer: any = new PromiseMiddlewareLayer();
       const middleware = {
         catch: sinon.spy(() => Promise.resolve()).named('middleware.catch'),
       };
-      const callback = () => {};
+      const callback = async () => {};
 
       layer.add(middleware);
 
-      return layer.run('catch', {}, callback).then(() => {
+      return layer.run('catch', {}, {}, callback).then(() => {
         expect(middleware.catch, 'to have a call satisfying', [
+          {},
           {},
           expect.it('to be', callback),
         ]);
diff --git a/src/services/request/PromiseMiddlewareLayer.ts b/src/services/request/PromiseMiddlewareLayer.ts
new file mode 100644
index 0000000..1ed2ce4
--- /dev/null
+++ b/src/services/request/PromiseMiddlewareLayer.ts
@@ -0,0 +1,98 @@
+import { Options } from './request';
+
+type Action = 'catch' | 'then' | 'before';
+
+interface MiddlewareRequestOptions {
+  url: string;
+  options: Options;
+}
+
+export interface Middleware {
+  before?: (
+    options: MiddlewareRequestOptions,
+  ) => Promise<MiddlewareRequestOptions>;
+  then?: (resp: any, options: MiddlewareRequestOptions) => Promise<any>;
+  catch?: (
+    resp: any,
+    options: MiddlewareRequestOptions,
+    restart: () => Promise<any>,
+  ) => Promise<any>;
+}
+
+/**
+ * A class to handle middleware layer
+ */
+class PromiseMiddlewareLayer {
+  private middlewares: Middleware[] = [];
+
+  /**
+   * Adds middleware into layer.
+   *
+   * `middleware` is an object, that may have multiple keys of type function.
+   * Each key is a name of an action that may be passed through the layer. Each
+   * function should return a Promise. An action with name catch has a special
+   * meaning: it will be invoked as catch callback on Promise (for middlewares,
+   * that should handle errors)
+   *
+   * @param {object} middleware
+   */
+  add(middleware: Middleware) {
+    if (typeof middleware !== 'object') {
+      throw new Error('A middleware must be an object');
+    }
+
+    if (!this.middlewares.some(mdware => mdware === middleware)) {
+      this.middlewares.push(middleware);
+    }
+  }
+
+  /**
+   * @param {string} action - the name of middleware's hook
+   * @param {object} data - the initial data to pass through middlewares chain
+   * @param {Function} restart - a function to restart current request (for `catch` hook)
+   *
+   * @returns {Promise}
+   */
+  run(
+    action: 'before',
+    options: MiddlewareRequestOptions,
+    arg3?: never,
+    arg4?: never,
+  ): Promise<MiddlewareRequestOptions>;
+  run(
+    action: 'then',
+    resp: any,
+    options: MiddlewareRequestOptions,
+    arg4?: never,
+  ): Promise<any>;
+  run(
+    action: 'catch',
+    resp: any,
+    options: MiddlewareRequestOptions,
+    restart: () => Promise<any>,
+  ): Promise<any>;
+  run(action: Action, data, ...rest) {
+    const promiseMethod = action === 'catch' ? 'catch' : 'then';
+
+    return this.middlewares
+      .filter(middleware => middleware[action])
+      .reduce(
+        (promise: Promise<any>, middleware) =>
+          invoke(
+            promise,
+            promiseMethod,
+          )(resp => invoke(middleware, action)(resp, ...rest)),
+        invoke(Promise, action === 'catch' ? 'reject' : 'resolve')(data),
+      );
+  }
+}
+
+function invoke(instance: { [key: string]: any }, method: string) {
+  if (typeof instance[method] !== 'function') {
+    throw new Error(`Can not invoke ${method} on ${instance}`);
+  }
+
+  return (...args) => instance[method](...args);
+}
+
+export default PromiseMiddlewareLayer;
diff --git a/src/services/request/RequestAbortedError.js b/src/services/request/RequestAbortedError.ts
similarity index 87%
rename from src/services/request/RequestAbortedError.js
rename to src/services/request/RequestAbortedError.ts
index 3931f26..19414be 100644
--- a/src/services/request/RequestAbortedError.js
+++ b/src/services/request/RequestAbortedError.ts
@@ -1,17 +1,16 @@
-// @flow
 function RequestAbortedError(error: Error | Response) {
   this.name = 'RequestAbortedError';
   this.message = 'RequestAbortedError';
   this.error = error;
   this.stack = new Error().stack;
 
-  if (error.message) {
-    this.message = error.message;
-  }
-
   if (typeof error === 'string') {
     this.message = error;
   } else {
+    if ('message' in error) {
+      this.message = error.message;
+    }
+
     this.error = error;
     Object.assign(this, error);
   }
diff --git a/src/services/request/index.js b/src/services/request/index.ts
similarity index 56%
rename from src/services/request/index.js
rename to src/services/request/index.ts
index 0766ca7..db75abd 100644
--- a/src/services/request/index.js
+++ b/src/services/request/index.ts
@@ -1,6 +1,5 @@
-// @flow
-export { default } from './request';
-export type { Resp } from './request';
+export { default, Resp } from './request';
+export { Middleware } from './PromiseMiddlewareLayer';
 export { default as InternalServerError } from './InternalServerError';
 export { default as RequestAbortedError } from './RequestAbortedError';
 
@@ -8,7 +7,7 @@ export { default as RequestAbortedError } from './RequestAbortedError';
  * Usage: Query<'requeired'|'keys'|'names'>
  * TODO: find a way to make it more friendly with URLSearchParams type
  */
-export type Query<T: string> = {
-  get: (key: T) => ?string,
-  set: (key: T, value: any) => void,
+export type Query<T extends string> = {
+  get: (key: T) => string | void;
+  set: (key: T, value: any) => void;
 };
diff --git a/src/services/request/request.test.js b/src/services/request/request.test.ts
similarity index 89%
rename from src/services/request/request.test.js
rename to src/services/request/request.test.ts
index 3cef0bb..0f50a73 100644
--- a/src/services/request/request.test.js
+++ b/src/services/request/request.test.ts
@@ -10,14 +10,14 @@ describe('services/request', () => {
   });
 
   afterEach(() => {
-    window.fetch.restore();
+    (window.fetch as any).restore();
   });
 
   describe('InternalServerError', () => {
     it('should wrap json errors', () => {
       const resp = new Response('bad resp format', { status: 200 });
 
-      fetch.returns(Promise.resolve(resp));
+      (fetch as any).returns(Promise.resolve(resp));
 
       return expect(request.get('/foo'), 'to be rejected').then(error => {
         expect(error, 'to be an', InternalServerError);
@@ -29,7 +29,7 @@ describe('services/request', () => {
     it('should wrap 5xx errors', () => {
       const resp = new Response('{}', { status: 500 });
 
-      fetch.returns(Promise.resolve(resp));
+      (fetch as any).returns(Promise.resolve(resp));
 
       return expect(request.get('/foo'), 'to be rejected').then(error => {
         expect(error, 'to be an', InternalServerError);
@@ -40,7 +40,7 @@ describe('services/request', () => {
     it('should wrap aborted errors', () => {
       const resp = new Response('{}', { status: 0 });
 
-      fetch.returns(Promise.resolve(resp));
+      (fetch as any).returns(Promise.resolve(resp));
 
       return expect(request.get('/foo'), 'to be rejected').then(error => {
         expect(error, 'to be an', RequestAbortedError);
@@ -51,7 +51,7 @@ describe('services/request', () => {
     it('should wrap "Failed to fetch" errors', () => {
       const resp = new TypeError('Failed to fetch');
 
-      fetch.returns(Promise.resolve(resp));
+      (fetch as any).returns(Promise.resolve(resp));
 
       return expect(request.get('/foo'), 'to be rejected').then(error => {
         expect(error, 'to be an', RequestAbortedError);
diff --git a/src/services/request/request.js b/src/services/request/request.ts
similarity index 71%
rename from src/services/request/request.js
rename to src/services/request/request.ts
index 8ba96c2..44d6d0f 100644
--- a/src/services/request/request.js
+++ b/src/services/request/request.ts
@@ -1,25 +1,27 @@
-// @flow
-import PromiseMiddlewareLayer from './PromiseMiddlewareLayer';
+import PromiseMiddlewareLayer, { Middleware } from './PromiseMiddlewareLayer';
 import InternalServerError from './InternalServerError';
 import RequestAbortedError from './RequestAbortedError';
 
 const middlewareLayer = new PromiseMiddlewareLayer();
 
-export type Resp<T> = {
-  ...$Exact<T>,
-  originalResponse: Response,
+export type Resp<T> = T & {
+  originalResponse: Response;
 };
 
-type Middleware = {
-  before?: () => Promise<*>,
-  after?: () => Promise<*>,
-  catch?: () => Promise<*>,
-};
+export interface Options extends RequestInit {
+  token?: string | null;
+  headers: { [key: string]: any };
+}
 
-const buildOptions = (method: string, data?: Object, options: Object) => ({
+const buildOptions = (
+  method: string,
+  data: { [key: string]: any } | undefined,
+  options: Partial<Options> = {},
+): Options => ({
   method,
   headers: {
     'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
+    ...options.headers,
   },
   body: buildQuery(data),
   ...options,
@@ -33,7 +35,11 @@ export default {
    *
    * @returns {Promise}
    */
-  post<T>(url: string, data?: Object, options: Object = {}): Promise<Resp<T>> {
+  post<T>(
+    url: string,
+    data?: { [key: string]: any },
+    options?: Partial<Options>,
+  ): Promise<Resp<T>> {
     return doFetch(url, buildOptions('POST', data, options));
   },
 
@@ -44,10 +50,14 @@ export default {
    *
    * @returns {Promise}
    */
-  get<T>(url: string, data?: Object, options: Object = {}): Promise<Resp<T>> {
+  get<T>(
+    url: string,
+    data?: { [key: string]: any },
+    options?: Partial<Options>,
+  ): Promise<Resp<T>> {
     url = buildUrl(url, data);
 
-    return doFetch(url, options);
+    return doFetch(url, { ...options, method: 'GET', headers: {} });
   },
 
   /**
@@ -59,8 +69,8 @@ export default {
    */
   delete<T>(
     url: string,
-    data?: Object,
-    options: Object = {},
+    data?: { [key: string]: any },
+    options?: Partial<Options>,
   ): Promise<Resp<T>> {
     return doFetch(url, buildOptions('DELETE', data, options));
   },
@@ -72,7 +82,11 @@ export default {
    *
    * @returns {Promise}
    */
-  put<T>(url: string, data?: Object, options: Object = {}): Promise<Resp<T>> {
+  put<T>(
+    url: string,
+    data?: { [key: string]: any },
+    options?: Partial<Options>,
+  ): Promise<Resp<T>> {
     return doFetch(url, buildOptions('PUT', data, options));
   },
 
@@ -134,24 +148,34 @@ const handleResponseSuccess = resp =>
     ? Promise.resolve(resp)
     : Promise.reject(resp);
 
-async function doFetch(url, options = {}) {
+async function doFetch(url: string, options: Options) {
   // NOTE: we are wrapping fetch, because it is returning
-  // Promise instance that can not be pollyfilled with Promise.prototype.finally
+  // Promise instance that can not be polyfilled with Promise.prototype.finally
 
-  options.headers = options.headers || {};
-  options.headers.Accept = 'application/json';
+  const headers: { [key: string]: string } = { ...options.headers } as any;
+  headers.Accept = 'application/json';
+
+  options.headers = headers;
 
   return middlewareLayer
     .run('before', { url, options })
-    .then(({ url, options }) =>
-      fetch(url, options)
+    .then(({ url: nextUrl, options: nextOptions }) =>
+      fetch(nextUrl, nextOptions)
         .then(checkStatus)
         .then(toJSON, rejectWithJSON)
         .then(handleResponseSuccess)
-        .then(resp => middlewareLayer.run('then', resp, { url, options }))
+        .then(resp =>
+          middlewareLayer.run('then', resp, {
+            url: nextUrl,
+            options: nextOptions,
+          }),
+        )
         .catch(resp =>
-          middlewareLayer.run('catch', resp, { url, options }, () =>
-            doFetch(url, options),
+          middlewareLayer.run(
+            'catch',
+            resp,
+            { url: nextUrl, options: nextOptions },
+            () => doFetch(nextUrl, nextOptions),
           ),
         ),
     );
@@ -164,7 +188,7 @@ async function doFetch(url, options = {}) {
  *
  * @returns {string}
  */
-function convertQueryValue(value) {
+function convertQueryValue(value: any): string {
   if (typeof value === 'undefined' || value === null) {
     return '';
   }
@@ -177,7 +201,7 @@ function convertQueryValue(value) {
     return '0';
   }
 
-  return value;
+  return String(value);
 }
 
 /**
@@ -187,7 +211,7 @@ function convertQueryValue(value) {
  *
  * @returns {string}
  */
-function buildQuery(data: Object = {}): string {
+function buildQuery(data: { [key: string]: any } = {}): string {
   return Object.keys(data)
     .map(keyName =>
       [keyName, convertQueryValue(data[keyName])]
@@ -197,7 +221,7 @@ function buildQuery(data: Object = {}): string {
     .join('&');
 }
 
-function buildUrl(url: string, data?: Object): string {
+function buildUrl(url: string, data?: { [key: string]: any }): string {
   if (typeof data === 'object' && Object.keys(data).length) {
     const separator = url.indexOf('?') === -1 ? '?' : '&';
     url += separator + buildQuery(data);
diff --git a/src/storeFactory.js b/src/storeFactory.js
index b1786d8..0f55a83 100644
--- a/src/storeFactory.js
+++ b/src/storeFactory.js
@@ -1,4 +1,3 @@
-// @flow
 import { createStore, applyMiddleware, compose } from 'redux';
 // midleware, который позволяет возвращать из экшенов функции
 // это полезно для работы с асинхронными действиями,
@@ -29,7 +28,6 @@ export default function storeFactory() {
   const store = createStore(reducers, {}, enhancer);
 
   // Hot reload reducers
-  // $FlowFixMe
   if (module.hot && typeof module.hot.accept === 'function') {
     module.hot.accept('reducers', () =>
       store.replaceReducer(require('reducers').default),
diff --git a/src/test/unexpected.js b/src/test/unexpected.js
index 355665c..49d1341 100644
--- a/src/test/unexpected.js
+++ b/src/test/unexpected.js
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 import unexpected from 'unexpected';
 
 const expect = unexpected.clone();
diff --git a/tests-e2e/cypress/integration/dev/guest.test.js b/tests-e2e/cypress/integration/dev/guest.test.ts
similarity index 95%
rename from tests-e2e/cypress/integration/dev/guest.test.js
rename to tests-e2e/cypress/integration/dev/guest.test.ts
index e5bf911..d799718 100644
--- a/tests-e2e/cypress/integration/dev/guest.test.js
+++ b/tests-e2e/cypress/integration/dev/guest.test.ts
@@ -1,3 +1,4 @@
+/// <reference types="cypress" />
 describe('/dev/applications - guest', () => {
   it('should render login button', () => {
     cy.visit('/dev/applications');
diff --git a/tests-e2e/cypress/integration/dev/user.test.js b/tests-e2e/cypress/integration/dev/user.test.ts
similarity index 91%
rename from tests-e2e/cypress/integration/dev/user.test.js
rename to tests-e2e/cypress/integration/dev/user.test.ts
index e3a44a9..1eb994c 100644
--- a/tests-e2e/cypress/integration/dev/user.test.js
+++ b/tests-e2e/cypress/integration/dev/user.test.ts
@@ -1,10 +1,12 @@
+/// <reference types="cypress" />
+
 describe('/dev/applications - user', () => {
   before(() => {
     cy.login({ account: 'default' }).then(({ user }) => {
       cy.visit('/dev/applications');
 
       // remove all previousely added apps
-      cy.window().then(async ({ oauthApi }) => {
+      cy.window().then(async (/** @type {any} */ { oauthApi }) => {
         const apps = await oauthApi.getAppsByUser(user.id);
 
         await Promise.all(apps.map(app => oauthApi.delete(app.clientId)));
diff --git a/tests-e2e/cypress/integration/invalid-refreshToken.test.js b/tests-e2e/cypress/integration/invalid-refreshToken.test.ts
similarity index 97%
rename from tests-e2e/cypress/integration/invalid-refreshToken.test.js
rename to tests-e2e/cypress/integration/invalid-refreshToken.test.ts
index 7e85281..528761a 100644
--- a/tests-e2e/cypress/integration/invalid-refreshToken.test.js
+++ b/tests-e2e/cypress/integration/invalid-refreshToken.test.ts
@@ -1,3 +1,5 @@
+/// <reference types="cypress" />
+
 // account1 - authenticated
 // account2 - invalid refreshToken
 import { account1, account2 } from '../fixtures/accounts.json';
@@ -23,9 +25,13 @@ describe("when user's token and refreshToken are invalid", () => {
         .then(resp => resp.json())
         .then(resp => {
           const account = multiAccount.accounts.available.find(
-            account => account.username === account1.username,
+            item => item.username === account1.username,
           );
 
+          if (!account) {
+            throw new Error('Can not find an account');
+          }
+
           account.token = resp.access_token;
         }),
     ),
diff --git a/tests-e2e/cypress/integration/sign-in.test.js b/tests-e2e/cypress/integration/sign-in.test.ts
similarity index 93%
rename from tests-e2e/cypress/integration/sign-in.test.js
rename to tests-e2e/cypress/integration/sign-in.test.ts
index 4168515..c13a8fd 100644
--- a/tests-e2e/cypress/integration/sign-in.test.js
+++ b/tests-e2e/cypress/integration/sign-in.test.ts
@@ -1,3 +1,4 @@
+/// <reference types="cypress" />
 import { account1 } from '../fixtures/accounts.json';
 
 describe('sign in', () => {
@@ -17,10 +18,10 @@ describe('sign in', () => {
     cy.get('[data-e2e-toolbar]')
       .contains(account1.username)
       .should(() => {
-        const state = JSON.parse(localStorage.getItem('redux-storage'));
+        const state = JSON.parse(localStorage.getItem('redux-storage') || '');
         expect(state.accounts.available).to.have.length(1);
 
-        const account = state.accounts.available[0];
+        const [account] = state.accounts.available;
         expect(account.username).to.be.equal(account1.username);
         expect(account.id)
           .to.be.a('number')
diff --git a/tests-e2e/cypress/plugins/index.js b/tests-e2e/cypress/plugins/index.ts
similarity index 87%
rename from tests-e2e/cypress/plugins/index.js
rename to tests-e2e/cypress/plugins/index.ts
index 115f0e0..cbcbb3a 100644
--- a/tests-e2e/cypress/plugins/index.js
+++ b/tests-e2e/cypress/plugins/index.ts
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 /* eslint-env node */
 // ***********************************************************
 // This example plugins/index.js can be used to load plugins
@@ -12,8 +13,7 @@
 // This function is called when a project is opened or re-opened (e.g. due to
 // the project's config changing)
 
-// eslint-disable-next-line no-unused-vars
-module.exports = (on, config) => {
+export default (on, config) => {
   // `on` is used to hook into various events Cypress emits
   // `config` is the resolved Cypress config
 };
diff --git a/tests-e2e/cypress/support/commands.js b/tests-e2e/cypress/support/commands.ts
similarity index 100%
rename from tests-e2e/cypress/support/commands.js
rename to tests-e2e/cypress/support/commands.ts
diff --git a/tests-e2e/cypress/support/index.d.ts b/tests-e2e/cypress/support/index.d.ts
new file mode 100644
index 0000000..76d1eba
--- /dev/null
+++ b/tests-e2e/cypress/support/index.d.ts
@@ -0,0 +1,14 @@
+/// <reference types="cypress" />
+
+declare namespace Cypress {
+  interface Chainable {
+    /**
+     * Custom command to log in the user
+     *
+     * @example cy.login(account)
+     */
+    login(options: {
+      account: 'default' | 'default2';
+    }): Promise<{ [key: string]: any }>;
+  }
+}
diff --git a/tests-e2e/cypress/support/index.js b/tests-e2e/cypress/support/index.ts
similarity index 100%
rename from tests-e2e/cypress/support/index.js
rename to tests-e2e/cypress/support/index.ts
diff --git a/tests-e2e/cypress/tsconfig.json b/tests-e2e/cypress/tsconfig.json
new file mode 100644
index 0000000..da49384
--- /dev/null
+++ b/tests-e2e/cypress/tsconfig.json
@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "baseUrl": "../node_modules",
+    "target": "es5",
+    "lib": ["es5", "dom"],
+    "types": ["cypress"],
+    "resolveJsonModule": true
+  },
+  "include": ["**/*.ts"]
+}
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..01ca253
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./src",
+    "module": "esnext",
+    "target": "esnext",
+    "esModuleInterop": true, // allow importing commonjs exports as default in es imports
+    "moduleResolution": "node",
+    "noEmit": true,
+    "checkJs": true,
+    "allowJs": true,
+    "strictNullChecks": true,
+    // we can not enable json modules, because this will disable
+    // *.intl.json overrides (@see `webpack-loaders.d.ts`)
+    "resolveJsonModule": false,
+    "jsx": "preserve"
+  },
+  "include": ["@types", "src", "webpack-utils", "config", "scripts"]
+}
diff --git a/webpack-utils/fontgen-loader.js b/webpack-utils/fontgen-loader.js
index 1b75ff0..e1cbcf1 100644
--- a/webpack-utils/fontgen-loader.js
+++ b/webpack-utils/fontgen-loader.js
@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+// @ts-nocheck
 /* eslint-env node */
 /**
  * Forked from
diff --git a/webpack-utils/intl-loader.js b/webpack-utils/intl-loader.js
index ada7b53..adfdb5d 100644
--- a/webpack-utils/intl-loader.js
+++ b/webpack-utils/intl-loader.js
@@ -1,3 +1,4 @@
+// @ts-nocheck
 function transform(src, modulePath, rootContext) {
   const json = JSON.parse(src);
 
diff --git a/webpack.config.js b/webpack.config.js
index be1eaa8..d7d20ea 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,6 +1,9 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 
-require('@babel/register');
+require('@babel/register')({
+  extensions: ['.es6', '.es', '.jsx', '.js', '.mjs', '.ts', '.tsx'],
+});
 
 const path = require('path');
 const webpack = require('webpack');
@@ -13,8 +16,7 @@ const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
 const EagerImportsPlugin = require('eager-imports-webpack-plugin').default;
 const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 const config = require('./config');
-
-const SUPPORTED_LANGUAGES = Object.keys(require('./src/i18n/index.json'));
+const SUPPORTED_LANGUAGES = Object.keys(require('./src/i18n'));
 const localeFlags = require('./src/components/i18n/localeFlags').default;
 const rootPath = path.resolve('./src');
 const outputPath = path.join(__dirname, 'dist');
@@ -54,7 +56,7 @@ const webpackConfig = {
 
   resolve: {
     modules: [rootPath, 'node_modules'],
-    extensions: ['.js', '.jsx', '.json'],
+    extensions: ['.js', '.jsx', '.json', '.ts', '.tsx'],
     alias: {
       'react-dom': isProduction ? 'react-dom' : '@hot-loader/react-dom',
     },
@@ -181,7 +183,7 @@ const webpackConfig = {
         ],
       },
       {
-        test: /\.jsx?$/,
+        test: /\.[tj]sx?$/,
         exclude: /node_modules/,
         use: [
           {
diff --git a/webpack.dll.config.js b/webpack.dll.config.js
index 9db4f82..64d1ae3 100644
--- a/webpack.dll.config.js
+++ b/webpack.dll.config.js
@@ -1,9 +1,11 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 const path = require('path');
 const webpack = require('webpack');
+const supportedLocales = require('./src/i18n');
 const vendor = Object.keys(require('./package.json').dependencies);
+
 const isProduction = process.argv.some(arg => arg === '-p');
-const supportedLocales = require('./src/i18n/index.json');
 const isTest = process.argv.some(arg => arg.indexOf('karma') !== -1);
 
 process.env.NODE_ENV = 'development';
diff --git a/yarn.lock b/yarn.lock
index b5ab196..f7f21ec 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -72,17 +72,6 @@
     semver "^5.4.1"
     source-map "^0.5.0"
 
-"@babel/generator@^7.2.2":
-  version "7.2.2"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.2.2.tgz#18c816c70962640eab42fe8cae5f3947a5c65ccc"
-  integrity sha512-I4o675J/iS8k+P38dvJ3IBGqObLXyQLTxtrR4u9cSUJOURvafeEWb/pFMOTwtNrmq73mJzyF6ueTbO1BtN0Zeg==
-  dependencies:
-    "@babel/types" "^7.2.2"
-    jsesc "^2.5.1"
-    lodash "^4.17.10"
-    source-map "^0.5.0"
-    trim-right "^1.0.1"
-
 "@babel/generator@^7.4.0", "@babel/generator@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.4.tgz#db651e2840ca9aa66f327dcec1dc5f5fa9611369"
@@ -172,15 +161,6 @@
     "@babel/traverse" "^7.7.4"
     "@babel/types" "^7.7.4"
 
-"@babel/helper-function-name@^7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.1.0.tgz#a0ceb01685f73355d4360c1247f582bfafc8ff53"
-  integrity sha512-A95XEoCpb3TO+KZzJ4S/5uW5fNe26DjBGqf1o9ucyLyCmi1dXq/B3c8iaWTfBk3VvetUxl16e8tIrd5teOCfGw==
-  dependencies:
-    "@babel/helper-get-function-arity" "^7.0.0"
-    "@babel/template" "^7.1.0"
-    "@babel/types" "^7.0.0"
-
 "@babel/helper-function-name@^7.7.0":
   version "7.7.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.7.0.tgz#44a5ad151cfff8ed2599c91682dda2ec2c8430a3"
@@ -199,13 +179,6 @@
     "@babel/template" "^7.7.4"
     "@babel/types" "^7.7.4"
 
-"@babel/helper-get-function-arity@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.0.0.tgz#83572d4320e2a4657263734113c42868b64e49c3"
-  integrity sha512-r2DbJeg4svYvt3HOS74U4eWKsUAMRH01Z1ds1zx8KNTPtpTL5JAsdFv8BNyOpVqdFhHkkRDIg5B4AsxmkjAlmQ==
-  dependencies:
-    "@babel/types" "^7.0.0"
-
 "@babel/helper-get-function-arity@^7.7.0":
   version "7.7.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.7.0.tgz#c604886bc97287a1d1398092bc666bc3d7d7aa2d"
@@ -301,13 +274,6 @@
     "@babel/template" "^7.7.4"
     "@babel/types" "^7.7.4"
 
-"@babel/helper-split-export-declaration@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.0.0.tgz#3aae285c0311c2ab095d997b8c9a94cad547d813"
-  integrity sha512-MXkOJqva62dfC0w85mEf/LucPPS/1+04nmmRMPEBUB++hiiThQ2zPtX/mEWQ3mtzCEjIJvPY8nuwxXtQeQwUag==
-  dependencies:
-    "@babel/types" "^7.0.0"
-
 "@babel/helper-split-export-declaration@^7.7.0":
   version "7.7.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.7.0.tgz#1365e74ea6c614deeb56ebffabd71006a0eb2300"
@@ -372,11 +338,6 @@
     regenerator-runtime "^0.13.3"
     v8flags "^3.1.1"
 
-"@babel/parser@^7.0.0", "@babel/parser@^7.2.2", "@babel/parser@^7.2.3":
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.2.3.tgz#32f5df65744b70888d17872ec106b02434ba1489"
-  integrity sha512-0LyEcVlfCoFmci8mXx8A5oIkpkOgyo8dRHtxBnK9RRBwxO2+JZPNsqtVEZQ7mJFPxnXF9lfmU24mHOPI0qnlkA==
-
 "@babel/parser@^7.1.0", "@babel/parser@^7.7.0", "@babel/parser@^7.7.2":
   version "7.7.3"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.3.tgz#5fad457c2529de476a248f75b0f090b3060af043"
@@ -584,13 +545,6 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-flow@^7.7.4":
-  version "7.7.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.7.4.tgz#6d91b59e1a0e4c17f36af2e10dd64ef220919d7b"
-  integrity sha512-2AMAWl5PsmM5KPkB22cvOkUyWk6MjUaqhHNU5nSPUl/ns3j5qLfw2SuYP5RbVZ0tfLvePr4zUScbICtDP2CUNw==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
 "@babel/plugin-syntax-function-bind@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-function-bind/-/plugin-syntax-function-bind-7.7.4.tgz#625ad69fe4dcb56147fa5b0a68fbaff96fd25864"
@@ -689,6 +643,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-typescript@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.7.4.tgz#5d037ffa10f3b25a16f32570ebbe7a8c2efa304b"
+  integrity sha512-77blgY18Hud4NM1ggTA8xVT/dBENQf17OpiToSa2jSmEY3fWXD2jwrdVlO4kq5yzUTeF15WSQ6b4fByNvJcjpQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+
 "@babel/plugin-transform-arrow-functions@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.7.4.tgz#76309bd578addd8aee3b379d809c802305a98a12"
@@ -771,14 +732,6 @@
     "@babel/helper-builder-binary-assignment-operator-visitor" "^7.7.4"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-flow-strip-types@^7.7.4":
-  version "7.7.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.7.4.tgz#cc73f85944782df1d77d80977bc097920a8bf31a"
-  integrity sha512-w9dRNlHY5ElNimyMYy0oQowvQpwt/PRHI0QS98ZJCTZU2bvSnKXo5zEiD5u76FBPigTm8TkqzmnUTg16T7qbkA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-syntax-flow" "^7.7.4"
-
 "@babel/plugin-transform-for-of@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.7.4.tgz#248800e3a5e507b1f103d8b4ca998e77c63932bc"
@@ -975,6 +928,15 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-typescript@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.7.4.tgz#2974fd05f4e85c695acaf497f432342de9fc0636"
+  integrity sha512-X8e3tcPEKnwwPVG+vP/vSqEShkwODOEeyQGod82qrIuidwIrfnsGn11qPM1jBLF4MqguTXXYzm58d0dY+/wdpg==
+  dependencies:
+    "@babel/helper-create-class-features-plugin" "^7.7.4"
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-syntax-typescript" "^7.7.4"
+
 "@babel/plugin-transform-unicode-regex@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.7.4.tgz#a3c0f65b117c4c81c5b6484f2a5e7b95346b83ae"
@@ -1040,14 +1002,6 @@
     js-levenshtein "^1.1.3"
     semver "^5.5.0"
 
-"@babel/preset-flow@^7.7.4":
-  version "7.7.4"
-  resolved "https://registry.yarnpkg.com/@babel/preset-flow/-/preset-flow-7.7.4.tgz#99c1349b6fd7132783196de181e6b32d0949427e"
-  integrity sha512-6LbUqcHD8BcRtXMOp5bc5nJeU8RlKh6q5U8TgZeCrf9ebBdW8Wyy5ujAUnbJfmzQ56Kkq5XtwErC/5+5RHyFYA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-transform-flow-strip-types" "^7.7.4"
-
 "@babel/preset-react@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.7.4.tgz#3fe2ea698d8fb536d8e7881a592c3c1ee8bf5707"
@@ -1059,6 +1013,14 @@
     "@babel/plugin-transform-react-jsx-self" "^7.7.4"
     "@babel/plugin-transform-react-jsx-source" "^7.7.4"
 
+"@babel/preset-typescript@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.7.4.tgz#780059a78e6fa7f7a4c87f027292a86b31ce080a"
+  integrity sha512-rqrjxfdiHPsnuPur0jKrIIGQCIgoTWMTjlbWE69G4QJ6TIOVnnRnIJhUxNTL/VwDmEAVX08Tq3B1nirer5341w==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/plugin-transform-typescript" "^7.7.4"
+
 "@babel/register@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.7.4.tgz#45a4956471a9df3b012b747f5781cc084ee8f128"
@@ -1099,15 +1061,6 @@
   dependencies:
     regenerator-runtime "^0.13.2"
 
-"@babel/template@^7.1.0":
-  version "7.2.2"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.2.2.tgz#005b3fdf0ed96e88041330379e0da9a708eb2907"
-  integrity sha512-zRL0IMM02AUDwghf5LMSSDEz7sBCO2YnNmpg3uWTZj/v1rcG2BmQUvaGU8GhU8BvfMh1k2KIAYZ7Ji9KXPUg7g==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/parser" "^7.2.2"
-    "@babel/types" "^7.2.2"
-
 "@babel/template@^7.4.0", "@babel/template@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.7.4.tgz#428a7d9eecffe27deac0a98e23bf8e3675d2a77b"
@@ -1126,21 +1079,6 @@
     "@babel/parser" "^7.7.0"
     "@babel/types" "^7.7.0"
 
-"@babel/traverse@^7.0.0":
-  version "7.2.3"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.2.3.tgz#7ff50cefa9c7c0bd2d81231fdac122f3957748d8"
-  integrity sha512-Z31oUD/fJvEWVR0lNZtfgvVt512ForCTNKYcJBGbPb1QZfve4WGH8Wsy7+Mev33/45fhP/hwQtvgusNdcCMgSw==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/generator" "^7.2.2"
-    "@babel/helper-function-name" "^7.1.0"
-    "@babel/helper-split-export-declaration" "^7.0.0"
-    "@babel/parser" "^7.2.3"
-    "@babel/types" "^7.2.2"
-    debug "^4.1.0"
-    globals "^11.1.0"
-    lodash "^4.17.10"
-
 "@babel/traverse@^7.1.0", "@babel/traverse@^7.4.3", "@babel/traverse@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.7.4.tgz#9c1e7c60fb679fe4fcfaa42500833333c2058558"
@@ -1171,7 +1109,7 @@
     globals "^11.1.0"
     lodash "^4.17.13"
 
-"@babel/types@^7.0.0", "@babel/types@^7.2.2":
+"@babel/types@^7.0.0":
   version "7.2.2"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.2.2.tgz#44e10fc24e33af524488b716cdaee5360ea8ed1e"
   integrity sha512-fKCuD6UFUMkR541eDWL+2ih/xFZBXPOg/7EQFeTluMDebfqR4jrpaCjLhkWlQS4hT6nRa2PMEgXKbRB5/H2fpg==
@@ -1533,6 +1471,11 @@
   dependencies:
     "@babel/types" "^7.3.0"
 
+"@types/eslint-visitor-keys@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#1ee30d79544ca84d68d4b3cdb0af4f205663dd2d"
+  integrity sha512-OCutwjDZ4aFS6PB1UZ988C4YgwlBHJd6wCeQqaLdmadZ/7e+w79+hbMUFC1QXDNCmdyoRfAFdm0RypzwR+Qpag==
+
 "@types/events@*":
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/@types/events/-/events-3.0.0.tgz#2862f3f58a9a7f7c3e78d79f130dd4d71c25c2a7"
@@ -1547,7 +1490,12 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
-"@types/hoist-non-react-statics@^3.3.1":
+"@types/history@*":
+  version "4.7.3"
+  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.3.tgz#856c99cdc1551d22c22b18b5402719affec9839a"
+  integrity sha512-cS5owqtwzLN5kY+l+KgKdRJ/Cee8tlmQoGQuIE9tWnSmS3JMKzmxo2HIAk2wODMifGwO20d62xZQLYz+RLfXmw==
+
+"@types/hoist-non-react-statics@^3.3.0", "@types/hoist-non-react-statics@^3.3.1":
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
   integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
@@ -1580,6 +1528,18 @@
     "@types/istanbul-lib-coverage" "*"
     "@types/istanbul-lib-report" "*"
 
+"@types/jest@^24.0.23":
+  version "24.0.23"
+  resolved "https://registry.yarnpkg.com/@types/jest/-/jest-24.0.23.tgz#046f8e2ade026fe831623e361a36b6fb9a4463e4"
+  integrity sha512-L7MBvwfNpe7yVPTXLn32df/EK+AMBFAFvZrRuArGs7npEWnlziUXK+5GMIUTI4NIuwok3XibsjXCs5HxviYXjg==
+  dependencies:
+    jest-diff "^24.3.0"
+
+"@types/json-schema@^7.0.3":
+  version "7.0.3"
+  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.3.tgz#bdfd69d61e464dcc81b25159c270d75a73c1a636"
+  integrity sha512-Il2DtDVRGDcqjDtE+rF8iqg1CArehSK84HZJCT7AMITlyXRBpuPhqGLDQMowraqqu1coEaimg4ZOqggt6L6L+A==
+
 "@types/minimatch@*":
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
@@ -1605,6 +1565,33 @@
   resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.2.tgz#690a1475b84f2a884fd07cd797c00f5f31356ea8"
   integrity sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw==
 
+"@types/react-redux@^7.1.5":
+  version "7.1.5"
+  resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.5.tgz#c7a528d538969250347aa53c52241051cf886bd3"
+  integrity sha512-ZoNGQMDxh5ENY7PzU7MVonxDzS1l/EWiy8nUhDqxFqUZn4ovboCyvk4Djf68x6COb7vhGTKjyjxHxtFdAA5sUA==
+  dependencies:
+    "@types/hoist-non-react-statics" "^3.3.0"
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+    redux "^4.0.0"
+
+"@types/react-router-dom@^5.1.3":
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-5.1.3.tgz#b5d28e7850bd274d944c0fbbe5d57e6b30d71196"
+  integrity sha512-pCq7AkOvjE65jkGS5fQwQhvUp4+4PVD9g39gXLZViP2UqFiFzsEpB3PKf0O6mdbKsewSK8N14/eegisa/0CwnA==
+  dependencies:
+    "@types/history" "*"
+    "@types/react" "*"
+    "@types/react-router" "*"
+
+"@types/react-router@*":
+  version "5.1.3"
+  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.3.tgz#7c7ca717399af64d8733d8cb338dd43641b96f2d"
+  integrity sha512-0gGhmerBqN8CzlnDmSgGNun3tuZFXerUclWkqEhozdLaJtfcJRUTGkKaEKk+/MpHd1KDS1+o2zb/3PkBUiv2qQ==
+  dependencies:
+    "@types/history" "*"
+    "@types/react" "*"
+
 "@types/react@*":
   version "16.9.11"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.11.tgz#70e0b7ad79058a7842f25ccf2999807076ada120"
@@ -1628,6 +1615,11 @@
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e"
   integrity sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==
 
+"@types/webpack-env@^1.14.1":
+  version "1.14.1"
+  resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.14.1.tgz#0d8a53f308f017c53a5ddc3d07f4d6fa76b790d7"
+  integrity sha512-0Ki9jAAhKDSuLDXOIMADg54Hu60SuBTEsWaJGGy5cV+SSUQ63J2a+RrYYGrErzz39fXzTibhKrAQJAb8M7PNcA==
+
 "@types/yargs-parser@*":
   version "13.1.0"
   resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-13.1.0.tgz#c563aa192f39350a1d18da36c5a8da382bbd8228"
@@ -1640,6 +1632,49 @@
   dependencies:
     "@types/yargs-parser" "*"
 
+"@typescript-eslint/eslint-plugin@^2.9.0":
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-2.9.0.tgz#fa810282c0e45f6c2310b9c0dfcd25bff97ab7e9"
+  integrity sha512-98rfOt3NYn5Gr9wekTB8TexxN6oM8ZRvYuphPs1Atfsy419SDLYCaE30aJkRiiTCwGEY98vOhFsEVm7Zs4toQQ==
+  dependencies:
+    "@typescript-eslint/experimental-utils" "2.9.0"
+    eslint-utils "^1.4.3"
+    functional-red-black-tree "^1.0.1"
+    regexpp "^3.0.0"
+    tsutils "^3.17.1"
+
+"@typescript-eslint/experimental-utils@2.9.0":
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.9.0.tgz#bbe99a8d9510240c055fc4b17230dd0192ba3c7f"
+  integrity sha512-0lOLFdpdJsCMqMSZT7l7W2ta0+GX8A3iefG3FovJjrX+QR8y6htFlFdU7aOVPL6pDvt6XcsOb8fxk5sq+girTw==
+  dependencies:
+    "@types/json-schema" "^7.0.3"
+    "@typescript-eslint/typescript-estree" "2.9.0"
+    eslint-scope "^5.0.0"
+
+"@typescript-eslint/parser@^2.9.0":
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-2.9.0.tgz#2e9cf438de119b143f642a3a406e1e27eb70b7cd"
+  integrity sha512-fJ+dNs3CCvEsJK2/Vg5c2ZjuQ860ySOAsodDPwBaVlrGvRN+iCNC8kUfLFL8cT49W4GSiLPa/bHiMjYXA7EhKQ==
+  dependencies:
+    "@types/eslint-visitor-keys" "^1.0.0"
+    "@typescript-eslint/experimental-utils" "2.9.0"
+    "@typescript-eslint/typescript-estree" "2.9.0"
+    eslint-visitor-keys "^1.1.0"
+
+"@typescript-eslint/typescript-estree@2.9.0":
+  version "2.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-2.9.0.tgz#09138daf8f47d0e494ba7db9e77394e928803017"
+  integrity sha512-v6btSPXEWCP594eZbM+JCXuFoXWXyF/z8kaSBSdCb83DF+Y7+xItW29SsKtSULgLemqJBT+LpT+0ZqdfH7QVmA==
+  dependencies:
+    debug "^4.1.1"
+    eslint-visitor-keys "^1.1.0"
+    glob "^7.1.6"
+    is-glob "^4.0.1"
+    lodash.unescape "4.0.1"
+    semver "^6.3.0"
+    tsutils "^3.17.1"
+
 "@webassemblyjs/ast@1.8.5":
   version "1.8.5"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359"
@@ -2283,18 +2318,6 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
   integrity sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==
 
-babel-eslint@^10.0.3:
-  version "10.0.3"
-  resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.0.3.tgz#81a2c669be0f205e19462fed2482d33e4687a88a"
-  integrity sha512-z3U7eMY6r/3f3/JB9mTsLjyxrv0Yb1zb8PCWCLpguxfCzBIZUwy23R1t/XKewP+8mEN2Ck8Dtr4q20z6ce6SoA==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/parser" "^7.0.0"
-    "@babel/traverse" "^7.0.0"
-    "@babel/types" "^7.0.0"
-    eslint-visitor-keys "^1.0.0"
-    resolve "^1.12.0"
-
 babel-jest@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-24.9.0.tgz#3fc327cb8467b89d14d7bc70e315104a783ccd54"
@@ -4327,13 +4350,6 @@ eslint-config-prettier@^6.7.0:
   dependencies:
     get-stdin "^6.0.0"
 
-eslint-plugin-flowtype@^4.5.2:
-  version "4.5.2"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-flowtype/-/eslint-plugin-flowtype-4.5.2.tgz#5353449692663ef70e8fc8c2386cebdecac7e86b"
-  integrity sha512-ByV0EtEQOqiCl6bsrtXtTGnXlIXoyvDrvUq3Nz28huODAhnRDuMotyTrwP+TjAKZMPWbtaNGFHMoUxW3DktGOw==
-  dependencies:
-    lodash "^4.17.15"
-
 eslint-plugin-jsdoc@^18.1.5:
   version "18.1.5"
   resolved "https://registry.yarnpkg.com/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-18.1.5.tgz#bdab6f2ae1ee37b4acdb997d1ad24c3023881dd1"
@@ -4393,11 +4409,6 @@ eslint-utils@^1.4.3:
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
-eslint-visitor-keys@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#3f3180fb2e291017716acb4c9d6d5b5c34a6a81d"
-  integrity sha512-qzm/XxIbxm/FHyH341ZrbnMUpe+5Bocte9xkmFMzPMjRaZMcXww+MpBptFvtU+79L362nqiLhekCxCxDPaUMBQ==
-
 eslint-visitor-keys@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.1.0.tgz#e2a82cea84ff246ad6fb57f9bde5b46621459ec2"
@@ -4962,11 +4973,6 @@ flatted@^2.0.0:
   resolved "https://registry.yarnpkg.com/flatted/-/flatted-2.0.1.tgz#69e57caa8f0eacbc281d2e2cb458d46fdb449e08"
   integrity sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg==
 
-flow-bin@~0.102.0:
-  version "0.102.0"
-  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.102.0.tgz#3d5de44bcc26d26585e932b3201988b766f9b380"
-  integrity sha512-mYon6noeLO0Q5SbiWULLQeM1L96iuXnRtYMd47j3bEWXAwUW9EnwNWcn+cZg/jC/Dg4Wj/jnkdTDEuFtbeu1ww==
-
 flush-write-stream@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.1.1.tgz#8dd7d873a1babc207d94ead0c2e0e44276ebf2e8"
@@ -6571,7 +6577,7 @@ jest-config@^24.9.0:
     pretty-format "^24.9.0"
     realpath-native "^1.1.0"
 
-jest-diff@^24.9.0:
+jest-diff@^24.3.0, jest-diff@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-24.9.0.tgz#931b7d0d5778a1baf7452cb816e325e3724055da"
   integrity sha512-qMfrTs8AdJE2iqrTp0hzh7kTd2PQWrsFyj9tORoKmu32xjPjeE4NyjVRDz8ybYwqS2ik8N4hsIpiVTyFeo2lBQ==
@@ -7392,6 +7398,11 @@ lodash.sortby@^4.7.0:
   resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
   integrity sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=
 
+lodash.unescape@4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/lodash.unescape/-/lodash.unescape-4.0.1.tgz#bf2249886ce514cda112fae9218cdc065211fc9c"
+  integrity sha1-vyJJiGzlFM2hEvrpIYzcBlIR/Jw=
+
 lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
@@ -9986,7 +9997,7 @@ redux-thunk@^2.0.0:
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"
   integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw==
 
-redux@^4.0.4:
+redux@^4.0.0, redux@^4.0.4:
   version "4.0.4"
   resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796"
   integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q==
@@ -10046,6 +10057,11 @@ regexpp@^2.0.1:
   resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.1.tgz#8d19d31cf632482b589049f8281f93dbcba4d07f"
   integrity sha512-lv0M6+TkDVniA3aD1Eg0DVpfU/booSu7Eev3TDO/mZKHBfVjgCGTV4t4buppESEYDtkArYFOxTJWv6S5C+iaNw==
 
+regexpp@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.0.0.tgz#dd63982ee3300e67b41c1956f850aa680d9d330e"
+  integrity sha512-Z+hNr7RAVWxznLPuA7DIh8UNX1j9CDrUQxskw9IrBE1Dxue2lyXT+shqEIeLUjrokxIP8CMy1WkjgG3rTsd5/g==
+
 regexpu-core@^4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.6.0.tgz#2037c18b327cfce8a6fea2a4ec441f2432afb8b6"
@@ -11588,11 +11604,6 @@ trim-newlines@^1.0.0:
   resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-1.0.0.tgz#5887966bb582a4503a41eb524f7d35011815a613"
   integrity sha1-WIeWa7WCpFA6QetST301ARgVphM=
 
-trim-right@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
-  integrity sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=
-
 "true-case-path@^1.0.2":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/true-case-path/-/true-case-path-1.0.3.tgz#f813b5a8c86b40da59606722b144e3225799f47d"
@@ -11605,11 +11616,18 @@ tryer@^1.0.1:
   resolved "https://registry.yarnpkg.com/tryer/-/tryer-1.0.1.tgz#f2c85406800b9b0f74c9f7465b81eaad241252f8"
   integrity sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==
 
-tslib@^1.9.0:
+tslib@^1.8.1, tslib@^1.9.0:
   version "1.10.0"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a"
   integrity sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==
 
+tsutils@^3.17.1:
+  version "3.17.1"
+  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.17.1.tgz#ed719917f11ca0dee586272b2ac49e015a2dd759"
+  integrity sha512-kzeQ5B8H3w60nFY2g8cJIuH7JDpsALXySGtwGJ0p2LSjLgay3NdIpqq5SoOBe46bKDW2iq25irHCr8wjomUS2g==
+  dependencies:
+    tslib "^1.8.1"
+
 ttf2eot@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ttf2eot/-/ttf2eot-2.0.0.tgz#8e6337a585abd1608a0c84958ab483ce69f6654b"
@@ -11684,6 +11702,11 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
+typescript@^3.7.2:
+  version "3.7.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.2.tgz#27e489b95fa5909445e9fef5ee48d81697ad18fb"
+  integrity sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ==
+
 ua-parser-js@^0.7.18:
   version "0.7.20"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.20.tgz#7527178b82f6a62a0f243d1f94fd30e3e3c21098"