mirror of
https://github.com/muerwre/orchidmap-front.git
synced 2025-04-25 11:06:40 +07:00
moved components to TypeScript
This commit is contained in:
parent
85b8860862
commit
0a01c91271
54 changed files with 2771 additions and 5134 deletions
|
@ -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} />
|
|
@ -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>
|
||||
))
|
||||
);
|
36
src/containers/LeftDialog.tsx
Normal file
36
src/containers/LeftDialog.tsx
Normal 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>
|
||||
);
|
||||
|
Loading…
Add table
Add a link
Reference in a new issue