moved components to TypeScript

This commit is contained in:
muerwre 2019-02-12 16:20:31 +07:00
parent 85b8860862
commit 0a01c91271
54 changed files with 2771 additions and 5134 deletions

View file

@ -1,5 +1,5 @@
// @flow
import React from 'react';
import * as React from 'react';
import { EditorPanel } from '$components/panels/EditorPanel';
import { Fills } from '$components/Fills';
@ -15,15 +15,20 @@ import { LeftDialog } from '$containers/LeftDialog';
import { TopLeftPanel } from '$components/panels/TopLeftPanel';
import { TopRightPanel } from '$components/panels/TopRightPanel';
import { LogoPreview } from '$components/logo/LogoPreview';
import { IStickerPack } from "$constants/stickers";
import { IDialogs } from "$constants/dialogs";
import { IModes } from "$constants/modes";
type Props = {
renderer_active: Boolean,
hideRenderer: Function,
mode: String,
dialog: String,
dialog_active: Boolean,
sticker: String,
set: String,
sticker: string,
renderer_active: boolean,
mode: keyof IModes,
dialog: keyof IDialogs,
dialog_active: boolean,
set: keyof IStickerPack,
hideRenderer: typeof hideRenderer,
setDialogActive: typeof setDialogActive,
}
const Component = (props: Props) => (
@ -37,7 +42,12 @@ const Component = (props: Props) => (
<LogoPreview />
<Cursor mode={props.mode} sticker={props.sticker} set={props.set} />
<LeftDialog dialog={props.dialog} dialog_active={props.dialog_active} setDialogActive={props.setDialogActive} />
<LeftDialog
dialog={props.dialog}
dialog_active={props.dialog_active}
setDialogActive={props.setDialogActive}
/>
{ props.renderer_active &&
<Renderer onClick={props.hideRenderer} />

View file

@ -1,30 +0,0 @@
// @flow
import React from 'react';
import { DIALOGS } from '$constants/dialogs';
import classnames from 'classnames';
import { AppInfoDialog } from '$components/dialogs/AppInfoDialog';
import { Icon } from '$components/panels/Icon';
import { MapListDialog } from '$components/dialogs/MapListDialog';
type Props = {
dialog: String,
dialog_active: Boolean,
setDialogActive: Function,
}
const LEFT_DIALOGS = {
[DIALOGS.MAP_LIST]: MapListDialog,
[DIALOGS.APP_INFO]: AppInfoDialog,
};
export const LeftDialog = ({ dialog, dialog_active, setDialogActive }: Props) => (
Object.keys(LEFT_DIALOGS).map(item => (
<div className={classnames('dialog', { active: dialog_active && (dialog === item) })} key={item}>
{ dialog && LEFT_DIALOGS[item] && React.createElement(LEFT_DIALOGS[item]) }
<div className="dialog-close-button" onClick={() => setDialogActive(false)}>
<Icon icon="icon-cancel-1" />
</div>
</div>
))
);

View file

@ -0,0 +1,36 @@
// @flow
import * as React from 'react';
import { DIALOGS, IDialogs } from '$constants/dialogs';
import * as classnames from 'classnames';
import { AppInfoDialog } from '$components/dialogs/AppInfoDialog';
import { Icon } from '$components/panels/Icon';
import { MapListDialog } from '$components/dialogs/MapListDialog';
import * as ActionCreators from "$redux/user/actions";
import { StatelessComponent } from "react";
interface Props {
dialog: keyof IDialogs,
dialog_active: Boolean,
setDialogActive: typeof ActionCreators.setDialogActive,
}
const LEFT_DIALOGS = {
[DIALOGS.MAP_LIST]: MapListDialog,
[DIALOGS.APP_INFO]: AppInfoDialog,
};
export const LeftDialog = ({ dialog, dialog_active, setDialogActive }: Props) => (
<React.Fragment>
{
Object.keys(LEFT_DIALOGS).map(item => (
<div className={classnames('dialog', { active: dialog_active && (dialog === item) })} key={item}>
{ dialog && LEFT_DIALOGS[item] && React.createElement(LEFT_DIALOGS[item]) }
<div className="dialog-close-button" onClick={() => setDialogActive(false)}>
<Icon icon="icon-cancel-1" />
</div>
</div>
))
}
</React.Fragment>
);