Gate My List behind auth modal instead of in-page prompt

- Clicking My List when not logged in now opens the auth modal
  directly instead of navigating to a page with a sign-in button
- After successful login, auto-redirects to /library (My List)
- Works on both desktop header and mobile tab bar
- App.vue tracks a pending redirect path so the post-login
  navigation happens seamlessly
- Direct URL navigation to /library when not logged in also
  triggers the modal and redirects back to Films

Co-authored-by: Cursor <cursoragent@cursor.com>

src/components/AppHeader.vue

@@ -11,7 +11,7 @@
           <!-- Navigation - Desktop -->
           <nav v-if="showNav" class="hidden md:flex items-center gap-3">
             <button @click="handleFilmsClick" :class="isRoute('/') && !activeAlgorithm ? 'nav-button-active' : 'nav-button'">Films</button>
-            <router-link to="/library" :class="isRoute('/library') && !activeAlgorithm ? 'nav-button-active' : 'nav-button'" @click="clearFilter">My List</router-link>
+            <button @click="handleMyListClick" :class="isRoute('/library') && !activeAlgorithm ? 'nav-button-active' : 'nav-button'">My List</button>
 
             <!-- Inline Algorithm Buttons (xl+ screens where they fit) -->
             <button
@@ -223,7 +223,7 @@ interface Props {
 }
 
 interface Emits {
-  (e: 'openAuth'): void
+  (e: 'openAuth', redirect?: string): void
 }
 
 withDefaults(defineProps<Props>(), {
@@ -232,7 +232,7 @@ withDefaults(defineProps<Props>(), {
   showAuth: true,
 })
 
-defineEmits<Emits>()
+const emit = defineEmits<Emits>()
 
 const router = useRouter()
 const route = useRoute()
@@ -310,11 +310,21 @@ function handleFilmsClick() {
   }
 }
 
-/** Clear active filter (used when navigating to My List) */
-function clearFilter() {
+/**
+ * Navigate to My List if logged in, otherwise open the auth modal
+ * with a redirect so the user lands on My List after login.
+ */
+function handleMyListClick() {
   if (activeAlgorithm.value) {
     _setAlgorithm(activeAlgorithm.value as any) // toggle off
   }
+  if (!isAuthenticated.value && !nostrLoggedIn.value) {
+    emit('openAuth', '/library')
+    return
+  }
+  if (route.path !== '/library') {
+    router.push('/library')
+  }
 }
 
 function toggleDropdown() {

src/components/MobileNav.vue

@@ -93,9 +93,15 @@
 import { ref, computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { useContentDiscovery, type AlgorithmId } from '../composables/useContentDiscovery'
+import { useAuth } from '../composables/useAuth'
+import { useAccounts } from '../composables/useAccounts'
+
+const emit = defineEmits<{ (e: 'openAuth', redirect?: string): void }>()
 
 const router = useRouter()
 const route = useRoute()
+const { isAuthenticated } = useAuth()
+const { isLoggedIn: isNostrLoggedIn } = useAccounts()
 
 const {
   activeAlgorithm,
@@ -107,6 +113,7 @@ const {
 const showFilterSheet = ref(false)
 
 const isOnFilmsPage = computed(() => route.path === '/')
+const isLoggedInAnywhere = computed(() => isAuthenticated.value || isNostrLoggedIn.value)
 
 const navigate = (path: string) => {
   router.push(path)
@@ -126,11 +133,18 @@ function handleFilmsClick() {
   navigate('/')
 }
 
-/** Navigate to My List and clear any active filter */
+/**
+ * Navigate to My List if logged in, otherwise open the auth modal
+ * with a redirect so the user lands on My List after login.
+ */
 function handleMyListClick() {
   if (isFilterActive.value) {
     setAlgorithm(activeAlgorithm.value!) // toggle off
   }
+  if (!isLoggedInAnywhere.value) {
+    emit('openAuth', '/library')
+    return
+  }
   navigate('/library')
 }