feat: add translations

This commit is contained in:
Muhsin Keloth
2024-04-23 13:57:45 +05:30
parent 99e5c389ca
commit 106cb1fddc
6 changed files with 152 additions and 66 deletions
@@ -57,13 +57,14 @@
},
"ACCESS_TOKEN": {
"TITLE": "Access Token",
"NOTE": "This token can be used if you are building an API based integration"
"NOTE": "This token can be used if you are building an API based integration",
"COPY": "Copy"
},
"AUDIO_NOTIFICATIONS_SECTION": {
"TITLE": "Audio Notifications",
"NOTE": "Enable audio notifications in dashboard for new messages and conversations.",
"ALERT_TYPE": {
"TITLE": "Alert events:",
"TITLE": "Alert events for conversations:",
"NONE": "None",
"ASSIGNED": "Assigned Conversations",
"ALL_CONVERSATIONS": "All Conversations"
@@ -89,6 +90,22 @@
"SLA_MISSED_NEXT_RESPONSE": "Send email notifications when a conversation misses next response SLA",
"SLA_MISSED_RESOLUTION": "Send email notifications when a conversation misses resolution SLA"
},
"NOTIFICATIONS": {
"TITLE": "Notification preferences",
"TYPE_TITLE": "Notification type",
"EMAIL": "Email",
"PUSH": "Push notification",
"TYPES": {
"CONVERSATION_CREATED": "A new conversation is created",
"CONVERSATION_ASSIGNED": "A conversation is assigned to you",
"CONVERSATION_MENTION": "You are mentioned in a conversation",
"ASSIGNED_CONVERSATION_NEW_MESSAGE": "A new message is created in an assigned conversation",
"PARTICIPATING_CONVERSATION_NEW_MESSAGE": "A new message is created in a participating conversation",
"SLA_MISSED_FIRST_RESPONSE": "A conversation misses first response SLA",
"SLA_MISSED_NEXT_RESPONSE": "A conversation misses next response SLA",
"SLA_MISSED_RESOLUTION": "A conversation misses resolution SLA"
}
},
"API": {
"UPDATE_SUCCESS": "Your notification preferences are updated successfully",
"UPDATE_ERROR": "There is an error while updating the preferences, please try again"
@@ -18,7 +18,7 @@
color-scheme="secondary"
@click="onClick"
>
Copy
{{ $t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.COPY') }}
</v3-button>
</div>
</template>
@@ -29,25 +29,23 @@
</div>
</template>
<script>
export default {
props: {
active: {
type: Boolean,
default: false,
},
heading: {
type: String,
default: '',
},
content: {
type: String,
default: '',
},
src: {
type: String,
default: '',
},
<script setup>
defineProps({
active: {
type: Boolean,
default: false,
},
};
heading: {
type: String,
default: '',
},
content: {
type: String,
default: '',
},
src: {
type: String,
default: '',
},
});
</script>
@@ -12,8 +12,8 @@
:src="avatarUrl"
:name="name"
size="72px"
@change="handleImageUpload"
@delete="deleteAvatar"
@change="updateProfilePicture"
@delete="deleteProfilePicture"
/>
<user-basic-details
:name="name"
@@ -25,8 +25,10 @@
</div>
<personal-wrapper
header="Personal message signature"
description="Create a unique message signature to appear at the end of every message you send from any inbox. You can also include an inline image, which is supported in live-chat, email, and API inboxes."
:header="$t('PROFILE_SETTINGS.FORM.MESSAGE_SIGNATURE_SECTION.TITLE')"
:description="
$t('PROFILE_SETTINGS.FORM.MESSAGE_SIGNATURE_SECTION.NOTE')
"
:show-action-button="false"
>
<template #settingsItem>
@@ -35,9 +37,8 @@
</personal-wrapper>
<personal-wrapper
header="Hot key to send messages"
description="You can select a hotkey (either Enter or Cmd/Ctrl+Enter) based on your
preference of writing."
:header="$t('PROFILE_SETTINGS.FORM.SEND_MESSAGE.TITLE')"
:description="$t('PROFILE_SETTINGS.FORM.SEND_MESSAGE.NOTE')"
:show-action-button="false"
>
<template #settingsItem>
@@ -62,8 +63,12 @@
</personal-wrapper>
<change-password v-if="!globalConfig.disableUserProfileUpdate" />
<personal-wrapper
header="Audio notifications"
description="Enable audio notifications in dashboard for new messages and conversations."
:header="
$t('PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.TITLE')
"
:description="
$t('PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.NOTE')
"
:show-action-button="false"
>
<template #settingsItem>
@@ -71,8 +76,7 @@
</template>
</personal-wrapper>
<personal-wrapper
header="Notification preferences"
description=""
:header="$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TITLE')"
:show-action-button="false"
>
<template #settingsItem>
@@ -80,7 +84,7 @@
</template>
</personal-wrapper>
<personal-wrapper
header="Access Token"
:header="$t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.TITLE')"
:description="
useInstallationName(
$t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.NOTE'),
@@ -142,16 +146,22 @@ export default {
{
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.',
heading: this.$t(
'PROFILE_SETTINGS.FORM.SEND_MESSAGE.CARD.ENTER_KEY.HEADING'
),
content: this.$t(
'PROFILE_SETTINGS.FORM.SEND_MESSAGE.CARD.ENTER_KEY.CONTENT'
),
},
{
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.',
heading: this.$t(
'PROFILE_SETTINGS.FORM.SEND_MESSAGE.CARD.CMD_ENTER_KEY.HEADING'
),
content: this.$t(
'PROFILE_SETTINGS.FORM.SEND_MESSAGE.CARD.CMD_ENTER_KEY.CONTENT'
),
},
],
};
@@ -186,15 +196,16 @@ export default {
this.displayName = this.currentUser.display_name;
},
isEditorHotKeyEnabled,
async updateUser() {
async updateUser(user) {
const { name, email, displayName } = user;
this.isProfileUpdating = true;
const hasEmailChanged = this.currentUser.email !== this.email;
const hasEmailChanged = this.currentUser.email !== email;
try {
await this.$store.dispatch('updateProfile', {
name: this.name,
email: this.email,
name: name,
email: email,
avatar: this.avatarFile,
displayName: this.displayName,
displayName: displayName,
});
this.isProfileUpdating = false;
if (hasEmailChanged) {
@@ -212,11 +223,11 @@ export default {
this.showAlert(this.errorMessage);
}
},
handleImageUpload({ file, url }) {
updateProfilePicture({ file, url }) {
this.avatarFile = file;
this.avatarUrl = url;
},
async deleteAvatar() {
async deleteProfilePicture() {
try {
await this.$store.dispatch('deleteAvatar');
this.avatarUrl = '';
@@ -6,18 +6,18 @@
>
<table-header-cell :span="6" label="Notification type">
<span class="text-sm font-normal uppercase text-ash-900">
Notification type
{{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPE_TITLE') }}
</span>
</table-header-cell>
<table-header-cell :span="2" label="Email">
<span class="text-sm font-medium uppercase text-ash-900">
Email
{{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.EMAIL') }}
</span>
</table-header-cell>
<table-header-cell :span="4" label="Push notification">
<div class="flex items-center justify-between gap-2">
<span class="text-sm font-medium uppercase text-ash-900">
Push notification
{{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.PUSH') }}
</span>
<v3-switch :value="true" @input="onRequestPermissions()" />
</div>
@@ -30,7 +30,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
A new conversation is created
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.CONVERSATION_CREATED'
)
}}
</span>
</div>
<div
@@ -62,7 +66,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
Conversation is assigned to you
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.CONVERSATION_ASSIGNED'
)
}}
</span>
</div>
<div
@@ -95,7 +103,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
You are mentioned in a conversation
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.CONVERSATION_MENTION'
)
}}
</span>
</div>
<div
@@ -128,7 +140,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
New message is created in an assigned conversation
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.ASSIGNED_CONVERSATION_NEW_MESSAGE'
)
}}
</span>
</div>
<div
@@ -161,7 +177,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
New message is created in an participating conversation
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.PARTICIPATING_CONVERSATION_NEW_MESSAGE'
)
}}
</span>
</div>
<div
@@ -195,7 +215,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
Conversation misses first response SLA
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.SLA_MISSED_FIRST_RESPONSE'
)
}}
</span>
</div>
<div
@@ -228,7 +252,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
>
<span class="text-sm text-ash-900">
Conversation misses next response SLA
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.SLA_MISSED_NEXT_RESPONSE'
)
}}
</span>
</div>
<div
@@ -261,7 +289,11 @@
class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] text-ash-900 rtl:text-right"
>
<span class="text-sm text-ash-900">
Conversation misses resolution SLA
{{
$t(
'PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPES.SLA_MISSED_RESOLUTION'
)
}}
</span>
</div>
<div
@@ -22,7 +22,11 @@
<label
class="flex justify-between pb-1 text-sm font-medium leading-6 text-ash-900"
>
Alert events for conversations
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.ALERT_TYPE.TITLE'
)
}}
</label>
<div
class="flex flex-row justify-between h-10 max-w-xl p-2 border border-solid rounded-md border-ash-200"
@@ -42,7 +46,11 @@
class="text-sm font-medium text-ash-900"
:class="{ 'text-ash-400': enableAudioAlerts !== 'none' }"
>
None
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.ALERT_TYPE.NONE'
)
}}
</label>
</div>
<div
@@ -60,7 +68,11 @@
class="text-sm font-medium text-ash-900"
:class="{ 'text-ash-400': enableAudioAlerts !== 'mine' }"
>
Assigned
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.ALERT_TYPE.ASSIGNED'
)
}}
</label>
</div>
<div class="flex flex-row items-center justify-center gap-2 px-4 grow">
@@ -76,7 +88,11 @@
class="text-sm font-medium text-ash-900"
:class="{ 'text-ash-400': enableAudioAlerts !== 'all' }"
>
All
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.ALERT_TYPE.ALL_CONVERSATIONS'
)
}}
</label>
</div>
</div>
@@ -85,7 +101,11 @@
<label
class="flex justify-between pb-1 text-sm font-medium leading-6 text-slate-900 dark:text-white"
>
Alert conditions
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.CONDITIONS.TITLE'
)
}}
</label>
<div class="flex flex-col gap-2">
<div class="flex flex-row items-start gap-2">
@@ -98,7 +118,11 @@
@input="handleAudioAlertConditions"
/>
<label class="text-sm font-normal text-ash-900">
Send audio alerts only if the browser window is not active
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.CONDITIONS.CONDITION_ONE'
)
}}
</label>
</div>
<div class="flex flex-row items-start gap-2">
@@ -110,7 +134,11 @@
@input="handleAudioAlertConditions"
/>
<label class="text-sm font-normal text-ash-900">
Send alerts every 30s until all the assigned conversations are read
{{
$t(
'PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.CONDITIONS.CONDITION_TWO'
)
}}
</label>
</div>
</div>