started creating login register dialog

src/components/dialogs/DialogTitle/index.tsx

@@ -0,0 +1,10 @@
+import React, { FC, ReactNode } from 'react';
+import styles from './styles.scss';
+
+interface IProps {
+  children: ReactNode;
+}
+
+const DialogTitle: FC<IProps> = ({ children }) => <h2 className={styles.title}>{children}</h2>;
+
+export { DialogTitle };

src/components/dialogs/DialogTitle/styles.scss

@@ -0,0 +1,4 @@
+.title {
+  margin: $gap 0 $gap * 4 !important;
+  text-transform: uppercase;
+}

src/containers/dialogs/LoginDialog/index.tsx

@@ -17,6 +17,7 @@ import { ISocialProvider } from '~/redux/auth/types';
 import pick from 'ramda/es/pick';
 import { LoginDialogButtons } from '~/containers/dialogs/LoginDialogButtons';
 import { IOAuthEvent, OAUTH_EVENT_TYPES } from '~/redux/types';
+import { DialogTitle } from '~/components/dialogs/DialogTitle';
 
 const mapStateToProps = state => ({
   ...pick(['error', 'is_registering'], selectAuthLogin(state)),
@@ -103,7 +104,7 @@ const LoginDialogUnconnected: FC<IProps> = ({
           <Padder>
             <div className={styles.wrap}>
               <Group>
-                <h2>РЕШИТЕЛЬНО ВОЙТИ</h2>
+                <DialogTitle>Решительно войти</DialogTitle>
 
                 <InputText title="Логин" handler={setUserName} value={username} autoFocus />
 

src/containers/dialogs/LoginDialog/styles.scss

@@ -12,10 +12,6 @@ $vk_color: $secondary_color;
   button {
     text-align: left;
   }
-
-  h2 {
-    margin: $gap 0 $gap * 4 !important;
-  }
 }
 
 .secondary_button {

src/containers/dialogs/LoginSocialRegisterDialog/index.tsx

@@ -1,16 +1,35 @@
-import React, { FC } from 'react';
+import React, { FC, useState } from 'react';
 import { connect } from 'react-redux';
 import { IDialogProps } from '~/redux/modal/constants';
 import { BetterScrollDialog } from '~/containers/dialogs/BetterScrollDialog';
+import { Padder } from '~/components/containers/Padder';
+import { DialogTitle } from '~/components/dialogs/DialogTitle';
+import { Group } from '~/components/containers/Group';
+import { InputText } from '~/components/input/InputText';
+import styles from './styles.scss';
 
 const mapStateToProps = () => ({});
 const mapDispatchToProps = {};
 
 type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & IDialogProps & {};
 
-const LoginSocialRegisterDialogUnconnected: FC<Props> = ({ onRequestClose }) => (
-  <BetterScrollDialog onClose={onRequestClose}>NEEDS REGISTER!</BetterScrollDialog>
-);
+const LoginSocialRegisterDialogUnconnected: FC<Props> = ({ onRequestClose }) => {
+  const [username, setUsername] = useState('');
+
+  return (
+    <BetterScrollDialog onClose={onRequestClose} width={300}>
+      <Padder>
+        <div className={styles.wrap}>
+          <Group>
+            <DialogTitle>Добро пожаловать в семью!</DialogTitle>
+            <InputText handler={setUsername} value={username} title="Юзернэйм" />
+            <InputText handler={setUsername} value={username} title="Пароль" type="password" />
+          </Group>
+        </div>
+      </Padder>
+    </BetterScrollDialog>
+  );
+};
 
 const LoginSocialRegisterDialog = connect(
   mapStateToProps,

src/containers/dialogs/LoginSocialRegisterDialog/styles.scss

@@ -0,0 +1,3 @@
+.wrap {
+  padding: $gap $gap 30px $gap;
+}

src/redux/types.ts

@@ -217,6 +217,5 @@ export type IOAuthEvent = {
   payload: {
     token: string;
     error: string;
-    needs_register: boolean;
   };
 };