diff --git a/apps/documenteditor/mobile/src/controller/add/AddTable.jsx b/apps/documenteditor/mobile/src/controller/add/AddTable.jsx
index c09d2cde8d..628f3ff8cc 100644
--- a/apps/documenteditor/mobile/src/controller/add/AddTable.jsx
+++ b/apps/documenteditor/mobile/src/controller/add/AddTable.jsx
@@ -79,17 +79,6 @@ class AddTableController extends Component {
         }).open();
     }
 
-    async componentDidMount() {
-        const storeTableSettings = this.props.storeTableSettings;
-
-        if(!storeTableSettings.arrayStylesDefault.length) {
-            const api = Common.EditorApi.get();
-            const tableStylesPreviews = await api.asc_getTableStylesPreviews(true);
-
-            storeTableSettings.setStyles(tableStylesPreviews, 'default');
-        }
-    }
-
     render () {
         return (
             <AddTable onStyleClick={this.onStyleClick} />
diff --git a/apps/documenteditor/mobile/src/view/add/Add.jsx b/apps/documenteditor/mobile/src/view/add/Add.jsx
index c394924f67..22395d8e9f 100644
--- a/apps/documenteditor/mobile/src/view/add/Add.jsx
+++ b/apps/documenteditor/mobile/src/view/add/Add.jsx
@@ -57,16 +57,24 @@ const routes = [
     }
 ];
 
-const AddLayoutNavbar = ({ tabs, inPopover }) => {
+const AddLayoutNavbar = ({ tabs, inPopover, storeTableSettings }) => {
     const isAndroid = Device.android;
     const { t } = useTranslation();
     const _t = t('Add', {returnObjects: true});
+
+    const getTableStylesPreviews = async () => {
+        if(!storeTableSettings.arrayStylesDefault.length) {
+            const api = Common.EditorApi.get();
+            setTimeout(() => storeTableSettings.setStyles(api.asc_getTableStylesPreviews(true), 'default'), 1);
+        }
+    };
+
     return (
         <Navbar>
             {tabs.length > 1 ?
                 <div className='tab-buttons tabbar'>
                     {tabs.map((item, index) =>
-                        <Link key={"de-link-" + item.id} tabLink={"#" + item.id} tabLinkActive={index === 0}>
+                        <Link key={"de-link-" + item.id} onClick={() => getTableStylesPreviews()} tabLink={"#" + item.id} tabLinkActive={index === 0}>
                             <Icon slot="media" icon={item.icon}></Icon>
                         </Link>)}
                     {isAndroid && <span className='tab-link-highlight' style={{width: 100 / tabs.lenght + '%'}}></span>}
@@ -90,7 +98,7 @@ const AddLayoutContent = ({ tabs }) => {
     )
 };
 
-const AddTabs = inject("storeFocusObjects")(observer(({storeFocusObjects, showPanels, style, inPopover, onCloseLinkSettings}) => {
+const AddTabs = inject("storeFocusObjects", "storeTableSettings")(observer(({storeFocusObjects, showPanels, storeTableSettings, style, inPopover, onCloseLinkSettings}) => {
     const { t } = useTranslation();
     const _t = t('Add', {returnObjects: true});
     const api = Common.EditorApi.get();
@@ -200,7 +208,7 @@ const AddTabs = inject("storeFocusObjects")(observer(({storeFocusObjects, showPa
     return (
         <View style={style} stackPages={true} routes={routes}>
             <Page pageContent={false}>
-                <AddLayoutNavbar tabs={tabs} inPopover={inPopover}/>
+                <AddLayoutNavbar tabs={tabs} inPopover={inPopover} storeTableSettings={storeTableSettings} />
                 <AddLayoutContent tabs={tabs} />
             </Page>
         </View>