frappe · aerodeval · Feb 3, 2026 · Mar 22, 2026 · Apr 2, 2026 · Apr 2, 2026
diff --git a/desk/index.html b/desk/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" dir="rtl">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

diff --git a/desk/package.json b/desk/package.json
@@ -24,6 +24,7 @@
     "pinia": "^2.0.33",
     "sanitize-html": "^2.10.0",
     "socket.io-client": "^4.7.2",
+    "tailwindcss-rtl": "^0.9.0",
     "vue": "^3.5.14",
     "vue-router": "^4.2.2",
     "vuedraggable": "^4.1.0",

diff --git a/desk/src/components/AssignmentModal.vue b/desk/src/components/AssignmentModal.vue
@@ -2,7 +2,7 @@
   <Dialog
     v-model="show"
     :options="{
-      title: 'Assign To',
+      title: __('Assign To'),
       size: 'xl',
     }"
   >

diff --git a/desk/src/components/Autocomplete.vue b/desk/src/components/Autocomplete.vue
@@ -19,10 +19,10 @@
                   v-if="selectedValue"
                   class="overflow-hidden text-ellipsis whitespace-nowrap text-base leading-5"
                 >
-                  {{ displayValue(selectedValue) }}
+                  {{ __(displayValue(selectedValue)) }}
                 </span>
                 <span v-else class="text-base leading-5 text-gray-500">
-                  {{ placeholder || "" }}
+                  {{ __(placeholder) || "" }}
                 </span>
               </div>
               <FeatherIcon

diff --git a/desk/src/components/CommentTextEditor.vue b/desk/src/components/CommentTextEditor.vue
@@ -68,7 +68,9 @@
               :buttons="textEditorMenuButtons"
             />
           </div>
-          <div class="flex items-center justify-end space-x-2 w-[40%]">
+          <div
+            class="flex items-center justify-end space-x-2 rtl:gap-2 w-[40%]"
+          >
             <Button
               label="Discard"
               @click="

diff --git a/desk/src/components/CommunicationArea.vue b/desk/src/components/CommunicationArea.vue
@@ -7,7 +7,7 @@
         <Button
           ref="sendEmailRef"
           variant="ghost"
-          label="Reply"
+          :label="__('Reply')"
           :class="[showEmailBox ? '!bg-gray-300 hover:!bg-gray-200' : '']"
           @click="toggleEmailBox()"
         >
@@ -17,7 +17,7 @@
         </Button>
         <Button
           variant="ghost"
-          label="Comment"
+          :label="__('Comment')"
           :class="[showCommentBox ? '!bg-gray-300 hover:!bg-gray-200' : '']"
           @click="toggleCommentBox()"
         >
@@ -39,7 +39,11 @@
       <EmailEditor
         ref="emailEditorRef"
         :label="
-          isMobileView ? 'Send' : isMac ? 'Send (⌘ + ⏎)' : 'Send (Ctrl + ⏎)'
+          isMobileView
+            ? __('Send')
+            : isMac
+            ? __('Send (⌘ + ⏎)')
+            : __('Send (Ctrl + ⏎)')
         "
         v-model:content="content"
         placeholder="Hi John, we are looking into this issue."
@@ -71,10 +75,10 @@
         ref="commentTextEditorRef"
         :label="
           isMobileView
-            ? 'Comment'
+            ? __('Comment')
             : isMac
-            ? 'Comment (⌘ + ⏎)'
-            : 'Comment (Ctrl + ⏎)'
+            ? __('Comment (⌘ + ⏎)')
+            : __('Comment (Ctrl + ⏎)')
         "
         :ticketId="ticketId"
         :editable="showCommentBox"

diff --git a/desk/src/components/EmailEditor.vue b/desk/src/components/EmailEditor.vue
@@ -97,7 +97,7 @@
       </div>
       <!-- TextEditor Fixed Menu -->
       <div
-        class="flex justify-between overflow-scroll pl-10 py-2.5 items-center"
+        class="flex justify-between overflow-scroll pl-10 rtl:pr-10 py-2.5 items-center"
       >
         <div class="flex items-center overflow-x-auto w-[60%]">
           <div class="flex gap-1">
@@ -141,7 +141,7 @@
           <TextEditorFixedMenu class="ml-1" :buttons="textEditorMenuButtons" />
         </div>
         <div
-          class="flex items-center justify-end space-x-2 sm:mt-0 w-[40%] mr-9"
+          class="flex items-center justify-end space-x-2 rtl:gap-2 sm:mt-0 w-[40%] mr-9"
         >
           <Button label="Discard" @click="handleDiscard" />
           <Button

