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

added settings tab to profile

This commit is contained in:
Fedor Katurov 2020-11-17 18:00:03 +07:00
parent d9a1b5cf13
commit e28fdd2c05
10 changed files with 103 additions and 18 deletions

View file

@ -1,4 +1,4 @@
import React, { FC, useCallback, useEffect } from 'react';
import React, { FC, useCallback, useEffect, useState } from 'react';
import styles from './styles.module.scss';
import { SidebarWrapper } from '~/containers/sidebars/SidebarWrapper';
import { connect } from 'react-redux';
@ -6,10 +6,13 @@ import { selectAuthProfile, selectAuthUser } from '~/redux/auth/selectors';
import pick from 'ramda/es/pick';
import { ProfileSidebarInfo } from '~/components/profile/ProfileSidebarInfo';
import { Filler } from '~/components/containers/Filler';
import { useHistory, useRouteMatch } from 'react-router';
import { Route, Switch, useHistory, useRouteMatch } from 'react-router';
import * as USER_ACTIONS from '~/redux/auth/actions';
import { ProfileSidebarMenu } from '~/components/profile/ProfileSidebarMenu';
import { useCloseOnEscape } from '~/utils/hooks';
import { Icon } from '~/components/input/Icon';
import { ProfileSidebarSettings } from '~/components/profile/ProfileSidebarSettings';
import classNames from 'classnames';
const mapStateToProps = state => ({
profile: selectAuthProfile(state),
@ -23,7 +26,7 @@ const mapDispatchToProps = {
type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & {};
const ProfileSidebarUnconnected: FC<Props> = ({
profile: { is_loading, user, tab },
profile: { is_loading, user },
user: { id },
authLoadProfile,
}) => {
@ -39,13 +42,22 @@ const ProfileSidebarUnconnected: FC<Props> = ({
const history = useHistory();
const basePath = url.replace(new RegExp(`\/~${username}$`), '');
const onClose = useCallback(() => history.push(basePath), [basePath]);
useCloseOnEscape(onClose);
return (
<SidebarWrapper>
<div className={styles.wrap}>
<div className={styles.close} onClick={onClose}>
<Icon icon="close" size={32} />
</div>
<Switch>
<Route path={`${url}/settings`} component={ProfileSidebarSettings} />
</Switch>
<div className={classNames(styles.wrap, styles.secondary)}>
<ProfileSidebarInfo is_loading={is_loading} user={user} />
<ProfileSidebarMenu />
<ProfileSidebarMenu path={url} />
<Filler />
</div>
</SidebarWrapper>