LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

feat: Adds keyboard shortcuts for conversation actions (#2672)

Browse Source 
* feat: Adds keyboard shortcuts for conversation actions

* Minor fixes

* Minor fixes

* Minor fixes and add new shortcut

* MInor fixes

* Review fixes

* Minor fixes

* Code cleanup

* Minor fixes

* Uses Alt or Option key instead of shift-key

* Review fixes

* Review fixes

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
This commit is contained in:
Sivin Varghese
2021-08-09 13:08:52 +05:30
committed by GitHub
parent c7482696d4
commit c523a953f7
15 changed files with 311 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
app/javascript/shared/components/ui/MultiselectDropdownItems.vue
View File

@@ -11,12 +11,7 @@
/>
</div>
<div class="list-scroll-container">
<div
ref="multiselectDropdown"
class="multiselect-dropdown--list"
@keyup.up="onArrowUp"
@keyup.down="onArrowDown"
>
<div class="multiselect-dropdown--list">
<woot-dropdown-menu>
<woot-dropdown-item
v-for="option in filteredOptions"
@@ -119,38 +114,6 @@ export default {
focusInput() {
this.$refs.searchbar.focus();
},
onArrowUp() {
const allDropdownItems = this.$refs.multiselectDropdown.querySelectorAll(
'.dropdown .multiselect-dropdown--item'
);
const focusedElement = this.$refs.multiselectDropdown.querySelector(
'.dropdown .multiselect-dropdown--item:focus'
);
const activeElementIndex = [...allDropdownItems].indexOf(focusedElement);
const lastElementIndex = allDropdownItems.length - 1;
if (activeElementIndex >= 1) {
allDropdownItems[activeElementIndex - 1].focus();
} else {
allDropdownItems[lastElementIndex].focus();
}
},
onArrowDown() {
const allDropdownItems = this.$refs.multiselectDropdown.querySelectorAll(
'.dropdown .multiselect-dropdown--item'
);
const focusedElement = this.$refs.multiselectDropdown.querySelector(
'.dropdown .multiselect-dropdown--item:focus'
);
const activeElementIndex = [...allDropdownItems].indexOf(focusedElement);
const lastElementIndex = allDropdownItems.length - 1;
if (activeElementIndex === lastElementIndex) {
allDropdownItems[0].focus();
} else {
allDropdownItems[activeElementIndex + 1].focus();
}
},
},
};
</script>