diff --git a/website/app/components/LibrarySelect.vue b/website/app/components/LibrarySelect.vue
index 33c8b19..9e53b6f 100644
--- a/website/app/components/LibrarySelect.vue
+++ b/website/app/components/LibrarySelect.vue
@@ -33,7 +33,7 @@ export interface LibrarySelectProps {
 
 const props = defineProps<LibrarySelectProps>();
 
-const library = computed(() => props.libraryId);
+const library = ref(props.libraryId);
 const { data: libraries } = await useApi('/v2/FileLibrary', { key: FetchKeys.FileLibraries });
 
 const loading = ref(false);
@@ -46,5 +46,10 @@ const onLibrarySelectChange = async () => {
     });
     await refreshNuxtData(FetchKeys.Manga.Id(props.mangaId));
     loading.value = false;
+    emit('libraryChanged', library.value);
 };
+
+const emit = defineEmits<{
+    (e: 'libraryChanged', id?: string): void;
+}>();
 </script>
diff --git a/website/app/pages/manga/[mangaId]/index.vue b/website/app/pages/manga/[mangaId]/index.vue
index 0c73a35..7cfcf53 100644
--- a/website/app/pages/manga/[mangaId]/index.vue
+++ b/website/app/pages/manga/[mangaId]/index.vue
@@ -7,7 +7,7 @@
                     <template #header>
                         <h1 class="font-semibold">Download</h1>
                     </template>
-                    <LibrarySelect :manga-id="mangaId" :library-id="manga?.fileLibraryId" class="w-full" />
+                    <LibrarySelect :manga-id="mangaId" :library-id="manga?.fileLibraryId" class="w-full" @library-changed="refreshNuxtData(FetchKeys.Manga.Id(mangaId))" />
                     <div v-if="manga" class="flex flex-row gap-2 w-full flex-wrap my-2 justify-between">
                         <div
                             v-for="mangaconnectorId in manga.mangaConnectorIds.sort((a, b) =>