Fix Bug 48186 doc

apps/documenteditor/mobile/src/view/edit/EditTable.jsx

@@ -173,40 +173,25 @@ const PageWrap = props => {
 
 // Style
 
-const StyleTemplates = inject("storeFocusObjects")(observer(({templates, onStyleClick, storeFocusObjects}) => {
+const StyleTemplates = inject("storeFocusObjects","storeTableSettings")(observer(({onStyleClick,storeTableSettings,storeFocusObjects}) => {
     const tableObject = storeFocusObjects.tableObject;
     const styleId = tableObject && tableObject.get_TableStyle();
     const [stateId, setId] = useState(styleId);
-
+    const styles =  storeTableSettings.styles;
-    const widthContainer = document.querySelector(".page-content").clientWidth;
-    const columns = parseInt((widthContainer - 47) / 70); // magic
-    const styles = [];
-    let row = -1;
-    templates.forEach((style, index) => {
-        if (0 == index % columns) {
-            styles.push([]);
-            row++
-        }
-        styles[row].push(style);
-    });
 
     return (
         <div className="dataview table-styles">
-            {styles.map((row, rowIndex) => {
+            <ul className="row">
+                    {styles.map((style, index) => {
                         return (
-                    <div className="row" key={`row-${rowIndex}`}>
+                            <li key={index}
-                        {row.map((style, index)=>{
-                            return(
-                                <div key={`${rowIndex}-${index}`}
                                 className={style.templateId === stateId ? 'active' : ''}
                                 onClick={() => {onStyleClick(style.templateId); setId(style.templateId)}}>
                                 <img src={style.imageUrl}/>
-                                </div>
+                            </li>
-                            )
-                        })}
-                    </div>
                         )
                     })}
+            </ul>
         </div>
     )
 }));