Update Nuxt to v3.12.1 (#1720)

* Update Nuxt dependencies

* Fix ref access in ChartDisplay

* Fix feature flags cookie options type error

* Specify type-only imports

* Fix shorthands access to tags outside of reactive scope

* Replace most useRoute calls with useRoute from vue-router

Nuxt's version of this composable is horrendously broken (nuxt/nuxt#21340)

* Import all svgs with ?component parameter

Fixes weird hydration issues + gives correct type

composables/auth.js

@@ -94,7 +94,7 @@ export const initAuth = async (oldToken = null) => {
 
 export const getAuthUrl = (provider, redirect = '') => {
   const config = useRuntimeConfig()
-  const route = useRoute()
+  const route = useNativeRoute()
 
   if (redirect === '') {
     redirect = route.path

composables/compact-number.ts

@@ -1,5 +1,5 @@
 import { createFormatter, type Formatter } from '@vintl/compact-number'
-import { IntlController } from '@vintl/vintl/controller'
+import type { IntlController } from '@vintl/vintl/controller'
 
 const formatters = new WeakMap<IntlController<any>, Formatter>()
 

composables/featureFlags.ts

@@ -1,4 +1,4 @@
-import { CookieOptions } from '#app'
+import type { CookieOptions } from '#app'
 
 export type ProjectDisplayMode = 'list' | 'grid' | 'gallery'
 export type DarkColorTheme = 'dark' | 'oled' | 'retro'
@@ -58,13 +58,13 @@ export type AllFeatureFlags = {
 
 export type PartialFeatureFlags = Partial<AllFeatureFlags>
 
-const COOKIE_OPTIONS: CookieOptions<PartialFeatureFlags> = {
+const COOKIE_OPTIONS = {
   maxAge: 60 * 60 * 24 * 365 * 10,
   sameSite: 'lax',
   secure: true,
   httpOnly: false,
   path: '/',
-}
+} satisfies CookieOptions<PartialFeatureFlags>
 
 export const useFeatureFlags = () =>
   useState<AllFeatureFlags>('featureFlags', () => {

composables/how-ago.ts

@@ -1,5 +1,5 @@
 import { createFormatter, type Formatter } from '@vintl/how-ago'
-import { IntlController } from '@vintl/vintl/controller'
+import type { IntlController } from '@vintl/vintl/controller'
 
 const formatters = new WeakMap<IntlController<any>, Formatter>()
 

composables/nuxt-bugfest.ts

@@ -0,0 +1 @@
+export { useRoute as useNativeRoute } from 'vue-router'

composables/route-params.js

@@ -5,6 +5,6 @@
  * @returns {import('vue').Ref<string | string[] | undefined>}
  */
 export const useRouteId = (key = 'id') => {
-  const route = useRoute()
+  const route = useNativeRoute()
   return route.params?.[key] || undefined
 }