сверстано окно доп параметров для адаптива, сверстан выбор языка, начата верстка окна Поделиться

2022-08-11 13:19:47 +05:00
parent 6cbd7fdd14
commit b18640a99d
16 changed files with 299 additions and 52 deletions
@@ -1,31 +1,65 @@
 import React from "react";
 import { SettingButton } from "./settingButton";
+import langIcon from './icons/languageIcon.svg';
+import shareIcon from './icons/shareIcon.svg';
+import pointerIcon from './icons/pointer2Icon.svg';
+import exitIcon from './icons/exitIcon.svg';
+import { LangButton } from "./langButton";

 type TProps = {
-
+    type: 'other' | 'selectLang'
+    onClickShare?: () => void
+    onClickChangeLang?: () => void
+    onClickSelectLang?: () => void
+    onClickExit?: () => void
 }

 export const SettingButtons:React.FC<TProps> = React.memo((props) => {
    return <div className="setting-buttons-container">
        <div className="setting-buttons-row">
-            <SettingButton
-                text="Пригласить"
-                icon={''}
-                onClick={() => null}
-            />
-            <SettingButton
-                text="Язык"
-                helpText="Русский"
-                icon={''}
-                helpIcon={''}
-                onClick={() => null}
-            />
+            {
+                props.type === 'other' ?
+                <>
+                    <SettingButton
+                        text="Пригласить"
+                        icon={shareIcon}
+                        helpIcon={pointerIcon}
+                        onClick={props.onClickShare}
+                    />
+                    <SettingButton
+                        text="Язык"
+                        helpText="Русский"
+                        icon={langIcon}
+                        helpIcon={pointerIcon}
+                        onClick={props.onClickChangeLang}
+                    />
+                </>
+                :
+                <>
+                    <LangButton 
+                        title="Русский"
+                        caption="Русский"
+                        isSelected={true}
+                        onClick={props.onClickSelectLang}
+                    />
+                    <LangButton 
+                        title="English"
+                        caption="Английский"
+                        isSelected={false}
+                        onClick={props.onClickSelectLang}
+                    />
+                </>
+            }
        </div>
-        <SettingButton 
-            text="Выйти"
-            isExitButton={true}
-            icon={''}
-            onClick={() => null}
-        />
+        {
+            props.type === 'other' ?
+            <SettingButton 
+                text="Выйти"
+                isExitButton={true}
+                icon={exitIcon}
+                onClick={props.onClickExit}
+            />
+            : null
+        }
    </div>
 })