diff --git a/frappe-ui b/frappe-ui
index 063cf8d3..38a7784d 160000
--- a/frappe-ui
+++ b/frappe-ui
@@ -1 +1 @@
-Subproject commit 063cf8d3563776aabe83a93ff5dcea5c435ae1f6
+Subproject commit 38a7784d7be13493e975a9def90a28b1f5cda095
diff --git a/frontend/src/components/Activities.vue b/frontend/src/components/Activities.vue
index a0e4f6e6..b0f1e6a8 100644
--- a/frontend/src/components/Activities.vue
+++ b/frontend/src/components/Activities.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="flex items-center justify-between px-10 py-5 text-lg font-medium">
-    <div class="flex h-7 items-center text-xl font-semibold text-gray-800">
+  <div class="flex items-center justify-between mx-10 mt-8 mb-4 text-lg font-medium">
+    <div class="flex h-8 items-center text-xl font-semibold text-gray-800">
       {{ __(title) }}
     </div>
     <Button
@@ -240,7 +240,7 @@
             :class="i != activities.length - 1 ? 'after:h-full' : 'after:h-4'"
           >
             <div
-              class="z-10 mt-[15px] flex h-7 w-7 items-center justify-center rounded-full bg-gray-100"
+              class="z-10 mt-[15px] flex h-7 w-7 items-center justify-center rounded bg-gray-100"
             >
               <component
                 :is="
@@ -348,7 +348,7 @@
           ]"
         >
           <div
