[PE mobile] Added the ability to inser shapes

apps/presentationeditor/mobile/src/controller/add/AddShape.jsx

@@ -3,15 +3,31 @@ import { f7 } from 'framework7-react';
 import {Device} from '../../../../../common/mobile/utils/device';
 import {observer, inject} from "mobx-react";
 
-import { AddShape } from '../../view/add/AddShape';
+import AddShape from '../../view/add/AddShape';
 
 class AddShapeController extends Component {
     constructor (props) {
         super(props);
+        this.onShapeClick = this.onShapeClick.bind(this);
     }
+
+    closeModal () {
+        if ( Device.phone ) {
+            f7.sheet.close('.add-popup', true);
+        } else {
+            f7.popover.close('#add-popover');
+        }
+    }
+
+    onShapeClick (type) {
+        const api = Common.EditorApi.get();
+        api.AddShapeOnCurrentPage(type);
+        this.closeModal();
+    }
+
     render () {
         return (
-            <AddShape
+            <AddShape onShapeClick={this.onShapeClick}
             />
         )
     }

apps/presentationeditor/mobile/src/view/add/AddShape.jsx

@@ -5,11 +5,26 @@ import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
 
 const AddShape = props => {
+    const shapes = props.storeShapeSettings.getStyleGroups();
     return (
-        <Fragment>
-
-        </Fragment>
+        <div className={'dataview shapes'}>
+            {shapes.map((row, indexRow) => {
+                return (
+                    <ul className="row" key={'shape-row-' + indexRow}>
+                        {row.map((shape, index) => {
+                            return (
+                                <li key={'shape-' + indexRow + '-' + index} onClick={() => {props.onShapeClick(shape.type)}}>
+                                    <div className="thumb"
+                                         style={{WebkitMaskImage: `url('resources/img/shapes/${shape.thumb}')`}}>
+                                    </div>
+                                </li>
+                            )
+                        })}
+                    </ul>
+                )
+            })}
+        </div>
     )
 };
 
-export {AddShape};
+export default inject("storeShapeSettings")(observer(AddShape));