muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00
Code Packages Activity Actions

started editor

Browse source
This commit is contained in:
muerwre 2019-08-06 18:55:19 +07:00
parent 203791b170
commit ee17b72a7f
4 changed files with 49 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/containers/dialogs/EditorDialog/index.tsx
View file

@ -1,4 +1,4 @@
import React, { FC } from 'react';
import React, { FC, useState, useCallback } from 'react';
import { ScrollDialog } from '../ScrollDialog';
import { IDialogProps } from '~/redux/modal/constants';
import { useCloseOnEscape } from '~/utils/hooks';
@ -6,22 +6,26 @@ import { Group } from '~/components/containers/Group';
import { InputText } from '~/components/input/InputText';
import { Button } from '../../../components/input/Button/index';
import { Padder } from '~/components/containers/Padder';
import * as styles from '~/containers/examples/HorizontalExample/styles.scss';
import * as styles from './styles.scss';
import { connect } from 'react-redux';
import { selectNode } from '~/redux/node/selectors';
import { ImageEditor } from '~/components/editors/ImageEditor';
const mapStateToProps = selectNode;
const mapDispatchToProps = {};
type IProps = IDialogProps & {};
type IProps = IDialogProps & ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & {};
const EditorDialogUnconnected: FC<IProps> = ({ onRequestClose }) => {
const title = <div>title</div>;
const EditorDialogUnconnected: FC<IProps> = ({ onRequestClose, editor }) => {
const [data, setData] = useState(editor);
const setTitle = useCallback(title => {
setData({ ...data, title });
}, [setData, data]);
const buttons = (
<Padder>
<Group horizontal>
<InputText title="Название" />
<InputText title="Название" value={data.title} handler={setTitle} />
<Button title="Сохранить" iconRight="check" />
</Group>
@ -32,13 +36,11 @@ const EditorDialogUnconnected: FC<IProps> = ({ onRequestClose }) => {
return (
<ScrollDialog buttons={buttons} width={860}>
<div className={styles.uploads}>
<div className={styles.cell} />
<div className={styles.cell} />
<div className={styles.cell} />
<div className={styles.cell} />
<div className={styles.cell} />
<div className={styles.cell} />
<div className={styles.editor}>
<ImageEditor
data={data}
setData={setData}
/>
</div>
</ScrollDialog>
);