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 <[email protected]>
  • Loading branch information
nfebe committed Sep 7, 2023
1 parent 2b1008f commit f75684e
Showing 1 changed file with 13 additions and 1 deletion.
Original file line number Diff line number Diff line change
@@ -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 f75684e

Please sign in to comment.