don't show text for icon buttons when in mobile mode

packages/nc-gui/components/smartsheet/qr-scanner-button/QrScannerButton.vue

@@ -14,6 +14,8 @@ const router = useRouter()
 const { $api } = useNuxtApp()
 const { project } = useProject()
 
+const { isMobileMode } = useGlobal()
+
 const view = inject(ActiveViewInj, ref())
 
 const codeFieldOptions = computed<SelectProps['options']>(
@@ -94,7 +96,7 @@ const onDecode = async (codeValue: string) => {
     <a-button class="nc-btn-share-view nc-toolbar-btn" @click="showCodeScannerOverlay = true">
       <div class="flex items-center gap-1">
         <QrCodeScan />
-        <span class="!text-sm font-weight-normal"> {{ $t('activity.scanCode') }}</span>
+        <span v-if="!isMobileMode" class="!text-sm font-weight-normal"> {{ $t('activity.scanCode') }}</span>
       </div>
     </a-button>
     <a-modal

packages/nc-gui/components/smartsheet/toolbar/ColumnFilterMenu.vue

@@ -29,6 +29,8 @@ const { $e } = useNuxtApp()
 
 const { nestedFilters } = useSmartsheetStoreOrThrow()
 
+const { isMobileMode } = useGlobal()
+
 // todo: avoid duplicate api call by keeping a filter store
 const { nonDeletedFilters, loadFilters } = useViewFilters(
   activeView!,
@@ -76,7 +78,7 @@ useMenuCloseOnEsc(open)
         <div class="flex items-center gap-1">
           <MdiFilterOutline />
           <!-- Filter -->
-          <span class="text-capitalize !text-sm font-weight-normal">{{ $t('activity.filter') }}</span>
+          <span v-if="!isMobileMode" class="text-capitalize !text-sm font-weight-normal">{{ $t('activity.filter') }}</span>
           <MdiMenuDown class="text-grey" />
 
           <span v-if="filtersLength" class="nc-count-badge">{{ filtersLength }}</span>

packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue

@@ -31,6 +31,8 @@ const reloadViewMetaHook = inject(ReloadViewMetaHookInj)!
 
 const rootFields = inject(FieldsInj)
 
+const { isMobileMode } = useGlobal()
+
 const isLocked = inject(IsLockedInj, ref(false))
 
 const isPublic = inject(IsPublicInj, ref(false))
@@ -144,7 +146,7 @@ useMenuCloseOnEsc(open)
           <MdiEyeOffOutline />
 
           <!-- Fields -->
-          <span class="text-capitalize !text-sm font-weight-normal">{{ $t('objects.fields') }}</span>
+          <span v-if="!isMobileMode" class="text-capitalize !text-sm font-weight-normal">{{ $t('objects.fields') }}</span>
 
           <MdiMenuDown class="text-grey" />
 

packages/nc-gui/components/smartsheet/toolbar/ShareView.vue

@@ -34,6 +34,8 @@ const { isUIAllowed } = useUIPermission()
 
 const { isSharedBase } = useProject()
 
+const { isMobileMode } = useGlobal()
+
 let showShareModel = $ref(false)
 
 const passwordProtected = ref(false)
@@ -230,7 +232,7 @@ const copyIframeCode = async () => {
       <div class="flex items-center gap-1">
         <MdiOpenInNew />
         <!-- Share View -->
-        <span class="!text-sm font-weight-normal"> {{ $t('activity.shareView') }}</span>
+        <span v-if="!isMobileMode" class="!text-sm font-weight-normal"> {{ $t('activity.shareView') }}</span>
       </div>
     </a-button>
 

packages/nc-gui/components/smartsheet/toolbar/SortListMenu.vue

@@ -24,6 +24,8 @@ const { eventBus } = useSmartsheetStoreOrThrow()
 
 const { sorts, saveOrUpdate, loadSorts, addSort, deleteSort } = useViewSorts(view, () => reloadDataHook?.trigger())
 
+const { isMobileMode } = useGlobal()
+
 eventBus.on((event) => {
   if (event === SmartsheetStoreEvents.SORT_RELOAD) {
     loadSorts()
@@ -66,7 +68,7 @@ useMenuCloseOnEsc(open)
           <MdiSort />
 
           <!-- Sort -->
-          <span class="text-capitalize !text-sm font-weight-normal">{{ $t('activity.sort') }}</span>
+          <span v-if="!isMobileMode" class="text-capitalize !text-sm font-weight-normal">{{ $t('activity.sort') }}</span>
           <MdiMenuDown class="text-grey" />
 
           <span v-if="sorts?.length" class="nc-count-badge">{{ sorts.length }}</span>

packages/nc-gui/components/tabs/auth/user-management/UsersModal.vue

@@ -38,6 +38,8 @@ const { t } = useI18n()
 
 const { project } = useProject()
 
+const { isMobileMode } = useGlobal()
+
 const { $api, $e } = useNuxtApp()
 
 const { copy } = useCopy()
@@ -153,7 +155,7 @@ const emailField = (inputEl: typeof Input) => {
   >
     <div class="flex flex-col" data-testid="invite-user-and-share-base-modal">
       <div class="flex flex-row justify-between items-center pb-1.5 mb-2 border-b-1 w-full">
-        <a-typography-title class="select-none" :level="4"> {{ $t('activity.share') }}: {{ project.title }} </a-typography-title>
+        <a-typography-title v-if="!isMobileMode" class="select-none" :level="4"> {{ $t('activity.share') }}: {{ project.title }} </a-typography-title>
 
         <a-button
           type="text"