diff --git a/desk/src/components/HistoryBox.vue b/desk/src/components/HistoryBox.vue
@@ -7,9 +7,9 @@
         v-if="relatedActivities.length > 1"
         class="inline-flex flex-wrap gap-1.5 text-ink-gray-8 font-medium w-4/5"
       >
-        <span>{{ `${show_others ? "Hide " : "Show "}` }}</span>
+        <span>{{ `${show_others ? __("Hide ") : __("Show ")}` }}</span>
         <span>+{{ relatedActivities.length }} </span>
-        <span>changes from </span>
+        <span>{{ __("changes from") }} </span>
         <span>{{ user }}</span>
 
         <Button

diff --git a/desk/src/components/LayoutHeader.vue b/desk/src/components/LayoutHeader.vue
@@ -1,7 +1,9 @@
 <template>
   <Teleport to="#app-header" v-if="showHeader">
     <slot>
-      <header class="flex h-10.5 items-center justify-between mx-4 md:mr-0">
+      <header
+        class="flex h-10.5 items-center justify-between mx-4 md:mr-0 rtl:md:ml-0"
+      >
         <div class="flex items-center gap-2 max-w-[70%] md:max-w-[50%]">
           <slot name="left-header" />
         </div>

diff --git a/desk/src/components/ListRows.vue b/desk/src/components/ListRows.vue
@@ -11,7 +11,7 @@
               v-if="group.group.label != ''"
               class="flex items-end gap-1 w-full"
             >
