Handle close GlobalSearchModal gracefully

The current close infrastructure modifies a prop which has
 no real effect aside bugs.

In addition, calling the `NcModal.close()` as the primary way to
 close the search modal instead of using the states defined in `GlobalSearch` view
 causing re-open bugs (Modal cannot open, needs to click twice, and other weird stuff).

Signed-off-by: fenn-cs <fenn25.fn@gmail.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>

diff --git a/core/src/views/GlobalSearch.vue b/core/src/views/GlobalSearch.vue
index 2bca15ec905b406cdd8b56671496b02e17bf9c1f..24547fd627089c24860066dac072954a9ad5b131 100644 (file)
--- a/core/src/views/GlobalSearch.vue
+++ b/core/src/views/GlobalSearch.vue
@@ -26,7 +26,7 @@
                                <Magnify class="global-search__trigger" :size="22" />
                        </template>
                </NcButton>
-               <GlobalSearchModal :is-visible="showGlobalSearch" :class="'global-search-modal'" />
+               <GlobalSearchModal :class="'global-search-modal'" :is-visible="showGlobalSearch" @update:isVisible="handleModalVisibilityChange" />
        </div>
 </template>
 
@@ -54,6 +54,9 @@ export default {
                toggleGlobalSearch() {
                        this.showGlobalSearch = !this.showGlobalSearch
                },
+               handleModalVisibilityChange(newVisibilityVal) {
+                       this.showGlobalSearch = newVisibilityVal
+               },
        },
 }
 </script>

diff --git a/core/src/views/GlobalSearchModal.vue b/core/src/views/GlobalSearchModal.vue
index 85e81a5a2c52005c05c2631d848d34266b5c2ee8..76fc921c821b4bded0f25046a6edc9e73a982bc3 100644 (file)
--- a/core/src/views/GlobalSearchModal.vue
+++ b/core/src/views/GlobalSearchModal.vue
@@ -2,7 +2,7 @@
        <NcModal id="global-search"
                ref="globalSearchModal"
                :name="t('core', 'Global search')"
-               :show.sync="isVisible"
+               :show.sync="internalIsVisible"
                :clear-view-delay="0"
                :title="t('Global search')"
                @close="closeModal">
@@ -200,6 +200,7 @@ export default {
                        contacts: [],
                        debouncedFind: debounce(this.find, 300),
                        showDateRangeModal: false,
+                       internalIsVisible: false,
                }
        },
 
@@ -224,12 +225,17 @@ export default {
        },
        watch: {
                isVisible(value) {
+                       this.internalIsVisible = value
+               },
+               internalIsVisible(value) {
+                       this.$emit('update:isVisible', value)
                        this.$nextTick(() => {
                                if (value) {
                                        this.focusInput()
                                }
                        })
                },
+
        },
        mounted() {
                getProviders().then((providers) => {
@@ -519,7 +525,7 @@ export default {
                        this.$refs.searchInput.$el.children[0].children[0].focus()
                },
                closeModal() {
-                   this.$refs.globalSearchModal.close()
+                       this.internalIsVisible = false
                        this.searchQuery = ''
                },
                supportFiltering() {