mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-11-10 01:52:04 +05:30
#22: minor code style and type anotations improvements
This commit is contained in:
parent
bfff6894b5
commit
6f650ba0c5
265
flow-typed/npm/react-intl_v2.x.x.js
vendored
Normal file
265
flow-typed/npm/react-intl_v2.x.x.js
vendored
Normal file
@ -0,0 +1,265 @@
|
||||
// flow-typed signature: e68caa23426dedefced5662fb92b4638
|
||||
// flow-typed version: d13a175635/react-intl_v2.x.x/flow_>=v0.57.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
|
||||
|
||||
import type { Element, ChildrenArray } from "react";
|
||||
|
||||
type $npm$ReactIntl$LocaleData = {
|
||||
locale: string,
|
||||
[key: string]: any
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$MessageDescriptor = {
|
||||
id: string,
|
||||
description?: string,
|
||||
defaultMessage?: string
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$IntlConfig = {
|
||||
locale: string,
|
||||
formats: Object,
|
||||
messages: { [id: string]: string },
|
||||
|
||||
defaultLocale?: string,
|
||||
defaultFormats?: Object
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$IntlProviderConfig = {
|
||||
locale?: string,
|
||||
formats?: Object,
|
||||
messages?: { [id: string]: string },
|
||||
|
||||
defaultLocale?: string,
|
||||
defaultFormats?: Object
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$IntlFormat = {
|
||||
formatDate: (value: any, options?: Object) => string,
|
||||
formatTime: (value: any, options?: Object) => string,
|
||||
formatRelative: (value: any, options?: Object) => 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
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$IntlShape = $npm$ReactIntl$IntlConfig &
|
||||
$npm$ReactIntl$IntlFormat & { now: () => number };
|
||||
|
||||
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"
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$RelativeFormatOptions = {
|
||||
style?: "best fit" | "numeric",
|
||||
units?: "second" | "minute" | "hour" | "day" | "month" | "year"
|
||||
};
|
||||
|
||||
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
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$PluralFormatOptions = {
|
||||
style?: "cardinal" | "ordinal"
|
||||
};
|
||||
|
||||
type $npm$ReactIntl$PluralCategoryString =
|
||||
| "zero"
|
||||
| "one"
|
||||
| "two"
|
||||
| "few"
|
||||
| "many"
|
||||
| "other";
|
||||
|
||||
type $npm$ReactIntl$DateParseable = number | string | Date;
|
||||
|
||||
declare module "react-intl" {
|
||||
// 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]: $npm$ReactIntl$MessageDescriptor }
|
||||
>(
|
||||
messageDescriptors: T
|
||||
): T;
|
||||
|
||||
declare type InjectIntlProvidedProps = {
|
||||
intl: $npm$ReactIntl$IntlShape
|
||||
}
|
||||
|
||||
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<OriginalProps: InjectIntlProvidedProps, DefaultProps: {}>
|
||||
(
|
||||
component: ComponentWithDefaultProps<DefaultProps, OriginalProps>,
|
||||
options?: InjectIntlOptions,
|
||||
):
|
||||
IntlInjectedComponentClass<$Diff<OriginalProps, InjectIntlProvidedProps>, DefaultProps>
|
||||
|
||||
declare function injectIntl<OriginalProps: InjectIntlProvidedProps>
|
||||
(
|
||||
component: React$ComponentType<OriginalProps>,
|
||||
options?: InjectIntlOptions,
|
||||
):
|
||||
IntlInjectedComponentClass<$Diff<OriginalProps, InjectIntlProvidedProps>>;
|
||||
|
||||
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 formatRelative(
|
||||
value: any,
|
||||
options?: $npm$ReactIntl$RelativeFormatOptions & {
|
||||
format: string,
|
||||
now: any
|
||||
}
|
||||
): 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
|
||||
}
|
||||
> {}
|
||||
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 FormattedRelative extends React$Component<
|
||||
$npm$ReactIntl$RelativeFormatOptions & {
|
||||
value: $npm$ReactIntl$DateParseable,
|
||||
format?: string,
|
||||
updateInterval?: number,
|
||||
initialNow?: $npm$ReactIntl$DateParseable,
|
||||
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 type IntlShape = $npm$ReactIntl$IntlShape;
|
||||
declare type MessageDescriptor = $npm$ReactIntl$MessageDescriptor;
|
||||
}
|
@ -1,27 +1,27 @@
|
||||
// @flow
|
||||
import type { Node } from 'react';
|
||||
import type { Location } from 'react-router';
|
||||
import type { OauthAppResponse } from 'services/api/oauth';
|
||||
import React, { Component } from 'react';
|
||||
import { FormattedMessage as Message } from 'react-intl';
|
||||
import { Helmet } from 'react-helmet';
|
||||
import { connect } from 'react-redux';
|
||||
import { withRouter } from 'react-router';
|
||||
import { create as createPopup } from 'components/ui/popup/actions';
|
||||
import ContactForm from 'components/contact/ContactForm';
|
||||
import { LinkButton } from 'components/ui/form';
|
||||
import { COLOR_GREEN, COLOR_BLUE } from 'components/ui';
|
||||
import { restoreScroll } from 'components/ui/scroll/scroll';
|
||||
|
||||
import styles from './applicationsIndex.scss';
|
||||
import messages from './ApplicationsIndex.intl.json';
|
||||
import cubeIcon from './icons/cube.svg';
|
||||
import loadingCubeIcon from './icons/loading-cube.svg';
|
||||
import toolsIcon from './icons/tools.svg';
|
||||
|
||||
import ApplicationItem from './ApplicationItem';
|
||||
|
||||
import { LinkButton } from 'components/ui/form';
|
||||
import { COLOR_GREEN, COLOR_BLUE } from 'components/ui';
|
||||
import { restoreScroll } from 'components/ui/scroll/scroll';
|
||||
|
||||
import type { Node } from 'react';
|
||||
import type { OauthAppResponse } from 'services/api/oauth';
|
||||
|
||||
type Props = {
|
||||
location: {
|
||||
hash: string,
|
||||
},
|
||||
location: Location,
|
||||
displayForGuest: bool,
|
||||
applications: Array<OauthAppResponse>,
|
||||
isLoading: bool,
|
||||
@ -39,12 +39,14 @@ class ApplicationsIndex extends Component<Props, State> {
|
||||
expandedApp: null,
|
||||
};
|
||||
|
||||
appsRefs = {};
|
||||
appsRefs: {[key: string]: ?HTMLDivElement} = {};
|
||||
|
||||
componentDidUpdate(prevProps: Props) {
|
||||
const { applications, isLoading, location } = this.props;
|
||||
|
||||
if (isLoading !== prevProps.isLoading && applications.length) {
|
||||
const hash = location.hash.substr(1);
|
||||
|
||||
if (hash !== '' && applications.some((app) => app.clientId === hash)) {
|
||||
requestAnimationFrame(() => this.onTileClick(hash));
|
||||
}
|
||||
@ -56,6 +58,7 @@ class ApplicationsIndex extends Component<Props, State> {
|
||||
const { expandedApp } = this.state;
|
||||
|
||||
let content: Node;
|
||||
|
||||
if (displayForGuest) {
|
||||
content = (
|
||||
<div className={styles.emptyState}>
|
||||
@ -174,6 +177,7 @@ class ApplicationsIndex extends Component<Props, State> {
|
||||
|
||||
onTileClick = (clientId: string) => {
|
||||
const expandedApp = this.state.expandedApp === clientId ? null : clientId;
|
||||
|
||||
this.setState({expandedApp}, () => {
|
||||
if (expandedApp !== null) {
|
||||
// TODO: @SleepWalker: мб у тебя есть идея, как это сделать более правильно и менее дёргано?
|
||||
@ -184,15 +188,11 @@ class ApplicationsIndex extends Component<Props, State> {
|
||||
|
||||
onContact = (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
this.props.createContactPopup();
|
||||
};
|
||||
}
|
||||
|
||||
import { connect } from 'react-redux';
|
||||
import { withRouter } from 'react-router';
|
||||
import { create as createPopup } from 'components/ui/popup/actions';
|
||||
import ContactForm from 'components/contact/ContactForm';
|
||||
|
||||
export default withRouter(connect(null, {
|
||||
createContactPopup: () => createPopup(ContactForm),
|
||||
})(ApplicationsIndex));
|
||||
|
@ -1,24 +1,19 @@
|
||||
// @flow
|
||||
import type { Color, Skin } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
import React from 'react';
|
||||
|
||||
import classNames from 'classnames';
|
||||
|
||||
import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
|
||||
import { omit } from 'functions';
|
||||
|
||||
import styles from './form.scss';
|
||||
import FormInputComponent from './FormInputComponent';
|
||||
|
||||
import type { Color, Skin } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
|
||||
export default class Checkbox extends FormInputComponent<{
|
||||
color: Color,
|
||||
skin: Skin,
|
||||
label: string | MessageDescriptor,
|
||||
}> {
|
||||
static displayName = 'Checkbox';
|
||||
|
||||
static defaultProps = {
|
||||
color: COLOR_GREEN,
|
||||
skin: SKIN_DARK,
|
||||
|
@ -1,8 +1,8 @@
|
||||
// @flow
|
||||
import type { Skin, Color } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
import React from 'react';
|
||||
|
||||
import classNames from 'classnames';
|
||||
|
||||
import { uniqueId, omit } from 'functions';
|
||||
import copy from 'services/copy';
|
||||
import icons from 'components/ui/icons.scss';
|
||||
@ -11,10 +11,7 @@ import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
|
||||
import styles from './form.scss';
|
||||
import FormInputComponent from './FormInputComponent';
|
||||
|
||||
import type { Skin, Color } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
|
||||
let copiedStateTimeout;
|
||||
let copiedStateTimeout: ?TimeoutID;
|
||||
|
||||
export default class Input extends FormInputComponent<{
|
||||
skin: Skin,
|
||||
@ -29,8 +26,6 @@ export default class Input extends FormInputComponent<{
|
||||
}, {
|
||||
wasCopied: bool,
|
||||
}> {
|
||||
static displayName = 'Input';
|
||||
|
||||
static defaultProps = {
|
||||
color: COLOR_GREEN,
|
||||
skin: SKIN_DARK,
|
||||
@ -69,6 +64,7 @@ export default class Input extends FormInputComponent<{
|
||||
props.placeholder = this.formatMessage(props.placeholder);
|
||||
|
||||
let baseClass = styles.formRow;
|
||||
|
||||
if (icon) {
|
||||
baseClass = styles.formIconRow;
|
||||
icon = (
|
||||
|
@ -1,11 +1,11 @@
|
||||
// @flow
|
||||
import type { ElementProps } from 'react';
|
||||
import React from 'react';
|
||||
import type {ElementProps} from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import Button from './Button';
|
||||
|
||||
export default function LinkButton(props: ElementProps<typeof Button> | ElementProps<typeof Link>) {
|
||||
export default function LinkButton(props: ElementProps<typeof Button> & ElementProps<typeof Link>) {
|
||||
const {to, ...restProps} = props;
|
||||
|
||||
return (
|
||||
|
@ -1,24 +1,19 @@
|
||||
// @flow
|
||||
import type { Color, Skin } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
import React from 'react';
|
||||
|
||||
import classNames from 'classnames';
|
||||
|
||||
import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
|
||||
import { omit } from 'functions';
|
||||
|
||||
import styles from './form.scss';
|
||||
import FormInputComponent from './FormInputComponent';
|
||||
|
||||
import type { Color, Skin } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
|
||||
export default class Radio extends FormInputComponent<{
|
||||
color: Color,
|
||||
skin: Skin,
|
||||
label: string | MessageDescriptor,
|
||||
}> {
|
||||
static displayName = 'Radio';
|
||||
|
||||
static defaultProps = {
|
||||
color: COLOR_GREEN,
|
||||
skin: SKIN_DARK,
|
||||
|
@ -1,25 +1,22 @@
|
||||
// @flow
|
||||
import type { Skin, Color } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
import React from 'react';
|
||||
import TextareaAutosize from 'react-textarea-autosize';
|
||||
|
||||
import classNames from 'classnames';
|
||||
|
||||
import { uniqueId, omit } from 'functions';
|
||||
import { SKIN_DARK, COLOR_GREEN } from 'components/ui';
|
||||
|
||||
import styles from './form.scss';
|
||||
import FormInputComponent from './FormInputComponent';
|
||||
|
||||
import type { Skin, Color } from 'components/ui';
|
||||
import type { MessageDescriptor } from 'react-intl';
|
||||
|
||||
type TextareaAutosizeProps = {
|
||||
onHeightChange?: (number, TextareaAutosizeProps) => void,
|
||||
useCacheForDOMMeasurements?: bool,
|
||||
minRows?: number,
|
||||
maxRows?: number,
|
||||
inputRef?: (HTMLTextAreaElement) => void,
|
||||
} | HTMLTextAreaElement;
|
||||
inputRef?: (?HTMLTextAreaElement) => void,
|
||||
};
|
||||
|
||||
export default class TextArea extends FormInputComponent<{
|
||||
placeholder?: string | MessageDescriptor,
|
||||
@ -27,9 +24,7 @@ export default class TextArea extends FormInputComponent<{
|
||||
error?: string,
|
||||
skin: Skin,
|
||||
color: Color,
|
||||
} | TextareaAutosizeProps> {
|
||||
static displayName = 'TextArea';
|
||||
|
||||
} & TextareaAutosizeProps> {
|
||||
static defaultProps = {
|
||||
color: COLOR_GREEN,
|
||||
skin: SKIN_DARK,
|
||||
|
@ -25,7 +25,8 @@ b {
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
|
||||
a, .textLink {
|
||||
a,
|
||||
.textLink {
|
||||
color: #444;
|
||||
border-bottom: 1px dotted #444;
|
||||
text-decoration: none;
|
||||
|
@ -1,30 +1,26 @@
|
||||
// @flow
|
||||
import React, { Component } from 'react';
|
||||
import React from 'react';
|
||||
import { Redirect, Route, Switch } from 'react-router-dom';
|
||||
import { FooterMenu } from 'components/footerMenu';
|
||||
|
||||
import styles from './dev.scss';
|
||||
|
||||
import ApplicationsListPage from './ApplicationsListPage';
|
||||
import CreateNewApplicationPage from './CreateNewApplicationPage';
|
||||
import UpdateApplicationPage from './UpdateApplicationPage';
|
||||
|
||||
import { FooterMenu } from 'components/footerMenu';
|
||||
export default function DevPage() {
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<Switch>
|
||||
<Route path="/dev/applications" exact component={ApplicationsListPage} />
|
||||
<Route path="/dev/applications/new" exact component={CreateNewApplicationPage} />
|
||||
<Route path="/dev/applications/:clientId" component={UpdateApplicationPage} />
|
||||
<Redirect to="/dev/applications" />
|
||||
</Switch>
|
||||
|
||||
export default class DevPage extends Component<{}> {
|
||||
render() {
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
<Switch>
|
||||
<Route path="/dev/applications" exact component={ApplicationsListPage} />
|
||||
<Route path="/dev/applications/new" exact component={CreateNewApplicationPage} />
|
||||
<Route path="/dev/applications/:clientId" component={UpdateApplicationPage} />
|
||||
<Redirect to="/dev/applications" />
|
||||
</Switch>
|
||||
|
||||
<div className={styles.footer}>
|
||||
<FooterMenu />
|
||||
</div>
|
||||
<div className={styles.footer}>
|
||||
<FooterMenu />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -33,6 +33,7 @@ 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)
|
||||
|
Loading…
Reference in New Issue
Block a user