chore: code cleanups

This commit is contained in:
Muhsin Keloth
2024-04-26 10:36:56 +05:30
parent ff1286928d
commit 015a15cdc5
3 changed files with 50 additions and 14 deletions
@@ -14,7 +14,7 @@
<input
:checked="active"
type="radio"
name="hotkey"
:name="`hotkey-${title}`"
class="shadow cursor-pointer grid place-items-center border-2 border-ash-200 appearance-none rounded-full w-5 h-5 checked:bg-primary-600 before:content-[''] before:bg-primary-600 before:border-4 before:rounded-full before:border-ash-25 checked:before:w-[18px] checked:before:h-[18px] checked:border checked:border-primary-600"
/>
</div>
@@ -24,10 +24,17 @@
</div>
<div>
<img :src="lightImage" class="block object-cover w-full dark:hidden" />
<img :src="darkImage" class="hidden object-cover w-full dark:block" />
<img
:src="lightImage"
:alt="`Light themed image for ${title}`"
class="block object-cover w-full dark:hidden"
/>
<img
:src="darkImage"
:alt="`Dark themed image for ${title}`"
class="hidden object-cover w-full dark:block"
/>
</div>
<slot />
</div>
</template>
@@ -50,6 +50,7 @@
class="reset-base"
>
<hot-key-card
:key="hotKey.title"
:title="hotKey.title"
:description="hotKey.description"
:light-image="hotKey.lightImage"
@@ -63,7 +64,6 @@
</base-personal-item>
<base-personal-item
:header="$t('PROFILE_SETTINGS.FORM.PASSWORD_SECTION.TITLE')"
description=""
>
<template #settingsItem>
<change-password v-if="!globalConfig.disableUserProfileUpdate" />
@@ -121,11 +121,11 @@ import { clearCookiesOnLogout } from '../../../../store/utils/api';
import UserProfilePicture from './UserProfilePicture.vue';
import UserBasicDetails from './UserBasicDetails.vue';
import NotificationPreferences from './NotificationPreferences.vue';
import AudioNotifications from './AudioNotifications.vue';
import MessageSignature from './MessageSignature.vue';
import HotKeyCard from './HotKeyCard.vue';
import ChangePassword from './ChangePassword.vue';
import NotificationPreferences from './NotificationPreferences.vue';
import AudioNotifications from './AudioNotifications.vue';
import AccessToken from './AccessToken.vue';
import BasePersonalItem from './BasePersonalItem.vue';
@@ -210,6 +210,11 @@ export default {
const { name, email, displayName, messageSignature } = userAttributes;
const hasEmailChanged =
this.currentUser.email !== email && type === 'profile';
if (type === 'profile') {
this.name = name || this.name;
this.email = email || this.email;
this.displayName = displayName || this.displayName;
}
try {
await this.$store.dispatch('updateProfile', {
name: name || this.name,
@@ -1,20 +1,30 @@
<template>
<div id="profile-settings-notifications" class="flex flex-col gap-6">
<!-- Layout for desktop devices -->
<div class="hidden sm:block">
<div
class="grid content-center h-12 grid-cols-12 gap-4 py-0 rounded-t-xl"
>
<table-header-cell :span="7" label="Notification type">
<table-header-cell
:span="7"
label="`${$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPE_TITLE')}`"
>
<span class="text-sm font-normal uppercase text-ash-900">
{{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPE_TITLE') }}
</span>
</table-header-cell>
<table-header-cell :span="2" label="Email">
<table-header-cell
:span="2"
label="`${$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.EMAIL')}`"
>
<span class="text-sm font-medium uppercase text-ash-900">
{{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.EMAIL') }}
</span>
</table-header-cell>
<table-header-cell :span="3" label="Push notification">
<table-header-cell
:span="3"
label="`${$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.PUSH')}`"
>
<div class="flex items-center justify-between gap-1">
<span
class="text-sm font-medium uppercase text-ash-900 whitespace-nowrap"
@@ -28,7 +38,10 @@
</div>
</table-header-cell>
</div>
<div v-for="(notification, index) in notificationTypes" :key="index">
<div
v-for="(notification, index) in filteredNotificationTypes"
:key="index"
>
<div
class="grid content-center h-12 grid-cols-12 gap-4 py-0 rounded-t-xl"
>
@@ -53,14 +66,14 @@
</div>
</div>
</div>
<!-- Layout for mobile devices -->
<div class="flex flex-col gap-6 sm:hidden">
<span class="text-sm font-medium uppercase text-ash-900">
{{ $t('PROFILE_SETTINGS.FORM.EMAIL_NOTIFICATIONS_SECTION.TITLE') }}
</span>
<div class="flex flex-col gap-4">
<div
v-for="(notification, index) in notificationTypes"
v-for="(notification, index) in filteredNotificationTypes"
:key="index"
class="flex flex-row items-start gap-2"
>
@@ -86,7 +99,7 @@
<div class="flex flex-col gap-4">
<div
v-for="(notification, index) in notificationTypes"
v-for="(notification, index) in filteredNotificationTypes"
:key="index"
class="flex flex-row items-start gap-2"
>
@@ -189,6 +202,17 @@ export default {
isSLAEnabled() {
return this.isFeatureEnabledonAccount(this.accountId, FEATURE_FLAGS.SLA);
},
filteredNotificationTypes() {
return this.notificationTypes.filter(notification =>
this.isSLAEnabled
? true
: ![
'sla_missed_first_response',
'sla_missed_next_response',
'sla_missed_resolution',
].includes(notification.value)
);
},
},
watch: {
emailFlags(value) {