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

refactored settings screen

Browse source
This commit is contained in:
Fedor Katurov 2022-07-29 13:06:08 +07:00
parent 001bdbb196
commit d55222b3ad
8 changed files with 294 additions and 225 deletions
Download patch file Download diff file Expand all files Collapse all files

171
src/components/profile/ProfileSettings/index.tsx
View file

@ -1,156 +1,37 @@
import React, { FC } from 'react';
import { FC } from "react";
import classNames from 'classnames';
import { Filler } from "~/components/containers/Filler";
import { Group } from "~/components/containers/Group";
import { Padder } from "~/components/containers/Padder";
import { Button } from "~/components/input/Button";
import { UserSettingsView } from "~/containers/settings/UserSettingsView";
import {
SettingsProvider,
useSettings,
} from "~/utils/providers/SettingsProvider";
import { Superpower } from '~/components/boris/Superpower';
import { Filler } from '~/components/containers/Filler';
import { Group } from '~/components/containers/Group';
import { Button } from '~/components/input/Button';
import { InputText } from '~/components/input/InputText';
import { Textarea } from '~/components/input/Textarea';
import { ERROR_LITERAL } from '~/constants/errors';
import { ProfileAccounts } from '~/containers/profile/ProfileAccounts';
import { usePatchUser } from '~/hooks/auth/usePatchUser';
import { useUser } from '~/hooks/auth/useUser';
import { useSettingsForm } from '~/utils/providers/SettingsProvider';
import { has } from '~/utils/ramda';
const Form = ({ children }) => {
const { handleSubmit } = useSettings();
import styles from './styles.module.scss';
const getError = (error?: string) => (error && has(error, ERROR_LITERAL) ? error : undefined);
return <form onSubmit={handleSubmit}>{children}</form>;
};
const ProfileSettings: FC = () => {
const { user } = useUser();
const { save } = usePatchUser();
const { handleSubmit, values, errors, handleChange } = useSettingsForm(
{ ...user, password: '', newPassword: '' },
save
);
return (
<form className={styles.wrap} onSubmit={handleSubmit}>
<Group>
<Group horizontal className={styles.base_info}>
<Superpower>
<div className={classNames(styles.avatar, styles.pad)}>
<div className={styles.pad__title}>
<span>Фото</span>
<small>Будет здесь. Кстати, ты видишь это, потому что включил суперсилы в Борисе.</small>
</div>
</div>
</Superpower>
<SettingsProvider>
<Form>
<Padder>
<Group>
<UserSettingsView />
<Group className={styles.pad}>
<div className={styles.pad__title}>
<span>О себе</span>
</div>
<InputText
value={values.fullname}
handler={handleChange('fullname')}
title="Полное имя"
error={getError(errors.fullname)}
/>
<Textarea
value={values.description}
handler={handleChange('description')}
title="Описание"
/>
<div className={styles.small}>
Описание будет показываться при клике наведении на вашу аватарку.
</div>
<Group horizontal>
<Filler />
<Button title="Сохранить" type="submit" />
</Group>
</Group>
</Group>
<Superpower>
<div className={styles.pad}>
<div className={styles.pad__title}>
<span>Обложка</span>
<small>Будет здесь. Кстати, ты видишь это, потому что включил суперсилы в Борисе.</small>
<br />
<br />
<br />
<br />
<br />
</div>
</div>
</Superpower>
<Filler />
<Group className={classNames(styles.pad, styles.pad_danger)}>
<div className={styles.pad__title}>
<span>Логин и пароли</span>
</div>
<InputText
value={values.username}
handler={handleChange('username')}
title="Логин"
error={getError(errors.username)}
/>
<InputText
value={values.email}
handler={handleChange('email')}
title="E-mail"
error={getError(errors.email)}
/>
<InputText
value={values.newPassword}
handler={handleChange('newPassword')}
title="Новый пароль"
type="password"
error={getError(errors.newPassword)}
/>
<InputText
value={values.password}
handler={handleChange('password')}
title="Старый пароль"
type="password"
error={getError(errors.password)}
/>
<div className={styles.small}>
Чтобы изменить любое из этих полей, нужно ввести старый пароль.
</div>
<Filler />
</Group>
<Filler />
<Filler />
<div className={styles.pad}>
<div className={styles.pad__title}>
<span>Аккаунты</span>
</div>
<ProfileAccounts />
</div>
<Superpower>
<div className={styles.pad}>
<div className={styles.pad__title}>
<span>Всякие приятные штуковины</span>
<small>Будут здесь. Кстати, ты видишь это, потому что включил суперсилы в Борисе.</small>
<br />
</div>
</div>
</Superpower>
<Group horizontal className={styles.buttons}>
<Filler />
<Button title="Сохранить" type="submit" />
</Group>
</Group>
</form>
</Padder>
</Form>
</SettingsProvider>
);
};