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

removed all router-modals

Browse source
This commit is contained in:
Fedor Katurov 2022-01-09 20:27:23 +07:00
parent 85d20e5009
commit ffce400398
15 changed files with 99 additions and 143 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/components/bars/SubmitBar/index.tsx
View file

@ -1,26 +1,26 @@
import React, { FC, useCallback, useState } from 'react';
import { Icon } from '~/components/input/Icon';
import { Link } from 'react-router-dom';
import classNames from 'classnames';
import { useRouteMatch } from 'react-router';
import styles from './styles.module.scss';
import { useShowModal } from '~/hooks/modal/useShowModal';
import { Dialog } from '~/constants/modal';
interface Props {
isLab?: boolean;
}
const SubmitBar: FC<Props> = ({ isLab }) => {
const { url } = useRouteMatch();
const showModal = useShowModal(Dialog.CreateNode);
const [focused, setFocused] = useState(false);
const onFocus = useCallback(() => setFocused(true), [setFocused]);
const onBlur = useCallback(() => setFocused(false), [setFocused]);
const createUrl = useCallback(
(type: string) => {
return [url.replace(/\/$/, ''), 'create', type].join('/');
(type: string) => () => {
showModal({ type, isInLab: !!isLab });
},
[url]
[isLab, showModal]
);
const icon = isLab ? 'lab' : 'plus';
@ -28,21 +28,21 @@ const SubmitBar: FC<Props> = ({ isLab }) => {
return (
<div className={classNames(styles.wrap, { [styles.lab]: isLab })}>
<div className={classNames(styles.panel, { [styles.active]: focused })}>
<Link to={createUrl('image')} className={styles.link}>
<button onClick={createUrl('image')} className={styles.link}>
<Icon icon="image" size={32} />
</Link>
</button>
<Link to={createUrl('text')} className={styles.link}>
<button onClick={createUrl('text')} className={styles.link}>
<Icon icon="text" size={32} />
</Link>
</button>
<Link to={createUrl('video')} className={styles.link}>
<button onClick={createUrl('video')} className={styles.link}>
<Icon icon="video" size={32} />
</Link>
</button>
<Link to={createUrl('audio')} className={styles.link}>
<button onClick={createUrl('audio')} className={styles.link}>
<Icon icon="audio" size={32} />
</Link>
</button>
</div>
<button className={styles.button} onFocus={onFocus} onBlur={onBlur} type="button">