diff --git a/src/client/components/AppHeader.vue b/src/client/components/AppHeader.vue index f594cd675af335c9020449fead871e61ca30507b..fd3eb4cecb7a3b07354a24bf2b9ef6eae1f7ecd5 100644 --- a/src/client/components/AppHeader.vue +++ b/src/client/components/AppHeader.vue @@ -63,7 +63,7 @@ </template> <script setup lang="ts"> -import { computed, onMounted, ref } from 'vue' +import { computed, onMounted, ref, watch } from 'vue' import api from '../api' import { useStore } from '../store' import AppDialog from './AppDialog.vue' @@ -72,9 +72,15 @@ const store = useStore() const downloadsVisible = ref<boolean>(false) const archives = computed(() => store.archives) -onMounted(() => { - store.fetchArchives() -}) +/** + * Fetch the list of archives when the dialog is opened. + * Do it only once to avoid unnecessary requests. + */ +watch( + downloadsVisible, + () => { store.fetchArchives() }, + { once: true } +) /** * Open the dialog.