37 lines
1020 B
JavaScript
37 lines
1020 B
JavaScript
import React, { useState } from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
import PageHeader from './layout/PageHeader';
|
|
import Button from './common/Button';
|
|
import ChangePasswordForm from './forms/ChangePasswordForm';
|
|
import Modal from './common/Modal';
|
|
|
|
export default function ProfileSettings() {
|
|
const user = useSelector(state => state.user);
|
|
const [changePassword, setChangePassword] = useState(false);
|
|
const { user_id } = user;
|
|
|
|
return (
|
|
<>
|
|
<PageHeader>
|
|
<div>Profile</div>
|
|
<Button size="small" onClick={() => setChangePassword(true)}>
|
|
Change password
|
|
</Button>
|
|
</PageHeader>
|
|
<dl>
|
|
<dt>Username</dt>
|
|
<dd>{user.username}</dd>
|
|
</dl>
|
|
{changePassword && (
|
|
<Modal title="Change password">
|
|
<ChangePasswordForm
|
|
values={{ user_id }}
|
|
onSave={() => setChangePassword(false)}
|
|
onClose={() => setChangePassword(false)}
|
|
/>
|
|
</Modal>
|
|
)}
|
|
</>
|
|
);
|
|
}
|