-            class="z-10 flex h-7 w-7 items-center justify-center rounded-full bg-gray-100"
+            class="z-10 flex h-7 w-7 items-center justify-center rounded bg-gray-100"
             :class="{
               'mt-3': [
                 'communication',
@@ -364,7 +364,7 @@
               :is="activity.icon"
               :class="
                 ['added', 'removed', 'changed'].includes(activity.activity_type)
-                  ? 'text-gray-600'
+                  ? 'text-gray-500'
                   : 'text-gray-800'
               "
             />
@@ -466,7 +466,7 @@
             </div>
             <div class="ml-auto whitespace-nowrap">
               <Tooltip :text="dateFormat(activity.creation, dateTooltipFormat)">
-                <div class="text-gray-600">
+                <div class="text-sm text-gray-600">
                   {{ __(timeAgo(activity.creation)) }}
                 </div>
               </Tooltip>
@@ -629,7 +629,7 @@
 
             <div class="ml-auto whitespace-nowrap">
               <Tooltip :text="dateFormat(activity.creation, dateTooltipFormat)">
-                <div class="text-gray-600">
+                <div class="text-sm text-gray-600">
                   {{ __(timeAgo(activity.creation)) }}
                 </div>
               </Tooltip>
@@ -693,7 +693,7 @@
 
             <div class="ml-auto whitespace-nowrap">
               <Tooltip :text="dateFormat(activity.creation, dateTooltipFormat)">
-                <div class="text-gray-600">
+                <div class="text-sm text-gray-600">
                   {{ __(timeAgo(activity.creation)) }}
                 </div>
               </Tooltip>
@@ -782,6 +782,7 @@
   <WhatsappTemplateSelectorModal
     v-if="whatsappEnabled"
     v-model="showWhatsappTemplates"
+    :doctype="doctype"
     @send="(t) => sendTemplate(t)"
   />
 </template>
@@ -795,7 +796,6 @@ import TaskIcon from '@/components/Icons/TaskIcon.vue'
 import WhatsAppIcon from '@/components/Icons/WhatsAppIcon.vue'
 import WhatsAppArea from '@/components/WhatsAppArea.vue'
 import WhatsAppBox from '@/components/WhatsAppBox.vue'
-import RefreshIcon from '@/components/Icons/RefreshIcon.vue'
 import LoadingIndicator from '@/components/Icons/LoadingIndicator.vue'
 import DurationIcon from '@/components/Icons/DurationIcon.vue'
 import CalendarIcon from '@/components/Icons/CalendarIcon.vue'
diff --git a/frontend/src/components/CustomActions.vue b/frontend/src/components/CustomActions.vue
index a28c2385..68cfa545 100644
--- a/frontend/src/components/CustomActions.vue
+++ b/frontend/src/components/CustomActions.vue
@@ -9,11 +9,7 @@
     </template>
   </Button>
   <Dropdown v-if="groupedActions.length" :options="groupedActions">
-    <Button>
-      <template #icon>
-        <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-      </template>
-    </Button>
+    <Button icon="more-horizontal" />
   </Dropdown>
 </template>
 
diff --git a/frontend/src/components/Icons/ActivityIcon.vue b/frontend/src/components/Icons/ActivityIcon.vue
index 99407547..6b2962a2 100644
--- a/frontend/src/components/Icons/ActivityIcon.vue
+++ b/frontend/src/components/Icons/ActivityIcon.vue
@@ -1,38 +1,16 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
-    <path
-      d="M2.5 6C2.5 4.61929 3.61929 3.5 5 3.5H15C16.3807 3.5 17.5 4.61929 17.5 6V12C17.5 15.0376 15.0376 17.5 12 17.5H5C3.61929 17.5 2.5 16.3807 2.5 15V6Z"
-      stroke="currentColor"
-    />
-    <path
-      d="M6 2.5V3.5"
-      stroke="currentColor"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M14 2.5V3"
-      stroke="currentColor"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
     <path
       fill-rule="evenodd"
       clip-rule="evenodd"
-      d="M10.75 7.5C10.75 7.91421 10.4142 8.25 10 8.25C9.58579 8.25 9.25 7.91421 9.25 7.5C9.25 7.08579 9.58579 6.75 10 6.75C10.4142 6.75 10.75 7.08579 10.75 7.5ZM10.75 10.5C10.75 10.9142 10.4142 11.25 10 11.25C9.58579 11.25 9.25 10.9142 9.25 10.5C9.25 10.0858 9.58579 9.75 10 9.75C10.4142 9.75 10.75 10.0858 10.75 10.5ZM10 14.25C10.4142 14.25 10.75 13.9142 10.75 13.5C10.75 13.0858 10.4142 12.75 10 12.75C9.58579 12.75 9.25 13.0858 9.25 13.5C9.25 13.9142 9.58579 14.25 10 14.25ZM7.25 13.5C7.25 13.9142 6.91421 14.25 6.5 14.25C6.08579 14.25 5.75 13.9142 5.75 13.5C5.75 13.0858 6.08579 12.75 6.5 12.75C6.91421 12.75 7.25 13.0858 7.25 13.5ZM6.5 11.25C6.91421 11.25 7.25 10.9142 7.25 10.5C7.25 10.0858 6.91421 9.75 6.5 9.75C6.08579 9.75 5.75 10.0858 5.75 10.5C5.75 10.9142 6.08579 11.25 6.5 11.25ZM14.25 10.5C14.25 10.9142 13.9142 11.25 13.5 11.25C13.0858 11.25 12.75 10.9142 12.75 10.5C12.75 10.0858 13.0858 9.75 13.5 9.75C13.9142 9.75 14.25 10.0858 14.25 10.5ZM13.5 8.25C13.9142 8.25 14.25 7.91421 14.25 7.5C14.25 7.08579 13.9142 6.75 13.5 6.75C13.0858 6.75 12.75 7.08579 12.75 7.5C12.75 7.91421 13.0858 8.25 13.5 8.25Z"
+      d="M4.23264 0.640137C4.50878 0.640137 4.73264 0.863994 4.73264 1.14014V2.21646L5.00391 2.21638H11.0039C11.0946 2.21638 11.1824 2.21638 11.2674 2.21645V1.14014C11.2674 0.863994 11.4912 0.640137 11.7674 0.640137C12.0435 0.640137 12.2674 0.863994 12.2674 1.14014V2.21729C12.2674 2.22121 12.2673 2.22513 12.2672 2.22904C12.886 2.25159 13.2963 2.31433 13.6389 2.48886C14.1093 2.72855 14.4917 3.111 14.7314 3.5814C15.0039 4.11618 15.0039 4.81625 15.0039 6.21638V11.0164C15.0039 12.4165 15.0039 13.1166 14.7314 13.6514C14.4917 14.1218 14.1093 14.5042 13.6389 14.7439C13.1041 15.0164 12.404 15.0164 11.0039 15.0164H5.00391C3.60378 15.0164 2.90371 15.0164 2.36893 14.7439C1.89852 14.5042 1.51607 14.1218 1.27639 13.6514C1.00391 13.1166 1.00391 12.4165 1.00391 11.0164V6.21638C1.00391 4.81625 1.00391 4.11618 1.27639 3.5814C1.51607 3.111 1.89852 2.72855 2.36893 2.48886C2.71004 2.31506 3.1184 2.25212 3.73278 2.22932L3.73264 2.21729V1.14014C3.73264 0.863994 3.9565 0.640137 4.23264 0.640137ZM11.0039 3.21638H5.00391C4.28734 3.21638 3.81006 3.21716 3.44334 3.24712C3.0883 3.27613 2.92584 3.32743 2.82292 3.37987C2.54068 3.52368 2.31121 3.75315 2.1674 4.0354C2.11496 4.13832 2.06365 4.30078 2.03465 4.65582C2.0074 4.98935 2.00429 5.41434 2.00395 6.02764C2.02879 6.02384 2.05424 6.02186 2.08015 6.02186H13.9197C13.9484 6.02186 13.9765 6.02428 14.0039 6.02892C14.0035 5.41493 14.0004 4.98958 13.9732 4.65582C13.9442 4.30078 13.8929 4.13832 13.8404 4.0354C13.6966 3.75315 13.4671 3.52368 13.1849 3.37987C13.082 3.32743 12.9195 3.27613 12.5645 3.24712C12.1978 3.21716 11.7205 3.21638 11.0039 3.21638ZM14.0039 7.0148C13.9765 7.01945 13.9484 7.02186 13.9197 7.02186H2.08015C2.05423 7.02186 2.02877 7.01989 2.00391 7.01609V11.0164C2.00391 11.7329 2.00468 12.2102 2.03465 12.5769C2.06365 12.932 2.11496 13.0944 2.1674 13.1974C2.31121 13.4796 2.54068 13.7091 2.82292 13.8529C2.92584 13.9053 3.0883 13.9566 3.44334 13.9856C3.81006 14.0156 4.28734 14.0164 5.00391 14.0164H11.0039C11.7205 14.0164 12.1978 14.0156 12.5645 13.9856C12.9195 13.9566 13.082 13.9053 13.1849 13.8529C13.4671 13.7091 13.6966 13.4796 13.8404 13.1974C13.8929 13.0944 13.9442 12.932 13.9732 12.5769C14.0031 12.2102 14.0039 11.7329 14.0039 11.0164V7.0148ZM9.62 11.3961C9.62 11.0241 9.62 10.838 9.66889 10.6875C9.7678 10.3829 10.0066 10.1441 10.3111 10.0452C10.4617 9.99634 10.6477 9.99634 11.0198 9.99634H11.2531C11.6252 9.99634 11.8112 9.99634 11.9618 10.0452C12.2663 10.1441 12.5051 10.3829 12.604 10.6875C12.6529 10.838 12.6529 11.0241 12.6529 11.3961C12.6529 11.7682 12.6529 11.9542 12.604 12.1048C12.5051 12.4094 12.2663 12.6481 11.9618 12.747C11.8112 12.7959 11.6252 12.7959 11.2531 12.7959H11.0198C10.6477 12.7959 10.4617 12.7959 10.3111 12.747C10.0066 12.6481 9.7678 12.4094 9.66889 12.1048C9.62 11.9542 9.62 11.7682 9.62 11.3961Z"
       fill="currentColor"
     />
-    <path
-      d="M17.0077 11.6994L17.5 11.2071V11.5V12C17.5 15.0241 15.0594 17.4781 12.0404 17.4999L12.7878 16.5656C13.2586 15.9772 13.4651 15.2203 13.3586 14.4743C13.2098 13.4332 14.0203 12.5 15.0739 12.5C15.7985 12.5 16.4949 12.2122 17.0077 11.6994Z"
-      stroke="currentColor"
-    />
   </svg>
 </template>
diff --git a/frontend/src/components/Icons/DealsIcon.vue b/frontend/src/components/Icons/DealsIcon.vue
index d8d75b8c..fa8cf86b 100644
--- a/frontend/src/components/Icons/DealsIcon.vue
+++ b/frontend/src/components/Icons/DealsIcon.vue
@@ -9,7 +9,7 @@
     <path
       fill-rule="evenodd"
       clip-rule="evenodd"
-      d="M7.51246 2.15214C8.0454 1.5782 8.99073 2.10255 8.78598 2.85854L8.06251 5.52981L14.3198 6.41225C14.5042 6.43825 14.6589 6.56458 14.7212 6.74006C14.7835 6.91555 14.7431 7.11112 14.6164 7.24758L8.48756 13.8479C7.95462 14.4218 7.00929 13.8975 7.21404 13.1415L7.93751 10.4702L1.68019 9.58777C1.4958 9.56176 1.34113 9.43544 1.27883 9.25995C1.21652 9.08447 1.2569 8.8889 1.38361 8.75244L7.51246 2.15214ZM7.55592 3.57495L2.76791 8.73127L8.63801 9.5591C8.78003 9.57913 8.9066 9.65918 8.98557 9.7789C9.06454 9.89862 9.0883 10.0465 9.05081 10.1849L8.4441 12.4251L13.2321 7.26875L7.36201 6.44091C7.21999 6.42089 7.09342 6.34084 7.01445 6.22112C6.93548 6.1014 6.91172 5.95354 6.94922 5.8151L7.55592 3.57495Z"
+      d="M7.52007 1.24211C8.01929 0.631274 9.00203 1.10628 8.83348 1.87697L8.03546 5.52575L14.3198 6.41201C14.4986 6.43722 14.6499 6.55687 14.7157 6.72502C14.7814 6.89317 14.7514 7.08371 14.6372 7.22352L8.47994 14.7574C7.98072 15.3683 6.99798 14.8933 7.16653 14.1226L7.96455 10.4738L1.68018 9.58753C1.5014 9.56231 1.3501 9.44267 1.28434 9.27452C1.21859 9.10636 1.2486 8.91582 1.36285 8.77602L7.52007 1.24211ZM7.63341 2.68368L2.69904 8.72132L8.63801 9.55886C8.77578 9.57829 8.89923 9.65425 8.97867 9.76848C9.05812 9.88271 9.08637 10.0249 9.05664 10.1608L8.3666 13.3159L13.301 7.27822L7.362 6.44067C7.22423 6.42124 7.10078 6.34529 7.02134 6.23106C6.9419 6.11683 6.91364 5.97467 6.94337 5.83874L7.63341 2.68368Z"
       fill="currentColor"
     />
   </svg>
diff --git a/frontend/src/components/Icons/EmailIcon.vue b/frontend/src/components/Icons/EmailIcon.vue
index 6063cb95..162a9428 100644
--- a/frontend/src/components/Icons/EmailIcon.vue
+++ b/frontend/src/components/Icons/EmailIcon.vue
@@ -1,15 +1,16 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
     <path
-      d="M2.5 6.5V6.5C2.5 7.10397 2.86771 7.64708 3.42848 7.87139L9.25722 10.2029C9.73404 10.3936 10.266 10.3936 10.7428 10.2029L16.5715 7.87139C17.1323 7.64708 17.5 7.10397 17.5 6.5V6.5"
-      stroke="currentColor"
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M4.00013 2C2.34328 2 1.00013 3.34315 1.00013 5V5.48845C0.999957 5.49602 0.999957 5.50357 1.00013 5.51111V11C1.00013 12.6569 2.34328 14 4.00013 14H12.0001C13.657 14 15.0001 12.6569 15.0001 11V5.51111C15.0003 5.50357 15.0003 5.49602 15.0001 5.48845V5C15.0001 3.34315 13.657 2 12.0001 2H4.00013ZM14.0001 5.16863V5C14.0001 3.89543 13.1047 3 12.0001 3H4.00013C2.89556 3 2.00013 3.89543 2.00013 5V5.16863L7.80531 7.62467C7.92985 7.67736 8.07041 7.67736 8.19495 7.62467L14.0001 5.16863ZM2.00013 6.25445V11C2.00013 12.1046 2.89556 13 4.00013 13H12.0001C13.1047 13 14.0001 12.1046 14.0001 11V6.25445L8.58459 8.54564C8.21098 8.7037 7.78928 8.7037 7.41567 8.54564L2.00013 6.25445Z"
+      fill="currentColor"
     />
-    <rect x="2.5" y="4" width="15" height="12" rx="2.5" stroke="currentColor" />
   </svg>
 </template>
diff --git a/frontend/src/components/Icons/NoteIcon.vue b/frontend/src/components/Icons/NoteIcon.vue
index bd7233b1..2bbca63f 100644
--- a/frontend/src/components/Icons/NoteIcon.vue
+++ b/frontend/src/components/Icons/NoteIcon.vue
@@ -1,21 +1,16 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
     <path
-      d="M10 4.5C10 3.39543 9.10457 2.5 8 2.5H5.75C4.64543 2.5 3.75 3.39543 3.75 4.5V15.5C3.75 16.6046 4.64543 17.5 5.75 17.5H14.25C15.3546 17.5 16.25 16.6021 16.25 15.4976C16.25 13.1374 16.25 12.6616 16.25 9.75319C16.25 9.2009 15.8023 8.75 15.25 8.75H11C10.4477 8.75 10 8.30228 10 7.75V5.3125V4.5Z"
-      stroke="currentColor"
-      stroke-miterlimit="10"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-    <path
-      d="M7.5 2.5H9.4844C10.2191 2.5 10.9283 2.76964 11.4775 3.25777L15.2431 6.60497C15.8836 7.17427 16.25 7.99028 16.25 8.8472V10.625"
-      stroke="currentColor"
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M3.99707 14H11.9971C12.8255 14 13.4971 13.3284 13.4971 12.5V6.49988L12 6.49989C10.6193 6.4999 9.5 5.38061 9.5 3.99989V2H3.99707C3.16864 2 2.49707 2.67157 2.49707 3.5V12.5C2.49707 13.3284 3.16864 14 3.99707 14ZM13.8291 4.2806C14.1476 4.62366 14.3612 5.04668 14.4502 5.49987L14.4968 5.49987L14.4968 5.94777L14.4971 5.98173V12.5C14.4971 13.8807 13.3778 15 11.9971 15H3.99707C2.61636 15 1.49707 13.8807 1.49707 12.5V3.5C1.49707 2.11929 2.61636 1 3.99707 1H9.69261C10.3878 1 11.0516 1.28945 11.5246 1.79887L13.8291 4.2806ZM12 5.49989L13.4176 5.49988C13.3502 5.30132 13.2414 5.11735 13.0963 4.96105L10.7918 2.47932C10.7044 2.38525 10.6063 2.30368 10.5 2.23582V3.99989C10.5 4.82832 11.1716 5.4999 12 5.49989ZM5 11C4.72386 11 4.5 11.2239 4.5 11.5C4.5 11.7761 4.72386 12 5 12H8C8.27614 12 8.5 11.7761 8.5 11.5C8.5 11.2239 8.27614 11 8 11H5ZM10 9.5H5H4.75C4.47386 9.5 4.25 9.27614 4.25 9C4.25 8.72386 4.47386 8.5 4.75 8.5H5H10H11.25C11.5261 8.5 11.75 8.72386 11.75 9C11.75 9.27614 11.5261 9.5 11.25 9.5H10Z"
+      fill="currentColor"
     />
   </svg>
 </template>
diff --git a/frontend/src/components/Icons/PhoneIcon.vue b/frontend/src/components/Icons/PhoneIcon.vue
index e1f699b6..55a25228 100644
--- a/frontend/src/components/Icons/PhoneIcon.vue
+++ b/frontend/src/components/Icons/PhoneIcon.vue
@@ -1,15 +1,16 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
     <path
-      d="M10.381 15.0091L13.0108 12.8044C13.3009 12.5612 13.7186 12.5445 14.0272 12.7639L16.5838 14.5815C17.0394 14.9054 17.0522 15.5775 16.6093 15.9186L15.6001 16.6955C14.9561 17.1913 14.0933 17.2956 13.3711 16.9225C11.824 16.1231 9.08016 14.5487 7.11025 12.5456C5.21236 10.6158 3.81881 8.0839 3.08578 6.57321C2.70649 5.79154 2.88609 4.87094 3.48778 4.24418L4.42402 3.26893C4.7989 2.87842 5.441 2.94435 5.72871 3.40288L7.34325 5.976C7.55012 6.3057 7.50072 6.73477 7.22432 7.00882L4.62919 9.58191"
-      stroke="currentColor"
-      stroke-linejoin="round"
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M3.95261 2.54013C3.92303 2.49299 3.85702 2.48621 3.81848 2.52636L2.78471 3.60321C2.49482 3.90517 2.42116 4.33187 2.58819 4.68366C2.84576 5.22612 3.21972 5.95835 3.69625 6.74891L5.43369 5.02622C5.4621 4.99804 5.46718 4.95393 5.44592 4.92004L3.95261 2.54013ZM4.24557 7.61247L6.13777 5.73633C6.49846 5.37871 6.56294 4.81878 6.29297 4.38854L4.79967 2.00863C4.42421 1.41026 3.5863 1.32423 3.09709 1.83383L2.06332 2.91068C1.50616 3.49105 1.32727 4.35947 1.68485 5.11258C2.28387 6.37416 3.52537 8.7043 5.26633 10.4746C7.06225 12.3007 9.57147 13.7019 10.8502 14.3515C11.5427 14.7033 12.3553 14.5979 12.9518 14.1386L14.0767 13.2726C14.6547 12.8276 14.638 11.9504 14.0434 11.5278L11.6812 9.8484C11.2786 9.56215 10.7334 9.58388 10.3549 9.90126L8.26183 11.6559C7.46601 11.1043 6.66352 10.4691 5.97931 9.77337C5.32709 9.11017 4.74568 8.35658 4.24557 7.61247ZM9.13278 12.2307C9.97096 12.7581 10.7473 13.1776 11.3031 13.4599C11.6307 13.6264 12.0315 13.5851 12.3417 13.3463L13.4666 12.4802C13.5122 12.4452 13.5109 12.3761 13.464 12.3428L11.1018 10.6634C11.0701 10.6409 11.0271 10.6426 10.9973 10.6676L9.13278 12.2307Z"
+      fill="currentColor"
     />
   </svg>
 </template>
diff --git a/frontend/src/components/Icons/TaskIcon.vue b/frontend/src/components/Icons/TaskIcon.vue
index 986917ee..5dd1fb1e 100644
--- a/frontend/src/components/Icons/TaskIcon.vue
+++ b/frontend/src/components/Icons/TaskIcon.vue
@@ -1,17 +1,23 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
-    <rect x="3" y="3" width="14" height="14" rx="2.5" stroke="currentColor" />
-    <path
-      d="M6.5 10.5L8.5 13L13.5 7.5"
-      stroke="currentColor"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
+    <g clip-path="url(#clip0_3692_15849)">
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M14.25 8C14.25 11.4518 11.4518 14.25 8 14.25C4.54822 14.25 1.75 11.4518 1.75 8C1.75 4.54822 4.54822 1.75 8 1.75C11.4518 1.75 14.25 4.54822 14.25 8ZM15.25 8C15.25 12.0041 12.0041 15.25 8 15.25C3.99594 15.25 0.75 12.0041 0.75 8C0.75 3.99594 3.99594 0.75 8 0.75C12.0041 0.75 15.25 3.99594 15.25 8ZM11.2909 5.98482C11.4666 5.77175 11.4363 5.45663 11.2232 5.28096C11.0101 5.1053 10.695 5.13561 10.5193 5.34868L7.07001 9.53239L5.72845 7.79857C5.55946 7.58018 5.24543 7.54012 5.02703 7.70911C4.80863 7.8781 4.76858 8.19214 4.93756 8.41053L6.66217 10.6394C6.7552 10.7596 6.89788 10.831 7.04988 10.8334C7.20188 10.8357 7.3467 10.7688 7.4434 10.6515L11.2909 5.98482Z"
+        fill="currentColor"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_3692_15849">
+        <rect width="16" height="16" fill="white" />
+      </clipPath>
+    </defs>
   </svg>
 </template>
diff --git a/frontend/src/components/Icons/WhatsAppIcon.vue b/frontend/src/components/Icons/WhatsAppIcon.vue
index 1b8cdcfe..b4ee2250 100644
--- a/frontend/src/components/Icons/WhatsAppIcon.vue
+++ b/frontend/src/components/Icons/WhatsAppIcon.vue
@@ -1,13 +1,13 @@
 <template>
   <svg
-    width="20"
-    height="20"
-    viewBox="0 0 20 20"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
     <path
-      d="M6 15.5C7.5 16.5 10.3367 17.2101 12.0757 16.7964C13.8147 16.3826 15.3488 15.3614 16.4015 13.9167C17.4541 12.472 17.9562 10.6988 17.8172 8.91668C17.6781 7.13456 16.9072 5.46069 15.6432 4.19671C14.3792 2.93273 12.7053 2.16176 10.9232 2.02273C9.14108 1.8837 7.36789 2.38575 5.92318 3.43842C4.47847 4.49109 3.45724 6.02514 3.04352 7.76414C2.62979 9.50314 3 12 4 13.5L2.5 17L6 15.5Z"
+      d="M4.19429 13.6C5.56327 14.5333 8.15223 15.1961 9.73933 14.8099C11.3264 14.4238 12.7265 13.4706 13.6872 12.1223C14.6479 10.7739 15.1061 9.11889 14.9793 7.45557C14.8524 5.79226 14.1487 4.22998 12.9952 3.05026C11.8416 1.87055 10.3139 1.15098 8.68746 1.02121C7.061 0.891454 5.4427 1.36004 4.12418 2.34253C2.80566 3.32502 1.87363 4.7568 1.49604 6.37987C1.11846 8.00294 1.45633 10.3333 2.36898 11.7333L1 15L4.19429 13.6Z"
       stroke="currentColor"
       stroke-width="1"
       stroke-linecap="round"
@@ -16,11 +16,11 @@
     <path
       fill-rule="evenodd"
       clip-rule="evenodd"
-      d="M11.3355 12.3844L12 11.5C12.4877 11.0123 12.775 11.209 13.4481 11.4793C13.4824 11.4931 13.515 11.5112 13.5445 11.5333L13.8563 11.7664C14.0434 11.8987 14.0487 12.1733 13.8668 12.3126L13.2106 12.8153C12.9462 13.0178 12.5923 13.0604 12.2947 12.91C11.5548 12.536 10.1264 11.74 9.11332 10.7151C8.13237 9.72267 7.42487 8.40546 7.07965 7.68204C6.92664 7.3614 7.0003 6.98556 7.24735 6.72951L7.85039 6.10451C8.00431 5.94497 8.26796 5.97191 8.38609 6.15923L8.79347 6.72951C9.11332 7.24052 8.65816 7.67639 8.38609 7.85843L7.5 8.49417"
+      d="M8.71612 10.4723L9.28571 9.71429C9.70194 9.29806 9.94789 9.46347 10.5197 9.69365C10.5539 9.70744 10.5864 9.72549 10.616 9.74759L10.8769 9.94262C11.0372 10.056 11.0417 10.2914 10.8858 10.4108L10.3234 10.8417C10.0967 11.0153 9.79336 11.0518 9.53832 10.9229C8.90412 10.6023 7.67975 9.92002 6.81142 9.04152C5.9706 8.19086 5.36418 7.06182 5.06827 6.44175C4.93712 6.16692 5.00025 5.84477 5.21201 5.62529L5.7289 5.08958C5.86084 4.95283 6.08682 4.97592 6.18808 5.13648L6.53726 5.62529C6.81142 6.0633 6.42128 6.43691 6.18808 6.59294L5.42857 7.13786"
       fill="currentColor"
     />
     <path
-      d="M11.3355 12.3844L12 11.5C12.4877 11.0123 12.775 11.209 13.4481 11.4793C13.4824 11.4931 13.515 11.5112 13.5445 11.5333L13.8563 11.7664C14.0434 11.8987 14.0487 12.1733 13.8668 12.3126L13.2106 12.8153C12.9462 13.0178 12.5923 13.0604 12.2947 12.91C11.5548 12.536 10.1264 11.74 9.11332 10.7151C8.13237 9.72267 7.42487 8.40546 7.07965 7.68204C6.92664 7.3614 7.0003 6.98556 7.24735 6.72951L7.85039 6.10451C8.00431 5.94497 8.26796 5.97191 8.38609 6.15923L8.79347 6.72951C9.11332 7.24052 8.65816 7.67639 8.38609 7.85843L7.5 8.49417"
+      d="M8.71612 10.4723L9.28571 9.71429C9.70194 9.29806 9.94789 9.46347 10.5197 9.69365C10.5539 9.70744 10.5864 9.72549 10.616 9.74759L10.8769 9.94262C11.0372 10.056 11.0417 10.2914 10.8858 10.4108L10.3234 10.8417C10.0967 11.0153 9.79336 11.0518 9.53832 10.9229C8.90412 10.6023 7.67975 9.92002 6.81142 9.04152C5.9706 8.19086 5.36418 7.06182 5.06827 6.44175C4.93712 6.16692 5.00025 5.84477 5.21201 5.62529L5.7289 5.08958C5.86084 4.95283 6.08682 4.97592 6.18808 5.13648L6.53726 5.62529C6.81142 6.0633 6.42128 6.43691 6.18808 6.59294L5.42857 7.13786"
       stroke="currentColor"
       stroke-linejoin="round"
     />
diff --git a/frontend/src/components/Layouts/AppSidebar.vue b/frontend/src/components/Layouts/AppSidebar.vue
index 413a151a..890a53fd 100644
--- a/frontend/src/components/Layouts/AppSidebar.vue
+++ b/frontend/src/components/Layouts/AppSidebar.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     class="relative flex h-full flex-col justify-between transition-all duration-300 ease-in-out"
-    :class="isSidebarCollapsed ? 'w-12' : 'w-56'"
+    :class="isSidebarCollapsed ? 'w-12' : 'w-[220px]'"
   >
     <div>
       <UserDropdown class="p-2" :isCollapsed="isSidebarCollapsed" />
@@ -58,9 +58,7 @@
                 class="h-4 text-gray-900 transition-all duration-300 ease-in-out"
                 :class="{ 'rotate-90': opened }"
               />
-              <span class="uppercase">
-                {{ __(view.name) }}
-              </span>
+              <span>{{ __(view.name) }}</span>
             </div>
           </template>
           <nav class="flex flex-col">
diff --git a/frontend/src/components/ListViews/CallLogsListView.vue b/frontend/src/components/ListViews/CallLogsListView.vue
index b8302a50..d4381818 100644
--- a/frontend/src/components/ListViews/CallLogsListView.vue
+++ b/frontend/src/components/ListViews/CallLogsListView.vue
@@ -81,11 +81,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/ListViews/ContactsListView.vue b/frontend/src/components/ListViews/ContactsListView.vue
index 4e5d33f5..e4fdda12 100644
--- a/frontend/src/components/ListViews/ContactsListView.vue
+++ b/frontend/src/components/ListViews/ContactsListView.vue
@@ -83,11 +83,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/ListViews/DealsListView.vue b/frontend/src/components/ListViews/DealsListView.vue
index 73d421ec..40a0c934 100644
--- a/frontend/src/components/ListViews/DealsListView.vue
+++ b/frontend/src/components/ListViews/DealsListView.vue
@@ -115,11 +115,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
@@ -219,7 +215,9 @@ function editValues(selections, unselectAll) {
 function deleteValues(selections, unselectAll) {
   $dialog({
     title: __('Delete'),
-    message: __('Are you sure you want to delete {0} item(s)?', [selections.size]),
+    message: __('Are you sure you want to delete {0} item(s)?', [
+      selections.size,
+    ]),
     variant: 'danger',
     actions: [
       {
diff --git a/frontend/src/components/ListViews/EmailTemplatesListView.vue b/frontend/src/components/ListViews/EmailTemplatesListView.vue
index c965d37b..1a35aa6d 100644
--- a/frontend/src/components/ListViews/EmailTemplatesListView.vue
+++ b/frontend/src/components/ListViews/EmailTemplatesListView.vue
@@ -70,11 +70,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/ListViews/LeadsListView.vue b/frontend/src/components/ListViews/LeadsListView.vue
index 229e50ae..a7a0a005 100644
--- a/frontend/src/components/ListViews/LeadsListView.vue
+++ b/frontend/src/components/ListViews/LeadsListView.vue
@@ -124,11 +124,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/ListViews/OrganizationsListView.vue b/frontend/src/components/ListViews/OrganizationsListView.vue
index 2e23e05e..e3ed5b99 100644
--- a/frontend/src/components/ListViews/OrganizationsListView.vue
+++ b/frontend/src/components/ListViews/OrganizationsListView.vue
@@ -70,11 +70,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/ListViews/TasksListView.vue b/frontend/src/components/ListViews/TasksListView.vue
index 3152c9f2..43a945aa 100644
--- a/frontend/src/components/ListViews/TasksListView.vue
+++ b/frontend/src/components/ListViews/TasksListView.vue
@@ -83,11 +83,7 @@
     <ListSelectBanner>
       <template #actions="{ selections, unselectAll }">
         <Dropdown :options="bulkActions(selections, unselectAll)">
-          <Button variant="ghost">
-            <template #icon>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </template>
-          </Button>
+          <Button icon="more-horizontal" variant="ghost" />
         </Dropdown>
       </template>
     </ListSelectBanner>
diff --git a/frontend/src/components/Modals/WhatsappTemplateSelectorModal.vue b/frontend/src/components/Modals/WhatsappTemplateSelectorModal.vue
index 938500e6..0df92da0 100644
--- a/frontend/src/components/Modals/WhatsappTemplateSelectorModal.vue
+++ b/frontend/src/components/Modals/WhatsappTemplateSelectorModal.vue
@@ -52,6 +52,10 @@
 import { TextEditor, createListResource } from 'frappe-ui'
 import { ref, computed, nextTick, watch, onMounted } from 'vue'
 
+const props = defineProps({
+  doctype: String,
+})
+
 const show = defineModel()
 const searchInput = ref('')
 
@@ -64,7 +68,7 @@ const templates = createListResource({
   doctype: 'WhatsApp Templates',
   cache: ['whatsappTemplates'],
   fields: ['name', 'template', 'footer'],
-  filters: { status: 'APPROVED' },
+  filters: { status: 'APPROVED', for_doctype: ['in', [props.doctype, '']]},
   orderBy: 'modified desc',
   pageLength: 99999,
   auto: true,
diff --git a/frontend/src/components/Resizer.vue b/frontend/src/components/Resizer.vue
new file mode 100644
index 00000000..342ad44c
--- /dev/null
+++ b/frontend/src/components/Resizer.vue
@@ -0,0 +1,66 @@
+<template>
+  <div class="relative" :style="{ width: `${sidebarWidth}px` }">
+    <slot v-bind="{ sidebarResizing, sidebarWidth }" />
+    <div
+      class="absolute left-0 z-10 h-full w-1 cursor-col-resize bg-gray-300 opacity-0 transition-opacity hover:opacity-100"
+      :class="{ 'opacity-100': sidebarResizing }"
+      @mousedown="startResize"
+    />
+  </div>
+</template>
+<script setup>
+import { ref } from 'vue'
+
+const props = defineProps({
+  defaultWidth: {
+    type: Number,
+    default: 352,
+  },
+  minWidth: {
+    type: Number,
+    default: 16 * 16,
+  },
+  maxWidth: {
+    type: Number,
+    default: 30 * 16,
+  },
+  side: {
+    type: String,
+    default: 'left',
+  },
+})
+
+const sidebarResizing = ref(false)
+const sidebarWidth = ref(props.defaultWidth)
+
+function startResize() {
+  document.addEventListener('mousemove', resize)
+  document.addEventListener('mouseup', () => {
+    document.body.classList.remove('select-none')
+    document.body.classList.remove('cursor-col-resize')
+    localStorage.setItem('sidebarWidth', sidebarWidth.value)
+    sidebarResizing.value = false
+    document.removeEventListener('mousemove', resize)
+  })
+}
+function resize(e) {
+  sidebarResizing.value = true
+  document.body.classList.add('select-none')
+  document.body.classList.add('cursor-col-resize')
+  sidebarWidth.value =
+    props.side == 'left' ? e.clientX : window.innerWidth - e.clientX
+
+  // snap to props.defaultWidth
+  let range = [props.defaultWidth - 10, props.defaultWidth + 10]
+  if (sidebarWidth.value > range[0] && sidebarWidth.value < range[1]) {
+    sidebarWidth.value = props.defaultWidth
+  }
+
+  if (sidebarWidth.value < props.minWidth) {
+    sidebarWidth.value = props.minWidth
+  }
+  if (sidebarWidth.value > props.maxWidth) {
+    sidebarWidth.value = props.maxWidth
+  }
+}
+</script>
diff --git a/frontend/src/components/ViewControls.vue b/frontend/src/components/ViewControls.vue
index b7cea0c7..f83c1b39 100644
--- a/frontend/src/components/ViewControls.vue
+++ b/frontend/src/components/ViewControls.vue
@@ -18,9 +18,7 @@
       </Dropdown>
       <Dropdown :options="viewActions">
         <template #default>
-          <Button>
-            <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-          </Button>
+          <Button icon="more-horizontal" />
         </template>
       </Dropdown>
     </div>
@@ -69,9 +67,7 @@
           ]"
         >
           <template #default>
-            <Button>
-              <FeatherIcon name="more-horizontal" class="h-4 w-4" />
-            </Button>
+            <Button icon="more-horizontal" />
           </template>
         </Dropdown>
       </div>
diff --git a/frontend/src/pages/Deal.vue b/frontend/src/pages/Deal.vue
index 3e010b00..50532742 100644
--- a/frontend/src/pages/Deal.vue
+++ b/frontend/src/pages/Deal.vue
@@ -45,19 +45,20 @@
         v-model="deal"
       />
     </Tabs>
-    <div class="flex w-[352px] flex-col justify-between border-l">
+    <Resizer side="right" class="flex flex-col justify-between border-l">
       <div
-        class="flex h-10.5 items-center border-b px-5 py-2.5 text-lg font-semibold"
+        class="flex h-10.5 cursor-copy items-center border-b px-5 py-2.5 text-lg font-medium"
+        @click="copyToClipboard(deal.data.name)"
       >
-        {{ __('About this Deal') }}
+        {{ __(deal.data.name) }}
       </div>
       <div class="flex items-center justify-start gap-5 border-b p-5">
         <Tooltip :text="__('Organization logo')">
-          <div class="group relative h-[88px] w-[88px]">
+          <div class="group relative size-12">
             <Avatar
               size="3xl"
-              class="h-[88px] w-[88px]"
-              :label="organization?.name"
+              class="size-12"
+              :label="organization?.name || __('Untitled')"
               :image="organization?.organization_logo"
             />
           </div>
@@ -65,7 +66,7 @@
         <div class="flex flex-col gap-2.5 truncate">
           <Tooltip :text="organization?.name">
             <div class="truncate text-2xl font-medium">
-              {{ organization?.name }}
+              {{ organization?.name || __('Untitled') }}
             </div>
           </Tooltip>
           <div class="flex gap-1.5">
@@ -138,13 +139,10 @@
                     <template #target="{ togglePopover }">
                       <Button
                         class="h-7 px-3"
-                        :label="__('Add Contact')"
+                        variant="ghost"
+                        icon="plus"
                         @click="togglePopover()"
-                      >
-                        <template #prefix>
-                          <FeatherIcon name="plus" class="h-4" />
-                        </template>
-                      </Button>
+                      />
                     </template>
                   </Link>
                 </div>
@@ -201,12 +199,11 @@
                           </div>
                           <div class="flex items-center">
                             <Dropdown :options="contactOptions(contact.name)">
-                              <Button variant="ghost">
-                                <FeatherIcon
-                                  name="more-horizontal"
-                                  class="h-4 text-gray-600"
-                                />
-                              </Button>
+                              <Button
+                                icon="more-horizontal"
+                                class="text-gray-600"
+                                variant="ghost"
+                              />
                             </Dropdown>
                             <Button
                               variant="ghost"
@@ -259,7 +256,7 @@
           </div>
         </div>
       </div>
-    </div>
+    </Resizer>
   </div>
   <OrganizationModal
     v-model="showOrganizationModal"
@@ -288,6 +285,7 @@
   />
 </template>
 <script setup>
+import Resizer from '@/components/Resizer.vue'
 import LoadingIndicator from '@/components/Icons/LoadingIndicator.vue'
 import ActivityIcon from '@/components/Icons/ActivityIcon.vue'
 import EmailIcon from '@/components/Icons/EmailIcon.vue'
@@ -316,6 +314,7 @@ import {
   setupAssignees,
   setupCustomActions,
   errorMessage,
+  copyToClipboard,
 } from '@/utils'
 import { globalStore } from '@/stores/global'
 import { organizationsStore } from '@/stores/organizations'
@@ -429,7 +428,7 @@ function validateRequired(fieldname, value) {
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Deals'), route: { name: 'Deals' } }]
   items.push({
-    label: organization.value?.name,
+    label: organization.value?.name || __('Untitled'),
     route: { name: 'Deal', params: { dealId: deal.data.name } },
   })
   return items
diff --git a/frontend/src/pages/Lead.vue b/frontend/src/pages/Lead.vue
index fe976a3d..8849feb3 100644
--- a/frontend/src/pages/Lead.vue
+++ b/frontend/src/pages/Lead.vue
@@ -50,11 +50,12 @@
         v-model="lead"
       />
     </Tabs>
-    <div class="flex w-[352px] flex-col justify-between border-l">
+    <Resizer class="flex flex-col justify-between border-l" side="right">
       <div
-        class="flex h-10.5 items-center border-b px-5 py-2.5 text-lg font-semibold"
+        class="flex h-10.5 cursor-copy items-center border-b px-5 py-2.5 text-lg font-medium"
+        @click="copyToClipboard(lead.data.name)"
       >
-        {{ __('About this Lead') }}
+        {{ __(lead.data.name) }}
       </div>
       <FileUploader
         @success="(file) => updateField('image', file.file_url)"
@@ -62,11 +63,11 @@
       >
         <template #default="{ openFileSelector, error }">
           <div class="flex items-center justify-start gap-5 border-b p-5">
-            <div class="group relative h-[88px] w-[88px]">
+            <div class="group relative size-12">
               <Avatar
                 size="3xl"
-                class="h-[88px] w-[88px]"
-                :label="lead.data.first_name"
+                class="size-12"
+                :label="lead.data.first_name || __('Untitled')"
                 :image="lead.data.image"
               />
               <component
@@ -94,20 +95,20 @@
                 class="!absolute bottom-0 left-0 right-0"
               >
                 <div
-                  class="z-1 absolute bottom-0 left-0 right-0 flex h-13 cursor-pointer items-center justify-center rounded-b-full bg-black bg-opacity-40 pt-3 opacity-0 duration-300 ease-in-out group-hover:opacity-100"
+                  class="z-1 absolute bottom-0 left-0 right-0 flex h-9 cursor-pointer items-center justify-center rounded-b-full bg-black bg-opacity-40 pt-3 opacity-0 duration-300 ease-in-out group-hover:opacity-100"
                   style="
                     -webkit-clip-path: inset(12px 0 0 0);
                     clip-path: inset(12px 0 0 0);
                   "
                 >
-                  <CameraIcon class="h-6 w-6 cursor-pointer text-white" />
+                  <CameraIcon class="size-4 cursor-pointer text-white" />
                 </div>
               </component>
             </div>
             <div class="flex flex-col gap-2.5 truncate">
               <Tooltip :text="lead.data.lead_name">
                 <div class="truncate text-2xl font-medium">
-                  {{ lead.data.lead_name }}
+                  {{ lead.data.lead_name || __('Untitled') }}
                 </div>
               </Tooltip>
               <div class="flex gap-1.5">
@@ -180,7 +181,7 @@
           </div>
         </div>
       </div>
-    </div>
+    </Resizer>
   </div>
   <AssignmentModal
     v-if="lead.data"
@@ -256,6 +257,7 @@
   </Dialog>
 </template>
 <script setup>
+import Resizer from '@/components/Resizer.vue'
 import ActivityIcon from '@/components/Icons/ActivityIcon.vue'
 import EmailIcon from '@/components/Icons/EmailIcon.vue'
 import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
@@ -282,6 +284,7 @@ import {
   setupAssignees,
   setupCustomActions,
   errorMessage,
+  copyToClipboard,
 } from '@/utils'
 import { globalStore } from '@/stores/global'
 import { contactsStore } from '@/stores/contacts'
@@ -393,7 +396,7 @@ function validateRequired(fieldname, value) {
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Leads'), route: { name: 'Leads' } }]
   items.push({
-    label: lead.data.lead_name,
+    label: lead.data.lead_name || __('Untitled'),
     route: { name: 'Lead', params: { leadId: lead.data.name } },
   })
   return items
diff --git a/frontend/src/utils/index.js b/frontend/src/utils/index.js
index 0c7dc03b..77065a49 100644
--- a/frontend/src/utils/index.js
+++ b/frontend/src/utils/index.js
@@ -147,3 +147,25 @@ export function errorMessage(title, message) {
     iconClasses: 'text-red-600',
   })
 }
+
+export function copyToClipboard(text) {
+  if (navigator.clipboard && window.isSecureContext) {
+    navigator.clipboard.writeText(string).then(show_success_alert)
+  } else {
+    let input = document.createElement('textarea')
+    document.body.appendChild(input)
+    input.value = text
+    input.select()
+    document.execCommand('copy')
+    show_success_alert()
+    document.body.removeChild(input)
+  }
+  function show_success_alert() {
+    createToast({
+      title: 'Copied to clipboard',
+      text: text,
+      icon: 'check',
+      iconClasses: 'text-green-600',
+    })
+  }
+}