-              <span>{{ group.group.label }}</span>
+              <span>{{ __(group.group.label) }}</span>
               <span class="text-xs text-ink-gray-5"
                 >{{
                   group.rows.length +

diff --git a/desk/src/components/ListViewBuilder.vue b/desk/src/components/ListViewBuilder.vue
@@ -2,15 +2,15 @@
   <!-- View Controls -->
   <div
     :class="[
-      'flex items-center justify-between gap-2 px-5 pb-4 pt-3 pl-6',
+      'flex items-center justify-between gap-2 px-5 pb-4 pt-3 pl-6 rtl:pr-6',
       list?.data?.data?.length > 0 ? 'relative' : 'absolute w-[stretch]',
     ]"
     v-if="showViewControls"
   >
     <QuickFilters v-if="!isMobileView" />
     <div v-if="!isMobileView" class="-ml-2 h-5 border-l"></div>
     <div
-      class="flex items-start gap-2 justify-end h-full py-1 pl-0.5"
+      class="flex items-start gap-2 justify-end h-full py-1 pl-0.5 rtl:pl-0"
       v-if="!isMobileView"
     >
       <Button

diff --git a/desk/src/components/Settings/AgentCard.vue b/desk/src/components/Settings/AgentCard.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="flex items-center justify-between py-2" v-bind:class="$attrs">
-    <div class="flex items-center space-x-3 w-4/5">
+    <div class="flex items-center space-x-3 w-4/5 rtl:space-x-reverse">
       <Avatar :image="agent.user_image" :label="agent.agent_name" size="xl" />
       <div>
         <div class="flex items-center gap-2">

diff --git a/desk/src/components/Settings/Agents.vue b/desk/src/components/Settings/Agents.vue
@@ -119,7 +119,7 @@
           <hr class="mt-2" />
           <div v-for="(agent, index) in agents.data" :key="agent.agent_name">
             <div class="flex items-center justify-between h-14 group rounded">
-              <div class="flex items-center space-x-3 grow">
+              <div class="flex items-center space-x-3 grow rtl:space-x-reverse">
                 <Avatar
                   :image="agent.user_image"
                   :label="agent.agent_name"

diff --git a/desk/src/components/Settings/EmailAccountCard.vue b/desk/src/components/Settings/EmailAccountCard.vue
@@ -5,12 +5,12 @@
     <!-- avatar and name -->
     <div class="flex justify-between items-center gap-2">
       <EmailProviderIcon :logo="emailIcon[emailAccount.service]" />
-      <div>
-        <p class="text-base text-ink-gray-7 font-medium">
-          {{ emailAccount.email_account_name }}
+      <div class="rtl:text-right">
+        <p class="text-p-base text-ink-gray-7 font-medium">
+          {{ __(emailAccount.email_account_name) }}
         </p>
-        <div class="text-sm w-full text-ink-gray-5 mt-1">
-          {{ emailAccount.email_id }}
+        <div class="text-p-sm w-full text-ink-gray-5 mt-1">
+          {{ __(emailAccount.email_id) }}
         </div>
       </div>
     </div>

diff --git a/desk/src/components/Settings/Profile/Profile.vue b/desk/src/components/Settings/Profile/Profile.vue
@@ -58,7 +58,7 @@
                 </div>
               </div>
               <div class="flex flex-col gap-1">
-                <div class="flex flex-col">
+                <div class="flex flex-col rtl:text-right">
                   <span
                     class="text-lg sm:text-xl !font-semibold text-ink-gray-8"
                     >{{ auth?.userName }}</span
@@ -74,7 +74,7 @@
         </FileUploader>
       </div>
       <hr class="my-6" />
-      <div>
+      <div class="rtl:text-right">
         <div class="flex items-center justify-between">
           <div class="flex gap-2 items-center">
             <div class="text-base font-semibold text-ink-gray-9">

diff --git a/desk/src/components/Settings/Telephony/ExotelSettings.vue b/desk/src/components/Settings/Telephony/ExotelSettings.vue
@@ -10,7 +10,7 @@
           :label="__('Exotel')"
           size="md"
           @click="goBack"
-          class="cursor-pointer hover:bg-transparent focus:bg-transparent focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:none active:bg-transparent active:outline-none active:ring-0 active:ring-offset-0 active:text-ink-gray-5 font-semibold text-ink-gray-7 text-lg hover:opacity-70 !pr-0 !pl-0 -ml-1.5"
+          class="cursor-pointer hover:bg-transparent focus:bg-transparent focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:none active:bg-transparent active:outline-none active:ring-0 active:ring-offset-0 active:text-ink-gray-5 font-semibold text-ink-gray-7 text-lg hover:opacity-70 !pr-0 !pl-0 -ml-1.5 rtl:ml-0 rtl:mr-1.5"
         />
         <Badge
           :class="[

diff --git a/desk/src/components/Settings/Telephony/TwilioSettings.vue b/desk/src/components/Settings/Telephony/TwilioSettings.vue
@@ -10,7 +10,7 @@
           :label="__('Twilio')"
           size="md"
           @click="goBack"
-          class="cursor-pointer hover:bg-transparent focus:bg-transparent focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:none active:bg-transparent active:outline-none active:ring-0 active:ring-offset-0 active:text-ink-gray-5 font-semibold text-ink-gray-7 text-lg hover:opacity-70 !pr-0 !pl-0 -ml-1.5"
+          class="cursor-pointer hover:bg-transparent focus:bg-transparent focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:none active:bg-transparent active:outline-none active:ring-0 active:ring-offset-0 active:text-ink-gray-5 font-semibold text-ink-gray-7 text-lg hover:opacity-70 !pr-0 !pl-0 -ml-1.5 rtl:ml-0 rtl:mr-1.5"
         />
         <Badge
           :class="[isDirty.twilio ? 'opacity-100' : 'opacity-0']"

diff --git a/desk/src/components/SidebarLink.vue b/desk/src/components/SidebarLink.vue
@@ -33,7 +33,7 @@
     </span>
 
     <div
-      class="-all ml-2 flex shrink-0 grow items-center justify-between text-sm duration-300 ease-in-out"
+      class="-all ml-2 rtl:mr-2 flex shrink-0 grow items-center justify-between text-sm duration-300 ease-in-out"
       :class="{
         'opacity-100': isExpanded,
         'opacity-0': !isExpanded,

diff --git a/desk/src/components/TextEditor.vue b/desk/src/components/TextEditor.vue
@@ -38,7 +38,7 @@
             </div>
             <div class="flex items-center gap-2">
               <Button
-                label="Discard"
+                :label="__('Discard')"
                 theme="gray"
                 variant="subtle"
                 @click="

diff --git a/desk/src/components/TicketField.vue b/desk/src/components/TicketField.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="flex gap-2 px-5 pb-1 leading-5 first:mt-3 items-center">
     <div class="w-[106px] shrink-0 truncate text-sm text-gray-600">
-      <Tooltip :text="field.label">
-        <span>{{ field.label }}</span>
+      <Tooltip :text="__(field.label)">
+        <span>{{ __(field.label) }}</span>
       </Tooltip>
       <span v-if="field.required" class="text-red-500"> * </span>
     </div>

diff --git a/desk/src/components/UserMenu.vue b/desk/src/components/UserMenu.vue
@@ -13,7 +13,7 @@
       >
         <BrandLogo />
         <div
-          class="flex flex-1 flex-col text-left duration-300 ease-in-out overflow-hidden"
+          class="flex flex-1 flex-col text-left duration-300 ease-in-out overflow-hidden rtl:items-start pr-2"
           :class="
             !sidebarStore.isExpanded
               ? 'ml-0 w-0 overflow-hidden opacity-0'

diff --git a/desk/src/components/command-palette/CPGroup.vue b/desk/src/components/command-palette/CPGroup.vue
@@ -6,10 +6,10 @@
     <component
       :is="item.icon"
       v-if="item.icon"
-      class="mr-3 h-4 w-4 text-gray-700"
+      class="mr-3 rtl:ml-3 rtl:mr-0 h-4 w-4 text-gray-700"
     />
     <span class="overflow-hidden text-ellipsis whitespace-nowrap">
-      {{ item.title }}&nbsp;
+      {{ __(item.title) }}&nbsp;
     </span>
     <span
       v-if="item.modified"

diff --git a/desk/src/components/command-palette/CPGroupResult.vue b/desk/src/components/command-palette/CPGroupResult.vue
@@ -9,7 +9,7 @@
       class="mr-3 h-4 w-4 text-gray-700"
     />
     <span class="overflow-hidden text-ellipsis whitespace-nowrap">
-      {{ item.subject }}
+      {{ __(item.subject) }}
       <span v-if="item.showName" class="text-sm">(#{{ item.name }})</span>
     </span>
     <span

diff --git a/desk/src/components/frappe-ui/Autocomplete.vue b/desk/src/components/frappe-ui/Autocomplete.vue
@@ -24,10 +24,10 @@
                   class="overflow-hidden text-ellipsis whitespace-nowrap text-base leading-5"
                   v-if="selectedValue"
                 >
-                  {{ displayValue(selectedValue) }}
+                  {{ __(displayValue(selectedValue)) }}
                 </span>
                 <span class="text-base leading-5 text-gray-500" v-else>
-                  {{ placeholder || "" }}
+                  {{ __(placeholder) || "" }}
                 </span>
               </div>
               <FeatherIcon
@@ -57,7 +57,7 @@
                 placeholder="Search"
               />
               <button
-                class="absolute right-1.5 inline-flex h-7 w-7 items-center justify-center"
+                class="absolute right-1.5 rtl:right-auto rtl:left-1.5 inline-flex h-7 w-7 items-center justify-center"
                 @click="selectedValue = null"
               >
                 <FeatherIcon name="x" class="w-4" />
@@ -77,7 +77,7 @@
                   v-if="group.group && !group.hideLabel"
                   class="px-2.5 py-1.5 text-sm font-medium text-gray-500"
                 >
-                  {{ group.group }}
+                  {{ __(group.group) }}
                 </div>
                 <ComboboxOption
                   as="template"
@@ -100,7 +100,7 @@
                       name="item-label"
                       v-bind="{ active, selected, option }"
                     >
-                      {{ option.label }}
+                      {{ __(option.label) }}
                     </slot>
                   </li>
                 </ComboboxOption>

diff --git a/desk/src/components/layouts/AppHeader.vue b/desk/src/components/layouts/AppHeader.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex border-b pr-5">
+  <div class="flex border-b pr-5 rtl:pl-6">
     <div id="app-header" class="flex-1 w-full"></div>
     <div class="flex items-start justify-center">
       <CallUI :userEmail="user" />

diff --git a/desk/src/components/layouts/SettingsLayoutBase.vue b/desk/src/components/layouts/SettingsLayoutBase.vue
@@ -2,18 +2,18 @@
   <div class="flex flex-col h-full w-full pb-8">
     <div class="px-10 py-8">
       <div class="flex items-start justify-between">
-        <div class="flex flex-col gap-1">
+        <div class="flex flex-col gap-1 rtl:text-right">
           <slot name="title">
             <h1 class="text-lg font-semibold text-ink-gray-8">
-              {{ title }}
+              {{ __(title) }}
             </h1>
           </slot>
           <slot
             name="description"
             v-if="Boolean($slots['description']) || Boolean(description)"
           >
             <p class="text-p-sm text-gray-700 max-w-md text-ink-gray-6">
-              {{ description }}
+              {{ __(description) }}
             </p>
           </slot>
         </div>
@@ -23,7 +23,7 @@
         <slot name="header-bottom" />
       </div>
     </div>
-    <div class="px-10 pb-8 overflow-y-auto h-full flex flex-col">
+    <div class="px-10 pb-8 overflow-y-auto h-full flex flex-col rtl:text-right">
       <slot name="content" />
     </div>
   </div>