KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

design: Improve discovery of command bar

Browse source
This commit is contained in:
Nithin David 2022-06-30 23:57:14 +05:30
parent ac7ebe516a
commit 8ab0a86873
4 changed files with 36 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
app/javascript/dashboard/components/layout/sidebarComponents/Primary.vue
View file

@ -16,6 +16,14 @@
/>
</nav>
<div class="menu vertical user-menu">
<woot-button
v-tooltip.right="commandBarTooltip"
variant="clear"
color-scheme="secondary"
:class="{ 'is-active': isControlCenterOpen }"
icon="flashlight"
@click="openControlCenter"
/>
<notification-bell @open-notification-panel="openNotificationPanel" />
<agent-details @toggle-menu="toggleOptions" />
<options-menu
@ -70,8 +78,18 @@ export default {
data() {
return {
showOptionsMenu: false,
isControlCenterOpen: false,
};
},
computed: {
commandBarTooltip() {
const isMacKeyboard =
navigator.userAgentData.platform.indexOf('Mac') > -1;
return isMacKeyboard
? this.$t('COMMAND_BAR.TOOLTIP_NOT_MAC')
: this.$t('COMMAND_BAR.TOOLTIP_MAC');
},
},
methods: {
frontendURL,
toggleOptions() {
@ -86,6 +104,10 @@ export default {
openNotificationPanel() {
this.$emit('open-notification-panel');
},
openControlCenter() {
const ninja = document.querySelector('ninja-keys');
ninja.open();
},
},
};
</script>

7
app/javascript/dashboard/i18n/locale/en/generalSettings.json
View file

@ -48,7 +48,7 @@
}
},
"UPDATE_CHATWOOT": "An update %{latestChatwootVersion} for Chatwoot is available. Please update your instance.",
"LEARN_MORE":"Learn more"
"LEARN_MORE": "Learn more"
},
"FORMS": {
"MULTISELECT": {
@ -93,7 +93,10 @@
}
},
"COMMAND_BAR": {
"SEARCH_PLACEHOLDER": "Search or jump to",
"SEARCH_PLACEHOLDER": "Search or jump to (ctrl + k)",
"SEARCH_PLACEHOLDER_MAC": "Search or jump to (cmd + k)",
"TOOLTIP_MAC": "Command bar (cmd + k)",
"TOOLTIP_NOT_MAC": "Command bar (ctrl + k)",
"SECTIONS": {
"GENERAL": "General",
"REPORTS": "Reports",

14
app/javascript/dashboard/routes/dashboard/commands/commandbar.vue
View file

@ -4,7 +4,7 @@
ref="ninjakeys"
:no-auto-load-md-icons="true"
hideBreadcrumbs
:placeholder="placeholder"
:placeholder="commandBarTooltip"
@selected="setCommandbarData"
/>
</template>
@ -28,11 +28,6 @@ export default {
goToCommandHotKeys,
],
data() {
return {
placeholder: this.$t('COMMAND_BAR.SEARCH_PLACEHOLDER'),
};
},
computed: {
accountId() {
return this.$store.getters.getCurrentAccountId;
@ -43,6 +38,13 @@ export default {
hotKeys() {
return [...this.conversationHotKeys, ...this.goToCommandHotKeys];
},
commandBarTooltip() {
const isMacKeyboard =
navigator.userAgentData.platform.indexOf('Mac') > -1;
return isMacKeyboard
? this.$t('COMMAND_BAR.SEARCH_PLACEHOLDER_MAC')
: this.$t('COMMAND_BAR.SEARCH_PLACEHOLDER');
},
},
watch: {
routeName() {

1
app/javascript/shared/components/FluentIcon/dashboard-icons.json
View file

@ -70,6 +70,7 @@
"filter-outline": "M13.5 16a.75.75 0 0 1 0 1.5h-3a.75.75 0 0 1 0-1.5h3Zm3-5a.75.75 0 0 1 0 1.5h-9a.75.75 0 0 1 0-1.5h9Zm3-5a.75.75 0 0 1 0 1.5h-15a.75.75 0 0 1 0-1.5h15Z",
"file-upload-outline": "M6 2a2 2 0 0 0-2 2v5.207a5.48 5.48 0 0 1 1-.185V4a1 1 0 0 1 1-1h4v3.5A1.5 1.5 0 0 0 11.5 8H15v8a1 1 0 0 1-1 1h-3.6a5.507 5.507 0 0 1-.657 1H14a2 2 0 0 0 2-2V7.414a1.5 1.5 0 0 0-.44-1.06l-3.914-3.915A1.5 1.5 0 0 0 10.586 2H6Zm8.793 5H11.5a.5.5 0 0 1-.5-.5V3.207L14.793 7ZM5.5 19a4.5 4.5 0 1 0 0-9a4.5 4.5 0 0 0 0 9Zm2.354-4.854a.5.5 0 1 1-.708.708L6 13.707V16.5a.5.5 0 0 1-1 0v-2.793l-1.146 1.147a.5.5 0 1 1-.708-.707l2-2A.5.5 0 0 1 5.497 12h.006a.498.498 0 0 1 .348.144l.003.003l2 2Z",
"flash-on-outline": "m8.294 14-1.767 7.068c-.187.746.736 1.256 1.269.701L19.79 9.27A.75.75 0 0 0 19.25 8h-4.46l1.672-5.013A.75.75 0 0 0 15.75 2h-7a.75.75 0 0 0-.721.544l-3 10.5A.75.75 0 0 0 5.75 14h2.544Zm4.745-5.487a.75.75 0 0 0 .711.987h3.74l-8.824 9.196 1.316-5.264a.75.75 0 0 0-.727-.932h-2.51l2.57-9h5.394l-1.67 5.013Z",
"flashlight-outline": "M17.5 2A.75.75 0 0 0 16 2v1a.75.75 0 0 0 1.5 0V2Zm4.03.47a.75.75 0 0 0-1.06 0l-2 2a.75.75 0 0 0 1.06 1.06l2-2a.75.75 0 0 0 0-1.06ZM8.03 17.03l1.5-1.5a.75.75 0 1 0-1.06-1.06l-1.5 1.5a.75.75 0 1 0 1.06 1.06ZM8.25 6v4.69l-5.22 5.219a2.25 2.25 0 0 0 0 3.182L4.91 20.97a2.25 2.25 0 0 0 3.182 0l5.22-5.22H18a.75.75 0 0 0 .53-.22l1.94-1.939a2.25 2.25 0 0 0 0-3.182L13.59 3.53a2.25 2.25 0 0 0-3.182 0l-1.94 1.94A.75.75 0 0 0 8.25 6Zm3.22-1.409a.75.75 0 0 1 1.06 0l6.879 6.879a.75.75 0 0 1 0 1.06L18 13.94 10.06 6l1.41-1.409Zm-1.72 3.22 6.44 6.439h-2.88l-3.56-3.56V7.81ZM9 12.06 11.94 15l-4.91 4.909a.75.75 0 0 1-1.06 0L4.09 18.03a.75.75 0 0 1 0-1.06L9 12.06ZM21 8h1a.75.75 0 0 0 0-1.5h-1A.75.75 0 0 0 21 8Z",
"folder-outline": "M8.207 4c.46 0 .908.141 1.284.402l.156.12L12.022 6.5h7.728a2.25 2.25 0 0 1 2.229 1.938l.016.158.005.154v9a2.25 2.25 0 0 1-2.096 2.245L19.75 20H4.25a2.25 2.25 0 0 1-2.245-2.096L2 17.75V6.25a2.25 2.25 0 0 1 2.096-2.245L4.25 4h3.957Zm1.44 5.979a2.25 2.25 0 0 1-1.244.512l-.196.009-4.707-.001v7.251c0 .38.282.694.648.743l.102.007h15.5a.75.75 0 0 0 .743-.648l.007-.102v-9a.75.75 0 0 0-.648-.743L19.75 8h-7.729L9.647 9.979ZM8.207 5.5H4.25a.75.75 0 0 0-.743.648L3.5 6.25v2.749L8.207 9a.75.75 0 0 0 .395-.113l.085-.06 1.891-1.578-1.89-1.575a.75.75 0 0 0-.377-.167L8.207 5.5Z",
"globe-desktop-outline": "M22.002 12C22.002 6.477 17.524 2 12 2 6.476 1.999 2 6.477 2 12.001c0 5.186 3.947 9.45 9.001 9.952V20.11c-.778-.612-1.478-1.905-1.939-3.61h1.94V15H8.737a18.969 18.969 0 0 1-.135-5h6.794c.068.64.105 1.31.105 2h1.5c0-.684-.033-1.353-.095-2h3.358c.154.64.237 1.31.237 2h1.5ZM4.786 16.5h2.722l.102.396c.317 1.17.748 2.195 1.27 3.015a8.532 8.532 0 0 1-4.094-3.41ZM3.736 10h3.358a20.847 20.847 0 0 0-.095 2c0 1.043.075 2.051.217 3H4.043a8.483 8.483 0 0 1-.544-3c0-.682.08-1.347.232-1.983L3.736 10Zm5.122-5.902.023-.008C8.16 5.222 7.611 6.748 7.298 8.5H4.25c.905-2 2.56-3.587 4.608-4.402Zm3.026-.594L12 3.5l.126.006c1.262.126 2.48 2.125 3.045 4.995H8.83c.568-2.878 1.79-4.88 3.055-4.996Zm3.343.76-.107-.174.291.121a8.533 8.533 0 0 1 4.339 4.29h-3.048c-.298-1.665-.806-3.125-1.475-4.237Z M12 19a1 1 0 0 0 1 1h3v2h-.5a.5.5 0 1 0 0 1h4a.5.5 0 0 0 0-1H19v-2h3a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1h-9a1 1 0 0 0-1 1v5Z",
"headphones-sound-wave-outline": "M3.5 12a8.5 8.5 0 0 1 17 0v2h-2.25a.75.75 0 0 0-.75.75v6.5c0 .414.336.75.75.75H19a3 3 0 0 0 3-3v-7c0-5.523-4.477-10-10-10S2 6.477 2 12v7a3 3 0 0 0 3 3h.75a.75.75 0 0 0 .75-.75v-6.5a.75.75 0 0 0-.75-.75H3.5v-2Zm17 3.5V19a1.5 1.5 0 0 1-1.5 1.5v-5h1.5ZM3.5 19v-3.5H5v5A1.5 1.5 0 0 1 3.5 19Zm9.25-7.25a.75.75 0 0 0-1.5 0v10.5a.75.75 0 0 0 1.5 0v-10.5Zm-4 2.25a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5a.75.75 0 0 1 .75-.75Zm7.25.75a.75.75 0 0 0-1.5 0v4.5a.75.75 0 0 0 1.5 0v-4.5Z",