Bump tauri to v2 (#3018)

* Bump tauri to v2

* Switch to virtual typed list for content page

* Fix unexpected hang on windows

* Fix ads window scaling issues on some devices

* Use DPR from browser

* Fix link opens, bump version, fix lint

apps/app-frontend/src/App.vue

@@ -56,7 +56,7 @@ import dayjs from 'dayjs'
 import PromotionWrapper from '@/components/ui/PromotionWrapper.vue'
 import { hide_ads_window, show_ads_window } from '@/helpers/ads.js'
 import FriendsList from '@/components/ui/friends/FriendsList.vue'
-import { open as openURL } from '@tauri-apps/plugin-shell'
+import { openUrl } from '@tauri-apps/plugin-opener'
 
 const themeStore = useTheming()
 
@@ -191,6 +191,7 @@ async function setupApp() {
 
   get_opening_command().then(handleCommand)
   checkUpdates()
+  fetchCredentials()
 }
 
 const stateFailed = ref(false)
@@ -283,8 +284,6 @@ onMounted(() => {
   install.setIncompatibilityWarningModal(incompatibilityWarningModal)
   install.setInstallConfirmModal(installConfirmModal)
   install.setModInstallModal(modInstallModal)
-
-  fetchCredentials()
 })
 
 const accounts = ref(null)
@@ -330,10 +329,9 @@ function handleClick(e) {
         !target.classList.contains('router-link-active') &&
         !target.href.startsWith('http://localhost') &&
         !target.href.startsWith('https://tauri.localhost') &&
-        !target.href.startsWith('http://tauri.localhost') &&
-        target.target !== '_blank'
+        !target.href.startsWith('http://tauri.localhost')
       ) {
-        openURL(target.href)
+        openUrl(target.href)
       }
       e.preventDefault()
       break
@@ -359,13 +357,13 @@ function handleAuxClick(e) {
 
 <template>
   <SplashScreen v-if="!stateFailed" ref="splashScreen" data-tauri-drag-region />
-  <Suspense>
-    <AppSettingsModal ref="settingsModal" />
-  </Suspense>
-  <Suspense>
-    <InstanceCreationModal ref="installationModal" />
-  </Suspense>
   <div v-if="stateInitialized" class="app-grid-layout relative">
+    <Suspense>
+      <AppSettingsModal ref="settingsModal" />
+    </Suspense>
+    <Suspense>
+      <InstanceCreationModal ref="installationModal" />
+    </Suspense>
     <div
       class="app-grid-navbar bg-bg-raised flex flex-col p-[1rem] pt-0 gap-[0.5rem] z-10 w-[--left-bar-width]"
     >

apps/app-frontend/src/components/ui/PromotionWrapper.vue

@@ -4,20 +4,29 @@ import { ChevronRightIcon } from '@modrinth/assets'
 import { init_ads_window, open_ads_link, record_ads_click } from '@/helpers/ads.js'
 
 const adsWrapper = ref(null)
+
+let devicePixelRatioWatcher = null
+
+function initDevicePixelRatioWatcher() {
+  if (devicePixelRatioWatcher) {
+    devicePixelRatioWatcher.removeEventListener('change', updateAdPosition)
+  }
+
+  devicePixelRatioWatcher = window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`)
+  devicePixelRatioWatcher.addEventListener('change', updateAdPosition)
+}
+
 onMounted(() => {
   updateAdPosition()
 
   window.addEventListener('resize', updateAdPosition)
+  initDevicePixelRatioWatcher()
 })
 
 function updateAdPosition() {
   if (adsWrapper.value) {
-    const rect = adsWrapper.value.getBoundingClientRect()
-
-    const x = rect.left + window.scrollX
-    const y = rect.top + window.scrollY
-
-    init_ads_window(x, y, 300, 250, true)
+    init_ads_window(true)
+    initDevicePixelRatioWatcher()
   }
 }
 

apps/app-frontend/src/helpers/ads.js

@@ -1,11 +1,11 @@
 import { invoke } from '@tauri-apps/api/core'
 
-export async function init_ads_window(x, y, width, height, overrideShown = false) {
-  return await invoke('plugin:ads|init_ads_window', { x, y, width, height, overrideShown })
+export async function init_ads_window(overrideShown = false) {
+  return await invoke('plugin:ads|init_ads_window', { overrideShown, dpr: window.devicePixelRatio })
 }
 
 export async function show_ads_window() {
-  return await invoke('plugin:ads|show_ads_window')
+  return await invoke('plugin:ads|show_ads_window', { dpr: window.devicePixelRatio })
 }
 
 export async function hide_ads_window(reset) {