Skip to content

Commit

Permalink
Close quickshare dropdown on outside click
Browse files Browse the repository at this point in the history
If a user clicks anywhere outside of the quickshare dropdown,
it should be closed.

Signed-off-by: fenn-cs <fenn25.fn@gmail.com>
  • Loading branch information
Fenn-CS committed Sep 6, 2023
1 parent 8c5ea18 commit 8570fe7
Showing 1 changed file with 13 additions and 1 deletion.
@@ -1,5 +1,5 @@
<template>
<div :class="{ 'active': showDropdown, 'share-select': true }">
<div :class="{ 'active': showDropdown, 'share-select': true }" ref="quickShareDropdown">
<span class="trigger-text" @click="toggleDropdown">
{{ selectedOption }}
<DropdownIcon :size="15" />
Expand Down Expand Up @@ -110,7 +110,12 @@ export default {
},
mounted() {
this.initializeComponent()
window.addEventListener('click', this.handleClickOutside);
},
beforeDestroy() {
// Remove the global click event listener to prevent memory leaks
window.removeEventListener('click', this.handleClickOutside);
},
methods: {
toggleDropdown() {
this.showDropdown = !this.showDropdown
Expand All @@ -128,6 +133,13 @@ export default {
initializeComponent() {
this.selectedOption = this.preSelectedOption
},
handleClickOutside(event) {
const dropdownElement = this.$refs.quickShareDropdown;
if (dropdownElement && !dropdownElement.contains(event.target)) {
this.showDropdown = false;
}
},
},
}
Expand Down

0 comments on commit 8570fe7

Please sign in to comment.