v11

src/boot/telegram-boot.ts

@@ -10,12 +10,43 @@ declare global {
 }
 
 export default defineBoot(({ app }) => {
-  if (window.Telegram?.WebApp) {
-    const webApp = window.Telegram.WebApp
-    webApp.ready()
-    sessionStorage.setItem('isTelegram', webApp.initData ? 'true' : 'false')
-    webApp.SettingsButton.isVisible = true
-    app.config.globalProperties.$tg = webApp
-    app.provide('tg', webApp)
+  const tg = window.Telegram?.WebApp
+
+  tg.ready()
+  sessionStorage.setItem('isTelegram', tg.initData ? 'true' : 'false')
+  
+  const platform = tg.platform.toLowerCase()
+  const isDesktopOrWeb = [
+    'tdesktop', 
+    'tdlib', 
+    'macos', 
+    'web', 
+    'weba', 
+    'webk'
+  ].includes(platform)
+  const isTablet = window.innerWidth > 1024
+  if (!isDesktopOrWeb && !isTablet) {
+    if (tg.isVersionAtLeast('8.0')) tg.requestFullscreen()
+      else tg.expand()
   }
+
+  tg.SettingsButton.show()
+  
+  app.config.globalProperties.$tg = tg
+  app.config.globalProperties.$isDesktop = isDesktopOrWeb || isTablet
+  app.config.globalProperties.$isMobile = !isDesktopOrWeb && !isTablet
+
+  app.provide('tg', tg)
 })
+
+/* flag use
+<div v-if="$isDesktop || isToolbarExpanded">
+  <q-tabs ...> </q-tabs>
+</div>
+
+script setup
+import { getCurrentInstance } from 'vue'
+
+const { proxy } = getCurrentInstance()
+and use proxy.$isMobile
+ */