diff --git a/app/javascript/dashboard/routes/dashboard/settings/personal/HotKeyCard.vue b/app/javascript/dashboard/routes/dashboard/settings/personal/HotKeyCard.vue
new file mode 100644
index 000000000..52a19e653
--- /dev/null
+++ b/app/javascript/dashboard/routes/dashboard/settings/personal/HotKeyCard.vue
@@ -0,0 +1,60 @@
+
+
+
+
{{ heading }}
+
+
+
+
+
+
+ {{ content }}
+
+
+
![]()
+
+
+
+
+
+
diff --git a/app/javascript/dashboard/routes/dashboard/settings/personal/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/personal/Index.vue
index b3b382591..981fa7114 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/personal/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/personal/Index.vue
@@ -19,6 +19,30 @@
+
+
+
+
+
+
+
+
@@ -27,4 +51,22 @@
import UserBasicProfile from './UserBasicProfile.vue';
import MessageSignature from './MessageSignature.vue';
import PersonalWrapper from './PersonalWrapper.vue';
+import HotKeyCard from './HotKeyCard.vue';
+
+const keyOptions = [
+ {
+ key: 'enter',
+ src: '/assets/images/dashboard/profile/hot-key-enter.svg',
+ heading: 'Enter (↵)',
+ content:
+ 'Send messages by pressing Enter key instead of clicking send button.',
+ },
+ {
+ key: 'cmd_enter',
+ src: '/assets/images/dashboard/profile/hot-key-ctrl-enter.svg',
+ heading: 'CMD / Ctrl + Enter (⌘ + ↵)',
+ content:
+ 'Send messages by pressing Enter key instead of clicking send button.',
+ },
+];
diff --git a/public/assets/images/dashboard/profile/hot-key-ctrl-enter.svg b/public/assets/images/dashboard/profile/hot-key-ctrl-enter.svg
new file mode 100644
index 000000000..7abfe902a
--- /dev/null
+++ b/public/assets/images/dashboard/profile/hot-key-ctrl-enter.svg
@@ -0,0 +1,25 @@
+
diff --git a/public/assets/images/dashboard/profile/hot-key-enter.svg b/public/assets/images/dashboard/profile/hot-key-enter.svg
new file mode 100644
index 000000000..b919c2cf8
--- /dev/null
+++ b/public/assets/images/dashboard/profile/hot-key-enter.svg
@@ -0,0 +1,25 @@
+