добавлена аналогичная эмуляция кнопки передачи контроля, fix control button height in mobile

src/components/mainScreen/mobileAddPart/addPartUserItem.tsx

@@ -1,8 +1,9 @@
-import React from "react";
+import React, { useState } from "react";
 import { ToolbarButton } from "../toolbar/toolbarButton";
 import { TypeToolbarButtons } from "../toolbar/typeButtons";
 import { BorderLine } from "./borderLine";
 import { CaptionToolbarButtons } from "../toolbar/typeCaptionButtons";
+import { ControlButton } from "../toolbar/controlButton";
 
 type TProps = {
     typeUser: TypeToolbarButtons
@@ -12,6 +13,16 @@ type TProps = {
 }
 
 export const AddPartUserItem:React.FC<TProps> = React.memo((props) => {
+    const controlStates = ['default', 'questing', 'return', 'questing'];// temp
+    const [currentControlState, setCurrentControlState] = useState<number>(0); // temp
+
+    // temp
+    function nextControlState() {
+        if(currentControlState + 1 < controlStates.length)
+            setCurrentControlState(currentControlState + 1);
+        else setCurrentControlState(0);
+    }
+
     return <div className="user-item" onClick={() => props?.onClickItem ? props?.onClickItem() : null}>
         <ToolbarButton
             type={props.typeUser}
@@ -32,13 +43,56 @@ export const AddPartUserItem:React.FC<TProps> = React.memo((props) => {
                             isCaption={false}
                             onClick={() => props?.onClickMicro ? props?.onClickMicro() : null}
                         />                        
-                        <ToolbarButton
+                        {
-                            type="control"
+                            // temp
-                            active={false}
+                            currentControlState === 0
-                            caption=''
+                            ? <ControlButton
-                            isCaption={false}
+                                onClick={() => nextControlState()}
-                            onClick={() => props?.onClickControl ? props?.onClickControl() : null }
+                                state={"default"}
+                                userType={'admin'}
                             />
+                            : currentControlState === 1
+                            ? <>
+                                <ToolbarButton
+                                    onClick={() => nextControlState()}
+                                    type={"no"}
+                                    caption={''}
+                                    isCaption={false}
+                                    size={"medium"}
+                                />
+                                <ToolbarButton
+                                    onClick={() => nextControlState()}
+                                    type={"yes"}
+                                    caption={''}
+                                    isCaption={false}
+                                    size={"medium"}
+                                />
+                            </>
+                            : currentControlState === 2
+                            ? <ControlButton
+                                onClick={() => nextControlState()}
+                                state={"waiting"}
+                                userType={'admin'}
+                            />
+                            : currentControlState === 3
+                            ? <>
+                                <ToolbarButton
+                                    onClick={() => nextControlState()}
+                                    type={"no"}
+                                    caption={''}
+                                    isCaption={false}
+                                    size={"medium"}
+                                />
+                                <ToolbarButton
+                                    onClick={() => nextControlState()}
+                                    type={"yes"}
+                                    caption={''}
+                                    isCaption={false}
+                                    size={"medium"}
+                                />
+                            </>
+                            : null
+                        }                        
                     </div>
                     : null
                 }

src/components/mainScreen/toolbar/buttonContainer.tsx

@@ -15,15 +15,17 @@ type TProps = {
         active?: boolean,
         isSelected?: boolean
     }>
+    isOpenToolbar: boolean
     isBorderLineTop?: 'hide' | 'show'
     isBorderLineBottom?: 'hide' | 'show'
 }
 
 export const ButtonContainer:React.FC<TProps> = React.memo((props) => { 
+    const windowHeight = useContext(ContextWindowHeight);
     const [openedAddButtons, setOpenedAddButtons] = useState<string>('');
     const controlStates = ['default', 'questing', 'return', 'questing'];// temp
     const [currentControlState, setCurrentControlState] = useState<number>(0); // temp
-    const windowHeight = useContext(ContextWindowHeight);
+    const typeUser = 'admin' // 'user' // temp
 
     // temp
     function nextControlState() {
@@ -63,7 +65,7 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                 />
                 {
                     button.type.includes('user') && windowHeight > 700 ?
-                    <div className={`toolbar-open-add-button-container ${openedAddButtons === button.type + index + 'areacont' ? 'show' : ''}`}>
+                    <div className={`toolbar-open-add-button-container ${openedAddButtons === button.type + index + 'areacont' && props.isOpenToolbar ? 'show' : ''}`}>
                         <ToolbarButton
                             // key={button.type + index}
                             onClick={() => onClick()} 
@@ -86,7 +88,7 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                             ? <ControlButton
                                 onClick={() => nextControlState()}
                                 state={"default"}
-                                userType={'admin'}
+                                userType={typeUser}
                             />
                             : currentControlState === 1
                             ? <>
@@ -108,8 +110,8 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                             : currentControlState === 2
                             ? <ControlButton
                                 onClick={() => nextControlState()}
-                                state={"return"}
+                                state={"waiting"}
-                                userType={'admin'}
+                                userType={typeUser}
                             />
                             : currentControlState === 3
                             ? <>
@@ -136,7 +138,7 @@ export const ButtonContainer:React.FC<TProps> = React.memo((props) => {
                 }
                 {
                     button.type.includes('language') && windowHeight > 700 ?
-                    <div className={`toolbar-open-add-button-container ${openedAddButtons === button.type + index + 'areacont' ? 'show' : ''}`}>
+                    <div className={`toolbar-open-add-button-container ${openedAddButtons === button.type + index + 'areacont' && props.isOpenToolbar ? 'show' : ''}`}>
                         <ToolbarButton
                             onClick={() => {onClick(); button.onClick()}} 
                             type={button.type} 

src/components/mainScreen/toolbar/toolbar.css

@@ -367,7 +367,7 @@
     box-sizing: border-box;
     display: flex;
     width: 196px;
-    height: 44px;
+    height: 40px;
     border-radius: 50px;
     justify-content: center;
     align-items: center;
@@ -446,4 +446,8 @@
     .toolbar-button:active {
         opacity: .7;
     }
+
+    .control-button {
+        height: 44px;
+    }
 }

src/components/mainScreen/toolbar/toolbar.tsx

@@ -48,6 +48,7 @@ export const Toolbar:React.FC<TProps> = React.memo((props) => {
                                 isSelected: props?.isOpenUsersMobilePart
                             }
                         ]}
+                    isOpenToolbar={props.isOpen}
                     />
                 </div>
                 <div className="toolbar-field-part">
@@ -66,6 +67,7 @@ export const Toolbar:React.FC<TProps> = React.memo((props) => {
                                 isCaption: false
                             }                        
                         ]}
+                        isOpenToolbar={props.isOpen}
                     />                    
                     {/* <BorderLine /> */}
                     <ToolbarButton 
@@ -122,6 +124,7 @@ export const Toolbar:React.FC<TProps> = React.memo((props) => {
                             isCaption: true
                         }
                     ]}
+                    isOpenToolbar={props.isOpen}
                 />
             </div>
             <div className="toolbar-field-part">
@@ -140,6 +143,7 @@ export const Toolbar:React.FC<TProps> = React.memo((props) => {
                             isCaption: true
                         }                        
                     ]}
+                    isOpenToolbar={props.isOpen}
                 />
                 <ButtonContainer
                     buttons={[
@@ -156,6 +160,7 @@ export const Toolbar:React.FC<TProps> = React.memo((props) => {
                         }
                     ]}
                     isBorderLineTop={"hide"}
+                    isOpenToolbar={props.isOpen}
                 />
                  {/* <ToolbarButton 
                     type="share"