feat: Send audio longer than 10 seconds and Add Prop audio-record-format

app/javascript/dashboard/assets/scss/widgets/_sidemenu.scss

@@ -59,8 +59,12 @@
 
 .hamburger--menu {
   cursor: pointer;
-  display: block;
+  display: none;
   margin-right: $space-normal;
+
+  @media screen and (max-width: 1200px) {
+    display: block;
+  }
 }
 
 .header--icon {

app/javascript/dashboard/components/SidemenuIcon.vue

@@ -1,12 +1,7 @@
 <template>
-  <woot-button
+  <button @click="onMenuItemClick">
-    size="small"
+    <fluent-icon class="hamburger--menu" icon="list" />
-    variant="clear"
+  </button>
-    color-scheme="secondary"
-    icon="list"
-    class="toggle-sidebar"
-    @click="onMenuItemClick"
-  />
 </template>
 
 <script>
@@ -21,8 +16,13 @@ export default {
 };
 </script>
 <style scoped lang="scss">
-.toggle-sidebar {
+.hamburger--menu {
-  margin-right: var(--space-small);
+  cursor: pointer;
-  margin-left: var(--space-minus-small);
+  display: none;
+  margin-right: var(--space-normal);
+
+  @media screen and (max-width: 1200px) {
+    display: block;
+  }
 }
 </style>

app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue

@@ -261,7 +261,14 @@ export default {
   width: 20rem;
   flex-shrink: 0;
   overflow-y: hidden;
-  position: unset;
+
+  @include breakpoint(xlarge down) {
+    position: absolute;
+  }
+
+  @include breakpoint(xlarge up) {
+    position: unset;
+  }
 
   &:hover {
     overflow-y: hidden;

app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap

@@ -1,11 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`SidemenuIcon matches snapshot 1`] = `
-<woot-button
+<button>
-  class="toggle-sidebar"
+  <fluent-icon
-  color-scheme="secondary"
+    class="hamburger--menu"
-  icon="list"
+    icon="list"
-  size="small"
+  />
-  variant="clear"
+</button>
-/>
 `;

app/javascript/dashboard/components/widgets/conversation/ConversationHeader.vue

@@ -21,11 +21,7 @@
           />
         </h3>
         <div class="conversation--header--actions">
-          <inbox-name
+          <inbox-name :inbox="inbox" class="margin-right-small" />
-            v-if="hasMultipleInboxes"
-            :inbox="inbox"
-            class="margin-right-small"
-          />
           <span
             v-if="isSnoozed"
             class="snoozed--display-text margin-right-small"
@@ -149,9 +145,6 @@ export default {
       const { inbox_id: inboxId } = this.chat;
       return this.$store.getters['inboxes/getInbox'](inboxId);
     },
-    hasMultipleInboxes() {
-      return this.$store.getters['inboxes/getInboxes'].length > 1;
-    },
   },
 
   methods: {

app/javascript/dashboard/components/widgets/conversation/Message.vue

@@ -15,6 +15,7 @@
           v-if="data.content"
           :message="message"
           :is-email="isEmailContentType"
+          :readable-time="readableTime"
           :display-quoted-button="displayQuotedButton"
         />
         <span
@@ -28,6 +29,7 @@
             <bubble-image
               v-if="attachment.file_type === 'image' && !hasImageError"
               :url="attachment.data_url"
+              :readable-time="readableTime"
               @error="onImageLoadError"
             />
             <audio v-else-if="attachment.file_type === 'audio'" controls>
@@ -36,6 +38,7 @@
             <bubble-video
               v-else-if="attachment.file_type === 'video'"
               :url="attachment.data_url"
+              :readable-time="readableTime"
             />
             <bubble-location
               v-else-if="attachment.file_type === 'location'"
@@ -43,7 +46,11 @@
               :longitude="attachment.coordinates_long"
               :name="attachment.fallback_title"
             />
-            <bubble-file v-else :url="attachment.data_url" />
+            <bubble-file
+              v-else
+              :url="attachment.data_url"
+              :readable-time="readableTime"
+            />
           </div>
         </div>
         <bubble-actions
@@ -58,9 +65,10 @@
           :is-private="data.private"
           :message-type="data.message_type"
           :message-status="status"
+          :readable-time="readableTime"
           :source-id="data.source_id"
           :inbox-id="data.inbox_id"
-          :created-at="createdAt"
+          :message-read="showReadTicks"
         />
       </div>
       <spinner v-if="isPending" size="tiny" />
@@ -111,6 +119,8 @@
 </template>
 <script>
 import messageFormatterMixin from 'shared/mixins/messageFormatterMixin';
+import timeMixin from '../../../mixins/time';
+
 import BubbleMailHead from './bubble/MailHead';
 import BubbleText from './bubble/Text';
 import BubbleImage from './bubble/Image';
@@ -139,7 +149,7 @@ export default {
     ContextMenu,
     Spinner,
   },
-  mixins: [alertMixin, messageFormatterMixin, contentTypeMixin],
+  mixins: [alertMixin, timeMixin, messageFormatterMixin, contentTypeMixin],
   props: {
     data: {
       type: Object,
@@ -157,6 +167,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    hasUserReadMessage: {
+      type: Boolean,
+      default: false,
+    },
     isWebWidgetInbox: {
       type: Boolean,
       default: false,
@@ -259,8 +273,11 @@ export default {
         'has-tweet-menu': this.isATweet,
       };
     },
-    createdAt() {
+    readableTime() {
-      return this.contentAttributes.external_created_at || this.data.created_at;
+      return this.messageStamp(
+        this.contentAttributes.external_created_at || this.data.created_at,
+        'LLL d, h:mm a'
+      );
     },
     isBubble() {
       return [0, 1, 3].includes(this.data.message_type);
@@ -271,6 +288,14 @@ export default {
     isOutgoing() {
       return this.data.message_type === MESSAGE_TYPE.OUTGOING;
     },
+    showReadTicks() {
+      return (
+        (this.isOutgoing || this.isTemplate) &&
+        this.hasUserReadMessage &&
+        this.isWebWidgetInbox &&
+        !this.data.private
+      );
+    },
     isTemplate() {
       return this.data.message_type === MESSAGE_TYPE.TEMPLATE;
     },

app/javascript/dashboard/components/widgets/conversation/MessagesView.vue

@@ -40,6 +40,9 @@
         :is-a-tweet="isATweet"
         :is-a-whatsapp-channel="isAWhatsAppChannel"
         :has-instagram-story="hasInstagramStory"
+        :has-user-read-message="
+          hasUserReadMessage(message.created_at, getLastSeenAt)
+        "
         :is-web-widget-inbox="isAWebWidgetInbox"
       />
       <li v-show="unreadMessageCount != 0" class="unread--toast">
@@ -60,6 +63,9 @@
         :is-a-tweet="isATweet"
         :is-a-whatsapp-channel="isAWhatsAppChannel"
         :has-instagram-story="hasInstagramStory"
+        :has-user-read-message="
+          hasUserReadMessage(message.created_at, getLastSeenAt)
+        "
         :is-web-widget-inbox="isAWebWidgetInbox"
       />
     </ul>

app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue

@@ -1,14 +1,8 @@
 <template>
   <div class="message-text--metadata">
-    <span
+    <span class="time" :class="{ delivered: messageRead }">{{
-      class="time"
+      readableTime
-      :class="{
+    }}</span>
-        'has-status-icon':
-          showSentIndicator || showDeliveredIndicator || showReadIndicator,
-      }"
-    >
-      {{ readableTime }}
-    </span>
     <span v-if="showReadIndicator" class="read-indicator-wrap">
       <fluent-icon
         v-tooltip.top-start="$t('CHAT_LIST.MESSAGE_READ')"
@@ -17,7 +11,7 @@
         size="14"
       />
     </span>
-    <span v-else-if="showDeliveredIndicator" class="read-indicator-wrap">
+    <span v-if="showDeliveredIndicator" class="read-indicator-wrap">
       <fluent-icon
         v-tooltip.top-start="$t('CHAT_LIST.DELIVERED')"
         icon="checkmark-double"
@@ -25,7 +19,7 @@
         size="14"
       />
     </span>
-    <span v-else-if="showSentIndicator" class="read-indicator-wrap">
+    <span v-if="showSentIndicator" class="read-indicator-wrap">
       <fluent-icon
         v-tooltip.top-start="$t('CHAT_LIST.SENT')"
         icon="checkmark"
@@ -80,19 +74,17 @@
 import { MESSAGE_TYPE, MESSAGE_STATUS } from 'shared/constants/messages';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
 import inboxMixin from 'shared/mixins/inboxMixin';
-import { mapGetters } from 'vuex';
-import timeMixin from '../../../../mixins/time';
 
 export default {
-  mixins: [inboxMixin, timeMixin],
+  mixins: [inboxMixin],
   props: {
     sender: {
       type: Object,
       default: () => ({}),
     },
-    createdAt: {
+    readableTime: {
-      type: Number,
+      type: String,
-      default: 0,
+      default: '',
     },
     storySender: {
       type: String,
@@ -138,9 +130,12 @@ export default {
       type: [String, Number],
       default: 0,
     },
+    messageRead: {
+      type: Boolean,
+      default: false,
+    },
   },
   computed: {
-    ...mapGetters({ currentChat: 'getSelectedChat' }),
     inbox() {
       return this.$store.getters['inboxes/getInbox'](this.inboxId);
     },
@@ -150,9 +145,6 @@ export default {
     isOutgoing() {
       return MESSAGE_TYPE.OUTGOING === this.messageType;
     },
-    isTemplate() {
-      return MESSAGE_TYPE.TEMPLATE === this.messageType;
-    },
     isDelivered() {
       return MESSAGE_STATUS.DELIVERED === this.messageStatus;
     },
@@ -162,9 +154,6 @@ export default {
     isSent() {
       return MESSAGE_STATUS.SENT === this.messageStatus;
     },
-    readableTime() {
-      return this.messageStamp(this.createdAt, 'LLL d, h:mm a');
-    },
     screenName() {
       const { additional_attributes: additionalAttributes = {} } =
         this.sender || {};
@@ -185,52 +174,28 @@ export default {
       const { storySender, storyId } = this;
       return `https://www.instagram.com/stories/${storySender}/${storyId}`;
     },
-    showStatusIndicators() {
-      if ((this.isOutgoing || this.isTemplate) && !this.private) {
-        return true;
-      }
-      return false;
-    },
     showSentIndicator() {
-      if (!this.showStatusIndicators) {
+      return (
-        return false;
+        this.isOutgoing &&
-      }
+        this.sourceId &&
-
+        (this.isAnEmailChannel || (this.isAWhatsAppChannel && this.isSent))
-      if (this.isAnEmailChannel) {
+      );
-        return !!this.sourceId;
-      }
-
-      if (this.isAWhatsAppChannel) {
-        return this.sourceId && this.isSent;
-      }
-      return false;
     },
     showDeliveredIndicator() {
-      if (!this.showStatusIndicators) {
+      return (
-        return false;
+        this.isOutgoing &&
-      }
+        this.sourceId &&
-
+        this.isAWhatsAppChannel &&
-      if (this.isAWhatsAppChannel) {
+        this.isDelivered
-        return this.sourceId && this.isDelivered;
+      );
-      }
-
-      return false;
     },
     showReadIndicator() {
-      if (!this.showStatusIndicators) {
+      return (
-        return false;
+        this.isOutgoing &&
-      }
+        this.sourceId &&
-
+        this.isAWhatsAppChannel &&
-      if (this.isAWebWidgetInbox) {
+        this.isRead
-        const { contact_last_seen_at: contactLastSeenAt } = this.currentChat;
+      );
-        return contactLastSeenAt >= this.createdAt;
-      }
-
-      if (this.isAWhatsAppChannel) {
-        return this.sourceId && this.isRead;
-      }
-
-      return false;
     },
   },
   methods: {
@@ -253,13 +218,12 @@ export default {
 
     .action--icon {
       color: var(--white);
-
       &.read-tick {
         color: var(--v-100);
       }
 
       &.read-indicator {
-        color: var(--g-200);
+        color: var(--g-300);
       }
     }
 
@@ -324,9 +288,8 @@ export default {
       position: absolute;
       right: var(--space-small);
       white-space: nowrap;
-
+      &.delivered {
-      &.has-status-icon {
+        right: var(--space-medium);
-        right: var(--space-large);
         line-height: 2;
       }
     }

app/javascript/dashboard/components/widgets/conversation/bubble/Text.vue

@@ -35,6 +35,10 @@ export default {
       type: String,
       default: '',
     },
+    readableTime: {
+      type: String,
+      default: '',
+    },
     isEmail: {
       type: Boolean,
       default: true,

app/javascript/dashboard/i18n/locale/ar/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "اختر حساباً من القائمة التالية",
     "PROFILE_SETTINGS": "إعدادات الملف الشخصي",
     "KEYBOARD_SHORTCUTS": "اختصارات لوحة المفاتيح",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "تسجيل الخروج"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/bg/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ca/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Selecciona un compte de la llista següent",
     "PROFILE_SETTINGS": "Configuració del Perfil",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Sortir"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/cs/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Vyberte účet z následujícího seznamu",
     "PROFILE_SETTINGS": "Nastavení profilu",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Odhlásit se"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/da/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Vælg en konto fra følgende liste",
     "PROFILE_SETTINGS": "Profilindstillinger",
     "KEYBOARD_SHORTCUTS": "Tastaturgenveje",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Log Ud"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/de/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Wählen Sie ein Benutzerkonto aus der folgenden Liste",
     "PROFILE_SETTINGS": "Profileinstellungen",
     "KEYBOARD_SHORTCUTS": "Tastenkombinationen",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Ausloggen"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/el/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Επιλέξτε ένα λογαριασμό από την Λίστα",
     "PROFILE_SETTINGS": "Ρυθμίσεις Προφίλ",
     "KEYBOARD_SHORTCUTS": "Συντομεύσεις Πληκτρολογίου",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Κονσόλα",
     "LOGOUT": "Έξοδος (Logout)"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/es/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Seleccione una cuenta de la siguiente lista",
     "PROFILE_SETTINGS": "Ajustes del perfil",
     "KEYBOARD_SHORTCUTS": "Atajos de teclado",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Cerrar sesión"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/fa/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "از لیست یکی از حساب‌ها را انتخاب کنید",
     "PROFILE_SETTINGS": "تنظیمات پروفایل",
     "KEYBOARD_SHORTCUTS": "میانبرهای صفحه‌کلید",
-    "SUPER_ADMIN_CONSOLE": "کنسول سوپر مدیر",
     "LOGOUT": "خروج از حساب‌کاربری"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/fi/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Valitse tili tästä luettelosta",
     "PROFILE_SETTINGS": "Profiilin asetukset",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Kirjaudu ulos"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/fr/advancedFilters.json

@@ -1,28 +1,28 @@
 {
   "FILTER": {
     "TITLE": "Filtrer les conversations",
-    "SUBTITLE": "Ajoutez des filtres ci-dessous et appuyez sur 'Appliquer des filtres' pour filtrer les conversations.",
+    "SUBTITLE": "Add filters below and hit 'Apply filters' to filter conversations.",
     "ADD_NEW_FILTER": "Ajouter un filtre",
     "FILTER_DELETE_ERROR": "Vous devriez avoir au moins un filtre afin d'enregistrer",
     "SUBMIT_BUTTON_LABEL": "Appliquer les filtres",
     "CANCEL_BUTTON_LABEL": "Annuler",
-    "CLEAR_BUTTON_LABEL": "Effacer les filtres",
+    "CLEAR_BUTTON_LABEL": "Clear Filters",
     "EMPTY_VALUE_ERROR": "Value is required",
-    "TOOLTIP_LABEL": "Filtrer les conversations",
+    "TOOLTIP_LABEL": "Filter conversations",
     "QUERY_DROPDOWN_LABELS": {
       "AND": "ET",
       "OR": "OU"
     },
     "OPERATOR_LABELS": {
-      "equal_to": "Égal à",
+      "equal_to": "Equal to",
-      "not_equal_to": "Pas égal à",
+      "not_equal_to": "Not equal to",
-      "contains": "Contient",
+      "contains": "Contains",
-      "does_not_contain": "Ne contient pas",
+      "does_not_contain": "Does not contain",
-      "is_present": "Est présent",
+      "is_present": "Is present",
-      "is_not_present": "N'est pas présent",
+      "is_not_present": "Is not present",
-      "is_greater_than": "Est plus grand que",
+      "is_greater_than": "Is greater than",
-      "is_less_than": "Est inférieur à",
+      "is_less_than": "Is lesser than",
-      "days_before": "Est x jours avant"
+      "days_before": "Is x days before"
     },
     "ATTRIBUTE_LABELS": {
       "TRUE": "Vrai",
@@ -32,19 +32,19 @@
       "STATUS": "État",
       "ASSIGNEE_NAME": "Assignee Name",
       "INBOX_NAME": "Nom de la boîte de réception",
-      "TEAM_NAME": "Nom de l'équipe",
+      "TEAM_NAME": "Team Name",
       "CONVERSATION_IDENTIFIER": "Conversation Identifier",
       "CAMPAIGN_NAME": "Campaign Name",
       "LABELS": "Étiquettes",
-      "BROWSER_LANGUAGE": "Langue du navigateur",
+      "BROWSER_LANGUAGE": "Browser Language",
-      "COUNTRY_NAME": "Nom du pays",
+      "COUNTRY_NAME": "Country Name",
       "REFERER_LINK": "Referer link",
-      "CUSTOM_ATTRIBUTE_LIST": "Liste",
+      "CUSTOM_ATTRIBUTE_LIST": "List",
-      "CUSTOM_ATTRIBUTE_TEXT": "Texte",
+      "CUSTOM_ATTRIBUTE_TEXT": "Text",
-      "CUSTOM_ATTRIBUTE_NUMBER": "Nombre",
+      "CUSTOM_ATTRIBUTE_NUMBER": "Number",
-      "CUSTOM_ATTRIBUTE_LINK": "Lien",
+      "CUSTOM_ATTRIBUTE_LINK": "Link",
-      "CUSTOM_ATTRIBUTE_CHECKBOX": "Case à cocher",
+      "CUSTOM_ATTRIBUTE_CHECKBOX": "Checkbox",
-      "CREATED_AT": "Créé le",
+      "CREATED_AT": "Created At",
       "LAST_ACTIVITY": "Dernière activité"
     },
     "GROUPS": {
@@ -70,7 +70,7 @@
         }
       },
       "DELETE": {
-        "DELETE_BUTTON": "Supprimer le filtre",
+        "DELETE_BUTTON": "Delete filter",
         "MODAL": {
           "CONFIRM": {
             "TITLE": "Confirmer la suppression",

app/javascript/dashboard/i18n/locale/fr/chatlist.json

@@ -8,7 +8,7 @@
     },
     "TAB_HEADING": "Conversations",
     "MENTION_HEADING": "Mentions",
-    "UNATTENDED_HEADING": "Sans suivi",
+    "UNATTENDED_HEADING": "Unattended",
     "SEARCH": {
       "INPUT": "Rechercher des personnes, des conversations, des réponses standardisées ..."
     },
@@ -57,12 +57,12 @@
     "REPLY_TO_TWEET": "Répondre à ce tweet",
     "LINK_TO_STORY": "Aller à l'histoire instagram",
     "SENT": "Envoyé avec succès",
-    "READ": "Lu",
+    "READ": "Read successfully",
-    "DELIVERED": "Reçu",
+    "DELIVERED": "Delivered successfully",
     "NO_MESSAGES": "Pas de messages",
     "NO_CONTENT": "Aucun contenu disponible",
     "HIDE_QUOTED_TEXT": "Masquer le texte cité",
     "SHOW_QUOTED_TEXT": "Afficher le texte cité",
-    "MESSAGE_READ": "Lu"
+    "MESSAGE_READ": "Read"
   }
 }

app/javascript/dashboard/i18n/locale/fr/contact.json

@@ -7,7 +7,7 @@
     "COPY_SUCCESSFUL": "Copié dans le presse-papiers avec succès",
     "COMPANY": "Société",
     "LOCATION": "Localisation",
-    "BROWSER_LANGUAGE": "Langue du navigateur",
+    "BROWSER_LANGUAGE": "Browser Language",
     "CONVERSATION_TITLE": "Détails de la conversation",
     "VIEW_PROFILE": "Voir le profil",
     "BROWSER": "Navigateur",

app/javascript/dashboard/i18n/locale/fr/contactFilters.json

@@ -7,7 +7,7 @@
         "FILTER_DELETE_ERROR": "Vous devriez avoir au moins un filtre afin d'enregistrer",
         "SUBMIT_BUTTON_LABEL": "Envoyer",
         "CANCEL_BUTTON_LABEL": "Annuler",
-        "CLEAR_BUTTON_LABEL": "Effacer les filtres",
+        "CLEAR_BUTTON_LABEL": "Clear Filters",
         "EMPTY_VALUE_ERROR": "Value is required",
         "TOOLTIP_LABEL": "Filter contacts",
         "QUERY_DROPDOWN_LABELS": {
@@ -15,15 +15,15 @@
             "OR": "OU"
         },
         "OPERATOR_LABELS": {
-            "equal_to": "Égal à",
+            "equal_to": "Equal to",
-            "not_equal_to": "Pas égal à",
+            "not_equal_to": "Not equal to",
-            "contains": "Contient",
+            "contains": "Contains",
-            "does_not_contain": "Ne contient pas",
+            "does_not_contain": "Does not contain",
-            "is_present": "Est présent",
+            "is_present": "Is present",
-            "is_not_present": "N'est pas présent",
+            "is_not_present": "Is not present",
-            "is_greater_than": "Est plus grand que",
+            "is_greater_than": "Is greater than",
             "is_lesser_than": "Is lesser than",
-            "days_before": "Est x jours avant"
+            "days_before": "Is x days before"
         },
         "ATTRIBUTES": {
             "NAME": "Nom",
@@ -32,12 +32,12 @@
             "IDENTIFIER": "Identifier",
             "CITY": "Ville",
             "COUNTRY": "Pays",
-            "CUSTOM_ATTRIBUTE_LIST": "Liste",
+            "CUSTOM_ATTRIBUTE_LIST": "List",
-            "CUSTOM_ATTRIBUTE_TEXT": "Texte",
+            "CUSTOM_ATTRIBUTE_TEXT": "Text",
-            "CUSTOM_ATTRIBUTE_NUMBER": "Nombre",
+            "CUSTOM_ATTRIBUTE_NUMBER": "Number",
-            "CUSTOM_ATTRIBUTE_LINK": "Lien",
+            "CUSTOM_ATTRIBUTE_LINK": "Link",
-            "CUSTOM_ATTRIBUTE_CHECKBOX": "Case à cocher",
+            "CUSTOM_ATTRIBUTE_CHECKBOX": "Checkbox",
-            "CREATED_AT": "Créé le",
+            "CREATED_AT": "Created At",
             "LAST_ACTIVITY": "Dernière activité",
             "REFERER_LINK": "Referrer link"
         },

app/javascript/dashboard/i18n/locale/fr/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Sélectionnez un compte dans la liste suivante",
     "PROFILE_SETTINGS": "Paramètres de profil",
     "KEYBOARD_SHORTCUTS": "Raccourcis clavier",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Se déconnecter"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/fr/signup.json

@@ -2,13 +2,13 @@
   "REGISTER": {
     "TRY_WOOT": "Créer un compte",
     "TITLE": "Inscription",
-    "TESTIMONIAL_HEADER": "Il suffit d'une étape pour avancer",
+    "TESTIMONIAL_HEADER": "All it takes is one step to move forward",
-    "TESTIMONIAL_CONTENT": "Vous n'êtes plus qu'à un pas d'engager vos clients, de les fidéliser et d'en trouver de nouveaux.",
+    "TESTIMONIAL_CONTENT": "You're one step away from engaging your customers, retaining them and finding new ones.",
     "TERMS_ACCEPT": "En vous inscrivant, vous acceptez nos <a href=\"https://www.chatwoot.com/terms\">CGU</a> et notre <a href=\"https://www.chatwoot.com/privacy-policy\">politique de confidentialité</a>",
     "COMPANY_NAME": {
-      "LABEL": "Nom de la société",
+      "LABEL": "Company name",
-      "PLACEHOLDER": "Entrez le nom de votre entreprise. Ex : Wayne Enterprises",
+      "PLACEHOLDER": "Enter your company name. eg: Wayne Enterprises",
-      "ERROR": "Le nom de la société est trop court"
+      "ERROR": "Company name is too short"
     },
     "FULL_NAME": {
       "LABEL": "Nom complet",
@@ -18,13 +18,13 @@
     "EMAIL": {
       "LABEL": "E-mail professionnel",
       "PLACEHOLDER": "Entrez votre adresse e-mail professionnelle. Ex. : bruce@wayne.enterprises",
-      "ERROR": "Veuillez entrer une adresse e-mail professionnelle valide"
+      "ERROR": "Please enter a valid work email address"
     },
     "PASSWORD": {
       "LABEL": "Mot de passe",
       "PLACEHOLDER": "Mot de passe",
       "ERROR": "Le mot de passe est trop court",
-      "IS_INVALID_PASSWORD": "Le mot de passe doit contenir au moins 1 lettre majuscule, 1 lettre minuscule, 1 chiffre et 1 caractère spécial"
+      "IS_INVALID_PASSWORD": "Password should contain atleast 1 uppercase letter, 1 lowercase letter, 1 number and 1 special character"
     },
     "CONFIRM_PASSWORD": {
       "LABEL": "Confirmer le mot de passe",

app/javascript/dashboard/i18n/locale/he/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "התנתק"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/hi/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/hu/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Fiók kiválasztása az alábbi listából",
     "PROFILE_SETTINGS": "Profilbeállítások",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Kilépés"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/id/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Pilih akun dari daftar berikut",
     "PROFILE_SETTINGS": "Pengaturan Profil",
     "KEYBOARD_SHORTCUTS": "Shortcut Keyboard",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Keluar"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/is/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Veldu reikning úr eftirfarandi lista",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/it/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Seleziona un account dal seguente elenco",
     "PROFILE_SETTINGS": "Impostazioni profilo",
     "KEYBOARD_SHORTCUTS": "Scorciatoie da tastiera",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Disconnettiti"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ja/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "次のリストからアカウントを選択してください",
     "PROFILE_SETTINGS": "プロフィール設定",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "ログアウト"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ka/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ko/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "다음 목록에서 계정 선택",
     "PROFILE_SETTINGS": "프로필 설정",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "로그아웃"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/lt/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/lv/conversation.json

@@ -42,8 +42,8 @@
     "RATING_TITLE": "Vērtējums",
     "FEEDBACK_TITLE": "Atsauksmes",
     "CARD": {
-      "SHOW_LABELS": "Rādīt etiķetes",
+      "SHOW_LABELS": "Show labels",
-      "HIDE_LABELS": "Slēpt etiķetes"
+      "HIDE_LABELS": "Hide labels"
     },
     "HEADER": {
       "RESOLVE_ACTION": "Atrisināt",

app/javascript/dashboard/i18n/locale/lv/settings.json

@@ -104,8 +104,8 @@
           "Aizņemts",
           "Bezsaistē"
         ],
-        "SET_AVAILABILITY_SUCCESS": "Pieejamība ir veiksmīgi iestatīta",
+        "SET_AVAILABILITY_SUCCESS": "Availability has been set successfully",
-        "SET_AVAILABILITY_ERROR": "Nevarēja iestatīt pieejamību. Lūdzu, mēģiniet vēlreiz"
+        "SET_AVAILABILITY_ERROR": "Couldn't set availability, please try again"
       },
       "EMAIL": {
         "LABEL": "Jūsu e-pasta adrese",
@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Izvēlieties kontu no šī saraksta",
     "PROFILE_SETTINGS": "Profila Iestatījumi",
     "KEYBOARD_SHORTCUTS": "Tastatūras Īsinājumtaustiņi",
-    "SUPER_ADMIN_CONSOLE": "Superadministratora Konsole",
     "LOGOUT": "Izrakstīties"
   },
   "APP_GLOBAL": {
@@ -230,8 +229,8 @@
       "CATEGORY_EMPTY_MESSAGE": "Kategorijas nav atrastas"
     },
     "SET_AUTO_OFFLINE": {
-      "TEXT": "Automātiski atzīmēt bezsaistē",
+      "TEXT": "Mark offline automatically",
-      "INFO_TEXT": "Ļaut sistēmai, kad neizmantojat lietotni vai informācijas paneli, automātiski atzīmēt Jūs bezsaistē."
+      "INFO_TEXT": "Let the system automatically mark you offline when you aren't using the app or dashboard."
     },
     "DOCS": "Lasīt dokumentus"
   },

app/javascript/dashboard/i18n/locale/ml/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "ഇനിപ്പറയുന്ന ലിസ്റ്റിൽ നിന്ന് ഒരു അക്കൗണ്ട് തിരഞ്ഞെടുക്കുക",
     "PROFILE_SETTINGS": "പ്രൊഫൈൽ ക്രമീകരണങ്ങൾ",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "ലോഗൗട്ട്"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ms/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ne/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/nl/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profiel instellingen",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Afmelden"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/no/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Velg en konto fra følgende liste",
     "PROFILE_SETTINGS": "Brukerinnstillinger",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logg ut"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/pl/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Ustawienia profilu",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Wyloguj się"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/pt/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Escolha uma conta da lista a seguir",
     "PROFILE_SETTINGS": "Configurações do perfil",
     "KEYBOARD_SHORTCUTS": "Atalhos do teclado",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Desconectar"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/pt_BR/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Selecione uma conta da lista a seguir",
     "PROFILE_SETTINGS": "Configurações do Perfil",
     "KEYBOARD_SHORTCUTS": "Atalhos do teclado",
-    "SUPER_ADMIN_CONSOLE": "Console de Super Admin",
     "LOGOUT": "Sair"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ro/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Selectaţi un cont din următoarea listă",
     "PROFILE_SETTINGS": "Setări profil",
     "KEYBOARD_SHORTCUTS": "Scurtături Tastatură",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Deconectare"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ru/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Выберите аккаунт из списка",
     "PROFILE_SETTINGS": "Настройки профиля",
     "KEYBOARD_SHORTCUTS": "Клавиши быстрого доступа",
-    "SUPER_ADMIN_CONSOLE": "Консоль супер администратора",
     "LOGOUT": "Выйти"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/sk/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Vyberte účet z nasledujúceho zoznamu",
     "PROFILE_SETTINGS": "Nastavenia profilu",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/sr/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Izaberite nalog iz sledećeg spiska",
     "PROFILE_SETTINGS": "Podešavanja profila",
     "KEYBOARD_SHORTCUTS": "Prečice tastature",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Odjavi se"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/sv/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Välj ett konto från följande lista",
     "PROFILE_SETTINGS": "Profilinställningar",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logga ut"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ta/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "பின்வரும் பட்டியலிலிருந்து ஒரு கணக்கைத் தேர்ந்தெடுக்கவும்",
     "PROFILE_SETTINGS": "சுயவிவர அமைப்புகள்",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "வெளியேறு"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/th/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "เลือกบัญชีจากรายชื่อต่อไปนี้",
     "PROFILE_SETTINGS": "ตั้งค่าข้อมูลส่วนตัว",
     "KEYBOARD_SHORTCUTS": "คีย์ลัด",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "ออกจากระบบ"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/tr/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Aşağıdaki listeden bir hesap seçin",
     "PROFILE_SETTINGS": "Profil ayarları",
     "KEYBOARD_SHORTCUTS": "Klavye Kısayolları",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Çıkış Yap"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/uk/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Виберіть обліковий запис із наступного списку",
     "PROFILE_SETTINGS": "Налаштування облікового запису",
     "KEYBOARD_SHORTCUTS": "Комбінації клавіш",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Вийти"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ur/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/ur_IN/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Select an account from the following list",
     "PROFILE_SETTINGS": "Profile Settings",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Logout"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/vi/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "Chọn một tài khoản từ danh sách sau",
     "PROFILE_SETTINGS": "Cài Đặt Hồ Sơ Cá Nhân",
     "KEYBOARD_SHORTCUTS": "Phím tắt",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "Đăng xuất"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/zh_CN/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "从以下列表中选择一个账户",
     "PROFILE_SETTINGS": "个人资料设置",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "退出登录"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/i18n/locale/zh_TW/settings.json

@@ -136,7 +136,6 @@
     "SELECTOR_SUBTITLE": "從以下列表中選擇一個帳戶",
     "PROFILE_SETTINGS": "個人資料設定",
     "KEYBOARD_SHORTCUTS": "Keyboard Shortcuts",
-    "SUPER_ADMIN_CONSOLE": "Super Admin Console",
     "LOGOUT": "退出登入"
   },
   "APP_GLOBAL": {

app/javascript/dashboard/mixins/conversations.js

@@ -34,6 +34,9 @@ export default {
         lastNonActivityMessageFromAPI
       );
     },
+    hasUserReadMessage(createdAt, contactLastSeen) {
+      return !(contactLastSeen - createdAt < 0);
+    },
     readMessages(m) {
       return m.messages.filter(
         chat => chat.created_at * 1000 <= m.agent_last_seen_at * 1000

app/javascript/dashboard/routes/dashboard/Dashboard.vue

@@ -2,14 +2,14 @@
   <div class="row app-wrapper">
     <sidebar
       :route="currentRoute"
-      :show-secondary-sidebar="isSidebarOpen"
+      :sidebar-class-name="sidebarClassName"
       @open-notification-panel="openNotificationPanel"
       @toggle-account-modal="toggleAccountModal"
       @open-key-shortcut-modal="toggleKeyShortcutModal"
       @close-key-shortcut-modal="closeKeyShortcutModal"
       @show-add-label-popup="showAddLabelPopup"
     />
-    <section class="app-content columns">
+    <section class="app-content columns" :class="contentClassName">
       <router-view />
       <command-bar />
       <account-selector
@@ -46,7 +46,6 @@ import AddAccountModal from 'dashboard/components/layout/sidebarComponents/AddAc
 import AccountSelector from 'dashboard/components/layout/sidebarComponents/AccountSelector';
 import AddLabelModal from 'dashboard/routes/dashboard/settings/labels/AddLabel';
 import NotificationPanel from 'dashboard/routes/dashboard/notifications/components/NotificationPanel';
-import uiSettingsMixin from 'dashboard/mixins/uiSettings';
 
 export default {
   components: {
@@ -58,9 +57,9 @@ export default {
     AddLabelModal,
     NotificationPanel,
   },
-  mixins: [uiSettingsMixin],
   data() {
     return {
+      isSidebarOpen: false,
       isOnDesktop: true,
       showAccountModal: false,
       showCreateAccountModal: false,
@@ -73,22 +72,44 @@ export default {
     currentRoute() {
       return ' ';
     },
-    isSidebarOpen() {
+    sidebarClassName() {
-      const { show_secondary_sidebar: showSecondarySidebar } = this.uiSettings;
+      if (this.isOnDesktop) {
-      return showSecondarySidebar;
+        return '';
+      }
+      if (this.isSidebarOpen) {
+        return 'off-canvas is-open';
+      }
+      return 'off-canvas is-transition-push is-closed';
+    },
+    contentClassName() {
+      if (this.isOnDesktop) {
+        return '';
+      }
+      if (this.isSidebarOpen) {
+        return 'off-canvas-content is-open-left has-transition-push';
+      }
+      return 'off-canvas-content has-transition-push';
     },
   },
   mounted() {
+    window.addEventListener('resize', this.handleResize);
+    this.handleResize();
     bus.$on(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
   },
   beforeDestroy() {
     bus.$off(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
+    window.removeEventListener('resize', this.handleResize);
   },
   methods: {
+    handleResize() {
+      if (window.innerWidth >= 1200) {
+        this.isOnDesktop = true;
+      } else {
+        this.isOnDesktop = false;
+      }
+    },
     toggleSidebar() {
-      this.updateUISettings({
+      this.isSidebarOpen = !this.isSidebarOpen;
-        show_secondary_sidebar: !this.isSidebarOpen,
-      });
     },
     openCreateAccountModal() {
       this.showAccountModal = false;
@@ -121,3 +142,8 @@ export default {
   },
 };
 </script>
+<style lang="scss" scoped>
+.off-canvas-content.is-open-left {
+  transform: translateX(20rem);
+}
+</style>

app/javascript/dashboard/routes/dashboard/conversation/contact/ConversationForm.vue

@@ -66,7 +66,7 @@
               @click="replaceTextWithCannedResponse"
             />
           </div>
-          <div v-if="isEmailOrWebWidgetInbox">
+          <div v-if="isAnEmailInbox || isAnWebWidgetInbox">
             <label>
               {{ $t('NEW_CONVERSATION.FORM.MESSAGE.LABEL') }}
               <reply-email-head
@@ -80,7 +80,6 @@
                   class="message-editor"
                   :class="{ editor_warning: $v.message.$error }"
                   :placeholder="$t('NEW_CONVERSATION.FORM.MESSAGE.PLACEHOLDER')"
-                  @toggle-canned-menu="toggleCannedMenu"
                   @blur="$v.message.$touch"
                 />
                 <span v-if="$v.message.$error" class="editor-warning__message">
@@ -230,16 +229,13 @@ export default {
         this.selectedInbox.inbox.channel_type === INBOX_TYPES.WEB
       );
     },
-    isEmailOrWebWidgetInbox() {
-      return this.isAnEmailInbox || this.isAnWebWidgetInbox;
-    },
     hasWhatsappTemplates() {
       return !!this.selectedInbox.inbox?.message_templates;
     },
   },
   watch: {
     message(value) {
-      this.hasSlashCommand = value[0] === '/' && !this.isEmailOrWebWidgetInbox;
+      this.hasSlashCommand = value[0] === '/';
       const hasNextWord = value.includes(' ');
       const isShortCodeActive = this.hasSlashCommand && !hasNextWord;
       if (isShortCodeActive) {
@@ -263,9 +259,6 @@ export default {
         this.message = message;
       }, 50);
     },
-    toggleCannedMenu(value) {
-      this.showCannedMenu = value;
-    },
     prepareWhatsAppMessagePayload({ message: content, templateParams }) {
       const payload = {
         inboxId: this.targetInbox.inbox.id,
@@ -322,10 +315,12 @@ export default {
 }
 
 .canned-response {
+  position: relative;
+  top: var(--space-medium);
+
   ::v-deep .mention--box {
     border-left: 1px solid var(--color-border);
     border-right: 1px solid var(--color-border);
-    top: var(--space-jumbo) !important;
   }
 }
 
@@ -360,14 +355,4 @@ export default {
 .row.gutter-small {
   gap: var(--space-small);
 }
-
-::v-deep .mention--box {
-  border-left: 1px solid var(--color-border);
-  border-right: 1px solid var(--color-border);
-  left: 0;
-  margin: auto;
-  right: 0;
-  top: 18rem !important;
-  width: 90%;
-}
 </style>

app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue

@@ -1,22 +1,20 @@
 <template>
   <div v-on-clickaway="closeSearch" class="search-wrap">
-    <div class="search-header--wrap">
+    <div class="search" :class="{ 'is-active': showSearchBox }">
-      <woot-sidemenu-icon v-if="!showSearchBox" />
+      <woot-sidemenu-icon />
-      <div class="search" :class="{ 'is-active': showSearchBox }">
+      <div class="icon">
-        <div class="icon">
+        <fluent-icon icon="search" class="search--icon" size="28" />
-          <fluent-icon icon="search" class="search--icon" size="28" />
-        </div>
-        <input
-          v-model="searchTerm"
-          class="search--input"
-          :placeholder="$t('CONVERSATION.SEARCH_MESSAGES')"
-          @focus="onSearch"
-        />
-        <switch-layout
-          :is-on-expanded-layout="isOnExpandedLayout"
-          @toggle="$emit('toggle-conversation-layout')"
-        />
       </div>
+      <input
+        v-model="searchTerm"
+        class="search--input"
+        :placeholder="$t('CONVERSATION.SEARCH_MESSAGES')"
+        @focus="onSearch"
+      />
+      <switch-layout
+        :is-on-expanded-layout="isOnExpandedLayout"
+        @toggle="$emit('toggle-conversation-layout')"
+      />
     </div>
     <div v-if="showSearchBox" class="results-wrap">
       <div class="show-results">
@@ -155,21 +153,14 @@ export default {
 <style lang="scss" scoped>
 .search-wrap {
   position: relative;
-  padding: var(--space-one) var(--space-normal) var(--space-smaller)
-    var(--space-normal);
-}
-
-.search-header--wrap {
-  display: flex;
-  justify-content: space-between;
-  min-height: var(--space-large);
 }
 
 .search {
   display: flex;
-  flex: 1;
   padding: 0;
   border-bottom: 1px solid transparent;
+  padding: var(--space-one) var(--space-normal) var(--space-smaller)
+    var(--space-normal);
 
   &:hover {
     .search--icon {
@@ -214,7 +205,6 @@ input::placeholder {
   width: 100%;
   max-height: 70vh;
   overflow: auto;
-  left: 0;
 }
 
 .show-results {

app/javascript/dashboard/routes/dashboard/helpcenter/components/HelpCenterLayout.vue

@@ -8,7 +8,8 @@
       @close-key-shortcut-modal="closeKeyShortcutModal"
     />
     <help-center-sidebar
-      v-if="showHelpCenterSidebar"
+      v-if="portals.length"
+      :class="sidebarClassName"
       :header-title="headerTitle"
       :portal-slug="selectedPortalSlug"
       :locale-slug="selectedLocaleInPortal"
@@ -18,7 +19,7 @@
       @open-popover="openPortalPopover"
       @open-modal="onClickOpenAddCategoryModal"
     />
-    <section class="app-content columns">
+    <section class="app-content columns" :class="contentClassName">
       <router-view />
       <command-bar />
       <account-selector
@@ -83,6 +84,7 @@ export default {
   mixins: [portalMixin, uiSettingsMixin],
   data() {
     return {
+      isSidebarOpen: false,
       isOnDesktop: true,
       showShortcutModal: false,
       showNotificationPanel: false,
@@ -101,15 +103,6 @@ export default {
       meta: 'portals/getMeta',
       isFetching: 'portals/isFetchingPortals',
     }),
-    isSidebarOpen() {
-      const {
-        show_help_center_secondary_sidebar: showSecondarySidebar,
-      } = this.uiSettings;
-      return showSecondarySidebar;
-    },
-    showHelpCenterSidebar() {
-      return this.portals.length === 0 ? false : this.isSidebarOpen;
-    },
     selectedPortal() {
       const slug = this.$route.params.portalSlug || this.lastActivePortalSlug;
       if (slug) return this.$store.getters['portals/portalBySlug'](slug);
@@ -119,6 +112,24 @@ export default {
     selectedLocaleInPortal() {
       return this.$route.params.locale || this.defaultPortalLocale;
     },
+    sidebarClassName() {
+      if (this.isOnDesktop) {
+        return '';
+      }
+      if (this.isSidebarOpen) {
+        return 'off-canvas is-open';
+      }
+      return 'off-canvas is-transition-push is-closed';
+    },
+    contentClassName() {
+      if (this.isOnDesktop) {
+        return '';
+      }
+      if (this.isSidebarOpen) {
+        return 'off-canvas-content is-open-left has-transition-push';
+      }
+      return 'off-canvas-content has-transition-push';
+    },
     selectedPortalName() {
       return this.selectedPortal ? this.selectedPortal.name : '';
     },
@@ -216,27 +227,9 @@ export default {
     },
   },
 
-  watch: {
-    '$route.name'() {
-      const routeName = this.$route?.name;
-      const routeParams = this.$route?.params;
-      const updateMetaInAllPortals = routeName === 'list_all_portals';
-      const updateMetaInEditArticle =
-        routeName === 'edit_article' && routeParams?.recentlyCreated;
-      const updateMetaInLocaleArticles =
-        routeName === 'list_all_locale_articles' &&
-        routeParams?.recentlyDeleted;
-      if (
-        updateMetaInAllPortals ||
-        updateMetaInEditArticle ||
-        updateMetaInLocaleArticles
-      ) {
-        this.fetchPortalAndItsCategories();
-      }
-    },
-  },
-
   mounted() {
+    window.addEventListener('resize', this.handleResize);
+    this.handleResize();
     bus.$on(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
 
     const slug = this.$route.params.portalSlug;
@@ -246,6 +239,7 @@ export default {
   },
   beforeDestroy() {
     bus.$off(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
+    window.removeEventListener('resize', this.handleResize);
   },
   updated() {
     const slug = this.$route.params.portalSlug;
@@ -258,13 +252,16 @@ export default {
     }
   },
   methods: {
-    toggleSidebar() {
+    handleResize() {
-      if (this.portals.length > 0) {
+      if (window.innerWidth > 1200) {
-        this.updateUISettings({
+        this.isOnDesktop = true;
-          show_help_center_secondary_sidebar: !this.isSidebarOpen,
+      } else {
-        });
+        this.isOnDesktop = false;
       }
     },
+    toggleSidebar() {
+      this.isSidebarOpen = !this.isSidebarOpen;
+    },
     async fetchPortalAndItsCategories() {
       await this.$store.dispatch('portals/index');
       const selectedPortalParam = {
@@ -305,3 +302,8 @@ export default {
   },
 };
 </script>
+<style lang="scss" scoped>
+.off-canvas-content.is-open-left.has-transition-push {
+  transform: translateX(var(--space-giga));
+}
+</style>

app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalListItem.vue

@@ -236,10 +236,8 @@ export default {
       });
     },
     articleCount() {
-      const { allowed_locales: allowedLocales } = this.portal.config;
+      const { all_articles_count: count } = this.portal.meta;
-      return allowedLocales.reduce((acc, locale) => {
+      return count;
-        return acc + locale.articles_count;
-      }, 0);
     },
   },
   methods: {

app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalSwitch.vue

@@ -105,10 +105,7 @@ export default {
       return this.portal?.config?.allowed_locales;
     },
     articlesCount() {
-      const { allowed_locales: allowedLocales } = this.portal.config;
+      return this.portal?.meta?.all_articles_count;
-      return allowedLocales.reduce((acc, locale) => {
-        return acc + locale.articles_count;
-      }, 0);
     },
   },
   mounted() {

app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/EditArticle.vue

@@ -151,7 +151,6 @@ export default {
           params: {
             portalSlug: this.selectedPortalSlug,
             locale: this.locale,
-            recentlyDeleted: true,
           },
         });
       } catch (error) {

app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/NewArticle.vue

@@ -87,7 +87,6 @@ export default {
               articleSlug: articleId,
               portalSlug: this.selectedPortalSlug,
               locale: this.locale,
-              recentlyCreated: true,
             },
           });
         } catch (error) {

app/javascript/shared/components/ResizableTextArea.vue

@@ -37,13 +37,6 @@ export default {
       this.resizeTextarea();
     },
   },
-  mounted() {
-    this.$nextTick(() => {
-      if (this.value) {
-        this.resizeTextarea();
-      }
-    });
-  },
   methods: {
     resizeTextarea() {
       if (!this.value) {

app/javascript/survey/views/Response.vue

@@ -174,7 +174,7 @@ export default {
           feedback_message: this.feedbackMessage,
         };
       } catch (error) {
-        const errorMessage = error?.response?.data?.error;
+        const errorMessage = error?.response?.data?.message;
         this.errorMessage = errorMessage || this.$t('SURVEY.API.ERROR_MESSAGE');
       } finally {
         this.isUpdating = false;

config/initializers/devise_token_auth.rb

@@ -15,7 +15,7 @@ DeviseTokenAuth.setup do |config|
 
   # Sets the max number of concurrent devices per user, which is 10 by default.
   # After this limit is reached, the oldest tokens will be removed.
-  config.max_number_of_devices = 25
+  # config.max_number_of_devices = 10
 
   # Sometimes it's necessary to make several requests to the API at the same
   # time. In this case, each request in the batch will need to share the same

config/locales/fr.yml

@@ -48,11 +48,11 @@ fr:
       imap:
         socket_error: Veuillez vérifier la connexion, l'adresse IMAP et réessayez.
         no_response_error: Veuillez vérifier les identifiants IMAP et réessayez.
-        host_unreachable_error: Hôte injoignable, veuillez vérifier l'adresse IMAP, le port IMAP et réessayer.
+        host_unreachable_error: Host unreachable, Please check the IMAP address, IMAP port and try again.
-        connection_timed_out_error: La connexion a expiré pour %{address}:%{port}
+        connection_timed_out_error: Connection timed out for %{address}:%{port}
-        connection_closed_error: Connexion fermée.
+        connection_closed_error: Connection closed.
       validations:
-        name: 'ne doit pas commencer ou se terminer par des symboles, et ne doit pas comporter les caractères suivants : "< > / \ @".'
+        name: should not start or end with symbols, and it should not have < > / \ @ characters.
   reports:
     period: Période de rapport %{since} à %{until}
     agent_csv:
@@ -61,14 +61,14 @@ fr:
       avg_first_response_time: Temps de réponse moyen (Minutes)
       avg_resolution_time: Temps moyen de résolution (Minutes)
     inbox_csv:
-      inbox_name: Nom de la boîte de réception
+      inbox_name: Inbox name
-      inbox_type: Type de boîte de réception
+      inbox_type: Inbox type
-      conversations_count: Nbre de conversations
+      conversations_count: No. of conversations
       avg_first_response_time: Temps de réponse moyen (Minutes)
       avg_resolution_time: Temps moyen de résolution (Minutes)
     label_csv:
-      label_title: Libellé
+      label_title: Label
-      conversations_count: Nbre de conversations
+      conversations_count: No. of conversations
       avg_first_response_time: Temps de réponse moyen (Minutes)
       avg_resolution_time: Temps moyen de résolution (Minutes)
     team_csv:
@@ -79,13 +79,13 @@ fr:
     default_group_by: jour
     csat:
       headers:
-        contact_name: Nom du contact
+        contact_name: Contact Name
-        contact_email_address: Adresse e-mail du contact
+        contact_email_address: Contact Email Address
-        contact_phone_number: Numéro de téléphone du contact
+        contact_phone_number: Contact Phone Number
-        link_to_the_conversation: Lier à la conversation
+        link_to_the_conversation: Link to the conversation
         agent_name: Nom de l'agent
         rating: Note
-        feedback: Commentaire
+        feedback: Feedback Comment
         recorded_at: Recorded date
   notifications:
     notification_title:
@@ -96,7 +96,7 @@ fr:
   conversations:
     messages:
       instagram_story_content: "%{story_sender} vous a mentionné dans l'histoire: "
-      instagram_deleted_story_content: Cette Story n'est plus disponible.
+      instagram_deleted_story_content: This story is no longer available.
       deleted: Ce message a été supprimé
     activity:
       status:
@@ -151,9 +151,9 @@ fr:
       description: "L'intégration FullContact permet d'enrichir les profils de visiteurs. Identifiez les utilisateurs dès qu'ils partagent leur adresse de courriel et offrez-leur un service client sur mesure. Connectez FullContact à votre compte en partageant la clé API FullContact."
   public_portal:
     search:
-      search_placeholder: Rechercher un article par titre ou contenu...
+      search_placeholder: Search for article by title or body...
       empty_placeholder: Aucun résultat trouvé.
-      loading_placeholder: Recherche en cours...
+      loading_placeholder: Searching...
-      results_title: Résultats de recherche
+      results_title: Search results
     hero:
-      sub_title: Recherchez les articles ici ou parcourez les catégories ci-dessous.
+      sub_title: Search for the articles here or browse the categories below.