From f15891cd045c3d34236ad89f20f3eb2928f8e6ea Mon Sep 17 00:00:00 2001
From: Andrey Shimagin <andrey.shimagin@onlyoffice.com>
Date: Mon, 6 Jun 2022 11:03:59 +0300
Subject: [PATCH] [PE] Adding 'image-menu' for mobiles and refactoring

---
 .../mobile/src/controller/edit/EditText.jsx   |  2 +-
 .../mobile/src/view/edit/EditText.jsx         | 46 +++++++++++++------
 2 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/apps/presentationeditor/mobile/src/controller/edit/EditText.jsx b/apps/presentationeditor/mobile/src/controller/edit/EditText.jsx
index 1f30916a0..ce713e8a9 100644
--- a/apps/presentationeditor/mobile/src/controller/edit/EditText.jsx
+++ b/apps/presentationeditor/mobile/src/controller/edit/EditText.jsx
@@ -24,7 +24,7 @@ class EditTextController extends Component {
 
     closeModal() {
         if ( Device.phone ) {
-            f7.sheet.close('.edit-popover', true);
+            f7.sheet.close('#edit-sheet', true);
         } else {
             f7.popover.close('#edit-popover');
         }
diff --git a/apps/presentationeditor/mobile/src/view/edit/EditText.jsx b/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
index 6dfd0b213..d5b21cc87 100644
--- a/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
+++ b/apps/presentationeditor/mobile/src/view/edit/EditText.jsx
@@ -530,6 +530,24 @@ const PageBulletLinkSettings = (props) => {
     )
 }
 
+const PageAddImage = (props) => {
+    const { t } = useTranslation();
+    const _t = t('View.Edit', {returnObjects: true});
+
+    return (
+        <List className='bullet-menu-image'>
+            <ListItem title={_t.textPictureFromLibrary} onClick={props.onImageSelect}>
+                <Icon slot="media" icon="icon-image-library" />
+            </ListItem>
+            <ListItem title={_t.textPictureFromURL} link="#" onClick={() =>  
+                props.f7router.navigate('/edit-bullets-and-numbers/image-link/',
+                {props: {onInsertByUrl: props.onInsertByUrl}}) }>
+                <Icon slot="media" icon="icon-link" />
+            </ListItem>
+        </List>
+    )
+}
+
 const PageBullets = observer(props => {
     const { t } = useTranslation();
     const _t = t('View.Edit', {returnObjects: true});
@@ -574,19 +592,12 @@ const PageBullets = observer(props => {
                     </ListItem>
                 ))}
             </List>
-            { !Device.isPhone ? 
-                <List className='bullet-menu-image'>
-                    <ListItem title={_t.textPictureFromLibrary} onClick={props.onImageSelect}>
-                        <Icon slot="media" icon="icon-image-library" />
-                    </ListItem>
-                    <ListItem title={_t.textPictureFromURL} link="#" onClick={() =>  
-                    props.f7router.navigate('/edit-bullets-and-numbers/image-link/',
-                    {props: {onInsertByUrl: props.onInsertByUrl}}) }>
-                        <Icon slot="media" icon="icon-link" />
-                    </ListItem>
-                </List>
-
-                : null
+            { !Device.isPhone && 
+                <PageAddImage
+                    f7router={props.f7router} 
+                    onImageSelect={props.onImageSelect}
+                    onInsertByUrl={props.onInsertByUrl} 
+                />
             }
         </View>
     )
@@ -675,6 +686,15 @@ const PageBulletsAndNumbers = props => {
                         onInsertByUrl={props.onInsertByUrl}
                     />
                 </SwiperSlide>
+                { Device.phone &&
+                    <SwiperSlide> 
+                        <PageAddImage
+                            f7router={props.f7router}
+                            onImageSelect={props.onImageSelect}
+                            onInsertByUrl={props.onInsertByUrl}
+                        />
+                    </SwiperSlide>
+                }
             </Swiper>
         </Page>
     )