From f792259dd568c48f0b6ec454b7d99bf6a4279bfa Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Fri, 19 Mar 2021 17:52:04 +0700
Subject: [PATCH] #23 added random signup phrase
---
.../input/Toggle/styles.module.scss | 1 +
.../LoginSocialRegisterDialog/index.tsx | 23 +++++++++++++++----
2 files changed, 20 insertions(+), 4 deletions(-)
diff --git a/src/components/input/Toggle/styles.module.scss b/src/components/input/Toggle/styles.module.scss
index c20b76bc..00060eab 100644
--- a/src/components/input/Toggle/styles.module.scss
+++ b/src/components/input/Toggle/styles.module.scss
@@ -3,6 +3,7 @@
.toggle {
height: 24px;
width: 48px;
+ flex: 0 0 48px;
border-radius: 12px;
background-color: transparentize(white, 0.9);
display: flex;
diff --git a/src/containers/dialogs/LoginSocialRegisterDialog/index.tsx b/src/containers/dialogs/LoginSocialRegisterDialog/index.tsx
index 64789120..ff210210 100644
--- a/src/containers/dialogs/LoginSocialRegisterDialog/index.tsx
+++ b/src/containers/dialogs/LoginSocialRegisterDialog/index.tsx
@@ -11,6 +11,7 @@ import { selectAuthRegisterSocial } from '~/redux/auth/selectors';
import * as AUTH_ACTIONS from '~/redux/auth/actions';
import { useCloseOnEscape } from '~/utils/hooks';
import { LoginSocialRegisterButtons } from '~/containers/dialogs/LoginSocialRegisterButtons';
+import { Toggle } from '~/components/input/Toggle';
const mapStateToProps = selectAuthRegisterSocial;
const mapDispatchToProps = {
@@ -21,6 +22,12 @@ const mapDispatchToProps = {
type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & IDialogProps & {};
+const phrase = [
+ 'Сушёный кабачок особенно хорош в это время года, знаете ли.',
+ 'Бывало, стреляешь по кабачку, или он стреляет в тебя.',
+ 'Он всегда рядом, кабачок -- первый сорт! Надежда империи.',
+];
+
const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
onRequestClose,
errors,
@@ -32,6 +39,7 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
}) => {
const [username, setUsername] = useState('');
const [password, setPassword] = useState('');
+ const [isDryingPants, setIsDryingPants] = useState(false);
const onSubmit = useCallback(
(event: FormEvent) => {
@@ -56,7 +64,7 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
useCloseOnEscape(onRequestClose);
return (
- <form onSubmit={onSubmit}>
+ <form onSubmit={onSubmit} autoComplete="new-password">
<BetterScrollDialog
onClose={onRequestClose}
width={300}
@@ -73,6 +81,7 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
value={username}
title="Юзернэйм"
error={errors.username}
+ autoComplete="new-password"
/>
<InputText
@@ -81,12 +90,18 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
title="Пароль"
type="password"
error={errors.password}
+ autoComplete="new-password"
/>
- <label className={styles.check}>
- <input type="checkbox" />
+ <div className={styles.check} onClick={() => setIsDryingPants(!isDryingPants)}>
+ <Toggle value={isDryingPants} color="primary" />
<span>Это не мои штаны сушатся на радиаторе в третьей лаборатории</span>
- </label>
+ </div>
+
+ <div className={styles.check} onClick={() => setIsDryingPants(!isDryingPants)}>
+ <Toggle value={!isDryingPants} color="primary" />
+ <span>{phrase[Math.floor(Math.random() * phrase.length)]}</span>
+ </div>
</Group>
</div>
</Padder>