diff --git a/crm/fcrm/doctype/crm_deal/api.py b/crm/fcrm/doctype/crm_deal/api.py
index 499d48ac..881e2e69 100644
--- a/crm/fcrm/doctype/crm_deal/api.py
+++ b/crm/fcrm/doctype/crm_deal/api.py
@@ -1,20 +1,5 @@
 import frappe
 
-from crm.api.doc import get_fields_meta
-from crm.fcrm.doctype.crm_form_script.crm_form_script import get_form_script
-
-
-@frappe.whitelist()
-def get_deal(name):
-	deal = frappe.get_doc("CRM Deal", name)
-	deal.check_permission("read")
-
-	deal = deal.as_dict()
-
-	deal["fields_meta"] = get_fields_meta("CRM Deal")
-	deal["_form_script"] = get_form_script("CRM Deal")
-	return deal
-
 
 @frappe.whitelist()
 def get_deal_contacts(name):
diff --git a/crm/fcrm/doctype/crm_lead/api.py b/crm/fcrm/doctype/crm_lead/api.py
deleted file mode 100644
index cfb89540..00000000
--- a/crm/fcrm/doctype/crm_lead/api.py
+++ /dev/null
@@ -1,16 +0,0 @@
-import frappe
-
-from crm.api.doc import get_fields_meta
-from crm.fcrm.doctype.crm_form_script.crm_form_script import get_form_script
-
-
-@frappe.whitelist()
-def get_lead(name):
-	lead = frappe.get_doc("CRM Lead", name)
-	lead.check_permission("read")
-
-	lead = lead.as_dict()
-
-	lead["fields_meta"] = get_fields_meta("CRM Lead")
-	lead["_form_script"] = get_form_script("CRM Lead")
-	return lead
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index f14de1bb..bea5e3d2 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,7 +1,7 @@
 <template>
   <FrappeUIProvider>
     <Layout v-if="session().isLoggedIn">
-      <router-view />
+      <router-view :key="$route.fullPath"/>
     </Layout>
     <Dialogs />
   </FrappeUIProvider>
diff --git a/frontend/src/components/Activities/Activities.vue b/frontend/src/components/Activities/Activities.vue
index 1ef91dc1..32528416 100644
--- a/frontend/src/components/Activities/Activities.vue
+++ b/frontend/src/components/Activities/Activities.vue
@@ -367,7 +367,7 @@
     <div v-else-if="title == 'Data'" class="h-full flex flex-col px-3 sm:px-10">
       <DataFields
         :doctype="doctype"
-        :docname="doc.data.name"
+        :docname="docname"
         @beforeSave="(data) => emit('beforeSave', data)"
         @afterSave="(data) => emit('afterSave', data)"
       />
@@ -438,10 +438,9 @@
     :doc="doc"
   />
   <FilesUploader
-    v-if="doc.data?.name"
     v-model="showFilesUploader"
     :doctype="doctype"
-    :docname="doc.data.name"
+    :docname="docname"
     @after="
       () => {
         all_activities.reload()
@@ -514,6 +513,10 @@ const props = defineProps({
     type: String,
     default: 'CRM Lead',
   },
+  docname: {
+    type: String,
+    default: '',
+  },
   tabs: {
     type: Array,
     default: () => [],
@@ -524,11 +527,12 @@ const emit = defineEmits(['beforeSave', 'afterSave'])
 
 const route = useRoute()
 
-const doc = defineModel()
 const reload = defineModel('reload')
 const tabIndex = defineModel('tabIndex')
 
-const { document: _document } = useDocument(props.doctype, doc.value.data.name)
+const { document: _document } = useDocument(props.doctype, props.docname)
+
+const doc = computed(() => _document.doc || {})
 
 const reload_email = ref(false)
 const modalRef = ref(null)
@@ -545,8 +549,8 @@ const changeTabTo = (tabName) => {
 
 const all_activities = createResource({
   url: 'crm.api.activities.get_activities',
-  params: { name: doc.value.data.name },
-  cache: ['activity', doc.value.data.name],
+  params: { name: props.docname },
+  cache: ['activity', props.docname],
   auto: true,
   transform: ([versions, calls, notes, tasks, attachments]) => {
     return { versions, calls, notes, tasks, attachments }
@@ -557,12 +561,12 @@ const showWhatsappTemplates = ref(false)
 
 const whatsappMessages = createResource({
   url: 'crm.api.whatsapp.get_whatsapp_messages',
-  cache: ['whatsapp_messages', doc.value.data.name],
+  cache: ['whatsapp_messages', props.docname],
   params: {
     reference_doctype: props.doctype,
-    reference_name: doc.value.data.name,
+    reference_name: props.docname,
   },
-  auto: true,
+  auto: whatsappEnabled.value,
   transform: (data) => sortByCreation(data),
   onSuccess: () => nextTick(() => scroll()),
 })
@@ -575,7 +579,7 @@ onMounted(() => {
   $socket.on('whatsapp_message', (data) => {
     if (
       data.reference_doctype === props.doctype &&
-      data.reference_name === doc.value.data.name
+      data.reference_name === props.docname
     ) {
       whatsappMessages.reload()
     }
@@ -597,8 +601,8 @@ function sendTemplate(template) {
     url: 'crm.api.whatsapp.send_whatsapp_template',
     params: {
       reference_doctype: props.doctype,
-      reference_name: doc.value.data.name,
-      to: doc.value.data.mobile_no,
+      reference_name: props.docname,
+      to: doc.value.mobile_no,
       template,
     },
     auto: true,
@@ -801,7 +805,7 @@ const callActions = computed(() => {
     },
     {
       label: __('Make a Call'),
-      onClick: () => makeCall(doc.data.mobile_no),
+      onClick: () => makeCall(doc.value.mobile_no),
       condition: () => callEnabled.value,
     },
   ]
diff --git a/frontend/src/components/Activities/ActivityHeader.vue b/frontend/src/components/Activities/ActivityHeader.vue
index b566d189..49512204 100644
--- a/frontend/src/components/Activities/ActivityHeader.vue
+++ b/frontend/src/components/Activities/ActivityHeader.vue
@@ -140,7 +140,7 @@ const defaultActions = computed(() => {
     {
       icon: h(PhoneIcon, { class: 'h-4 w-4' }),
       label: __('Make a Call'),
-      onClick: () => makeCall(props.doc.data.mobile_no),
+      onClick: () => makeCall(props.doc.mobile_no),
       condition: () => callEnabled.value,
     },
     {
@@ -184,7 +184,7 @@ const callActions = computed(() => {
     {
       label: __('Make a Call'),
       icon: h(PhoneIcon, { class: 'h-4 w-4' }),
-      onClick: () => makeCall(props.doc.data.mobile_no),
+      onClick: () => makeCall(props.doc.mobile_no),
       condition: () => callEnabled.value,
     },
   ]
diff --git a/frontend/src/components/Activities/AllModals.vue b/frontend/src/components/Activities/AllModals.vue
index ec58b6ee..94795cc3 100644
--- a/frontend/src/components/Activities/AllModals.vue
+++ b/frontend/src/components/Activities/AllModals.vue
@@ -4,7 +4,7 @@
     v-model:reloadTasks="activities"
     :task="task"
     :doctype="doctype"
-    :doc="doc.data?.name"
+    :doc="doc?.name"
     @after="redirect('tasks')"
   />
   <NoteModal
@@ -12,7 +12,7 @@
     v-model:reloadNotes="activities"
     :note="note"
     :doctype="doctype"
-    :doc="doc.data?.name"
+    :doc="doc?.name"
     @after="redirect('notes')"
   />
   <CallLogModal
@@ -92,8 +92,8 @@ const referenceDoc = ref({})
 
 function createCallLog() {
   let doctype = props.doctype
-  let docname = props.doc.data?.name
-  referenceDoc.value = { ...props.doc.data }
+  let docname = props.doc?.name
+  referenceDoc.value = { ...props.doc }
   callLog.value = {
     reference_doctype: doctype,
     reference_docname: docname,
diff --git a/frontend/src/components/Activities/AttachmentArea.vue b/frontend/src/components/Activities/AttachmentArea.vue
index 380869d9..7627b5e2 100644
--- a/frontend/src/components/Activities/AttachmentArea.vue
+++ b/frontend/src/components/Activities/AttachmentArea.vue
@@ -50,10 +50,12 @@
                     togglePrivate(attachment.name, attachment.is_private)
                   "
                 >
-                  <FeatherIcon
-                    :name="attachment.is_private ? 'lock' : 'unlock'"
-                    class="size-3 text-ink-gray-7"
-                  />
+                  <template #icon>
+                    <FeatherIcon
+                      :name="attachment.is_private ? 'lock' : 'unlock'"
+                      class="size-3 text-ink-gray-7"
+                    />
+                  </template>
                 </Button>
               </div>
             </Tooltip>
@@ -63,7 +65,12 @@
                   class="!size-5"
                   @click.stop="() => deleteAttachment(attachment.name)"
                 >
-                  <FeatherIcon name="trash-2" class="size-3 text-ink-gray-7" />
+                  <template #icon>
+                    <FeatherIcon
+                      name="trash-2"
+                      class="size-3 text-ink-gray-7"
+                    />
+                  </template>
                 </Button>
               </div>
             </Tooltip>
diff --git a/frontend/src/components/Activities/WhatsAppBox.vue b/frontend/src/components/Activities/WhatsAppBox.vue
index 95cb1aed..e4e58205 100644
--- a/frontend/src/components/Activities/WhatsAppBox.vue
+++ b/frontend/src/components/Activities/WhatsAppBox.vue
@@ -107,9 +107,9 @@ function sendTextMessage(event) {
 async function sendWhatsAppMessage() {
   let args = {
     reference_doctype: props.doctype,
-    reference_name: doc.value.data.name,
+    reference_name: doc.value.name,
     message: content.value,
-    to: doc.value.data.mobile_no,
+    to: doc.value.mobile_no,
     attach: whatsapp.value.attach || '',
     reply_to: reply.value?.name || '',
     content_type: whatsapp.value.content_type,
diff --git a/frontend/src/components/CommunicationArea.vue b/frontend/src/components/CommunicationArea.vue
index 008c54e5..423adb75 100644
--- a/frontend/src/components/CommunicationArea.vue
+++ b/frontend/src/components/CommunicationArea.vue
@@ -45,7 +45,7 @@
         onClick: () => {
           showEmailBox = false
           newEmailEditor.subject = subject
-          newEmailEditor.toEmails = doc.data.email ? [doc.data.email] : []
+          newEmailEditor.toEmails = doc.email ? [doc.email] : []
           newEmailEditor.ccEmails = []
           newEmailEditor.bccEmails = []
           newEmailEditor.cc = false
@@ -54,7 +54,7 @@
         },
       }"
       :editable="showEmailBox"
-      v-model="doc.data"
+      v-model="doc"
       v-model:attachments="attachments"
       :doctype="doctype"
       :subject="subject"
@@ -79,7 +79,7 @@
         },
       }"
       :editable="showCommentBox"
-      v-model="doc.data"
+      v-model="doc"
       v-model:attachments="attachments"
       :doctype="doctype"
       :placeholder="__('@John, can you please check this?')"
@@ -125,12 +125,12 @@ const attachments = ref([])
 
 const subject = computed(() => {
   let prefix = ''
-  if (doc.value.data?.lead_name) {
-    prefix = doc.value.data.lead_name
-  } else if (doc.value.data?.organization) {
-    prefix = doc.value.data.organization
+  if (doc.value?.lead_name) {
+    prefix = doc.value.lead_name
+  } else if (doc.value?.organization) {
+    prefix = doc.value.organization
   }
-  return `${prefix} (#${doc.value.data.name})`
+  return `${prefix} (#${doc.value.name})`
 })
 
 const signature = createResource({
@@ -199,7 +199,7 @@ async function sendMail() {
     subject: subject,
     content: newEmail.value,
     doctype: props.doctype,
-    name: doc.value.data.name,
+    name: doc.value.name,
     send_email: 1,
     sender: getUser().email,
     sender_full_name: getUser()?.full_name || undefined,
@@ -209,7 +209,7 @@ async function sendMail() {
 async function sendComment() {
   let comment = await call('frappe.desk.form.utils.add_comment', {
     reference_doctype: props.doctype,
-    reference_name: doc.value.data.name,
+    reference_name: doc.value.name,
     content: newComment.value,
     comment_email: getUser().email,
     comment_by: getUser()?.full_name || undefined,
diff --git a/frontend/src/data/document.js b/frontend/src/data/document.js
index 80d95255..5a970f20 100644
--- a/frontend/src/data/document.js
+++ b/frontend/src/data/document.js
@@ -3,23 +3,39 @@ import { globalStore } from '@/stores/global'
 import { showSettings, activeSettingsPage } from '@/composables/settings'
 import { runSequentially, parseAssignees } from '@/utils'
 import { createDocumentResource, createResource, toast } from 'frappe-ui'
-import { reactive } from 'vue'
+import { ref, reactive } from 'vue'
 
 const documentsCache = {}
 const controllersCache = {}
 const assigneesCache = {}
 
 export function useDocument(doctype, docname) {
-  const { setupScript } = getScript(doctype)
+  const { setupScript, scripts } = getScript(doctype)
 
   documentsCache[doctype] = documentsCache[doctype] || {}
 
+  const error = ref('')
+
   if (!documentsCache[doctype][docname || '']) {
     if (docname) {
       documentsCache[doctype][docname] = createDocumentResource({
         doctype: doctype,
         name: docname,
         onSuccess: async () => await setupFormScript(),
+        onError: (err) => {
+          error.value = err
+          if (err.exc_type === 'DoesNotExistError') {
+            toast.error(__(err.messages[0] || 'Document does not exist'))
+          }
+          if (err.exc_type === 'PermissionError') {
+            toast.error(
+              __(
+                err.messages[0] ||
+                  'You do not have permission to access this document',
+              ),
+            )
+          }
+        },
         setValue: {
           onSuccess: () => {
             triggerOnSave()
@@ -262,6 +278,8 @@ export function useDocument(doctype, docname) {
   return {
     document: documentsCache[doctype][docname || ''],
     assignees: assigneesCache[doctype][docname || ''],
+    scripts,
+    error,
     getControllers,
     triggerOnLoad,
     triggerOnBeforeCreate,
diff --git a/frontend/src/pages/Deal.vue b/frontend/src/pages/Deal.vue
index 260aaa0d..7c8e9605 100644
--- a/frontend/src/pages/Deal.vue
+++ b/frontend/src/pages/Deal.vue
@@ -1,5 +1,5 @@
 <template>
-  <LayoutHeader v-if="deal.data">
+  <LayoutHeader>
     <template #left-header>
       <Breadcrumbs :items="breadcrumbs">
         <template #prefix="{ item }">
@@ -7,38 +7,30 @@
         </template>
       </Breadcrumbs>
     </template>
-    <template #right-header>
+    <template v-if="!errorTitle" #right-header>
       <CustomActions
-        v-if="deal.data._customActions?.length"
-        :actions="deal.data._customActions"
+        v-if="document._actions?.length"
+        :actions="document._actions"
       />
       <CustomActions
         v-if="document.actions?.length"
         :actions="document.actions"
       />
-      <AssignTo
-        v-model="assignees.data"
-        :data="document.doc"
-        doctype="CRM Deal"
-      />
+      <AssignTo v-model="assignees.data" :data="doc" doctype="CRM Deal" />
       <Dropdown
-        v-if="document.doc"
+        v-if="doc"
         :options="
           statusOptions(
             'deal',
-            document.statuses?.length
-              ? document.statuses
-              : deal.data._customStatuses,
+            document.statuses?.length ? document.statuses : document._statuses,
             triggerStatusChange,
           )
         "
       >
         <template #default="{ open }">
-          <Button :label="document.doc.status">
+          <Button v-if="doc.status" :label="doc.status">
             <template #prefix>
-              <IndicatorIcon
-                :class="getDealStatus(document.doc.status).color"
-              />
+              <IndicatorIcon :class="getDealStatus(doc.status).color" />
             </template>
             <template #suffix>
               <FeatherIcon
@@ -51,16 +43,16 @@
       </Dropdown>
     </template>
   </LayoutHeader>
-  <div v-if="deal.data" class="flex h-full overflow-hidden">
+  <div v-if="doc.name" class="flex h-full overflow-hidden">
     <Tabs as="div" v-model="tabIndex" :tabs="tabs">
       <template #tab-panel>
         <Activities
           ref="activities"
           doctype="CRM Deal"
+          :docname="dealId"
           :tabs="tabs"
           v-model:reload="reload"
           v-model:tabIndex="tabIndex"
-          v-model="deal"
           @beforeSave="beforeStatusChange"
           @afterSave="reloadAssignees"
         />
@@ -69,9 +61,9 @@
     <Resizer side="right" class="flex flex-col justify-between border-l">
       <div
         class="flex h-10.5 cursor-copy items-center border-b px-5 py-2.5 text-lg font-medium text-ink-gray-9"
-        @click="copyToClipboard(deal.data.name)"
+        @click="copyToClipboard(dealId)"
       >
-        {{ __(deal.data.name) }}
+        {{ __(dealId) }}
       </div>
       <div class="flex items-center justify-start gap-5 border-b p-5">
         <Tooltip :text="__('Organization logo')">
@@ -80,12 +72,12 @@
               size="3xl"
               class="size-12"
               :label="title"
-              :image="organization.data?.organization_logo"
+              :image="organization?.organization_logo"
             />
           </div>
         </Tooltip>
         <div class="flex flex-col gap-2.5 truncate text-ink-gray-9">
-          <Tooltip :text="organization.data?.name || __('Set an organization')">
+          <Tooltip :text="organization?.name || __('Set an organization')">
             <div class="truncate text-2xl font-medium">
               {{ title }}
             </div>
@@ -102,9 +94,7 @@
               <div>
                 <Button
                   @click="
-                    deal.data.email
-                      ? openEmailBox()
-                      : toast.error(__('No email set'))
+                    doc.email ? openEmailBox() : toast.error(__('No email set'))
                   "
                 >
                   <template #icon><Email2Icon /></template>
@@ -115,8 +105,8 @@
               <div>
                 <Button
                   @click="
-                    deal.data.website
-                      ? openWebsite(deal.data.website)
+                    doc.website
+                      ? openWebsite(doc.website)
                       : toast.error(__('No website set'))
                   "
                 >
@@ -131,12 +121,22 @@
                 </Button>
               </div>
             </Tooltip>
+            <Tooltip :text="__('Delete')">
+              <div>
+                <Button
+                  @click="deleteDealWithModal"
+                  variant="subtle"
+                  icon="trash-2"
+                  theme="red"
+                />
+              </div>
+            </Tooltip>
           </div>
         </div>
       </div>
       <SLASection
-        v-if="deal.data.sla_status"
-        v-model="deal.data"
+        v-if="doc.sla_status"
+        v-model="doc"
         @updateField="updateField"
       />
       <div
@@ -147,7 +147,7 @@
           :sections="sections.data"
           :addContact="addContact"
           doctype="CRM Deal"
-          :docname="deal.data.name"
+          :docname="dealId"
           @reload="sections.reload"
           @beforeFieldChange="beforeStatusChange"
           @afterFieldChange="reloadAssignees"
@@ -162,7 +162,7 @@
                   (value, close) => {
                     _contact = {
                       first_name: value,
-                      company_name: deal.data.organization,
+                      company_name: doc.organization,
                     }
                     showContactModal = true
                     close()
@@ -298,7 +298,7 @@
     :data="_organization"
     :options="{
       redirect: false,
-      afterInsert: (doc) => updateField('organization', doc.name),
+      afterInsert: (_doc) => updateField('organization', _doc.name),
     }"
   />
   <ContactModal
@@ -307,14 +307,13 @@
     :contact="_contact"
     :options="{
       redirect: false,
-      afterInsert: (doc) => addContact(doc.name),
+      afterInsert: (_doc) => addContact(_doc.name),
     }"
   />
   <FilesUploader
-    v-if="deal.data?.name"
     v-model="showFilesUploader"
     doctype="CRM Deal"
-    :docname="deal.data.name"
+    :docname="dealId"
     @after="
       () => {
         activities?.all_activities?.reload()
@@ -326,7 +325,7 @@
     v-if="showDeleteLinkedDocModal"
     v-model="showDeleteLinkedDocModal"
     :doctype="'CRM Deal'"
-    :docname="props.dealId"
+    :docname="dealId"
     name="Deals"
   />
   <LostReasonModal
@@ -336,6 +335,7 @@
   />
 </template>
 <script setup>
+import DeleteLinkedDocModal from '@/components/DeleteLinkedDocModal.vue'
 import ErrorPage from '@/components/ErrorPage.vue'
 import Icon from '@/components/Icon.vue'
 import Resizer from '@/components/Resizer.vue'
@@ -386,7 +386,15 @@ import {
   toast,
 } from 'frappe-ui'
 import { useOnboarding } from 'frappe-ui/frappe'
-import { ref, computed, h, onMounted, onBeforeUnmount, nextTick } from 'vue'
+import {
+  ref,
+  computed,
+  h,
+  onMounted,
+  onBeforeUnmount,
+  nextTick,
+  watch,
+} from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useActiveTabManager } from '@/composables/useActiveTabManager'
 
@@ -410,64 +418,73 @@ const props = defineProps({
 
 const errorTitle = ref('')
 const errorMessage = ref('')
+const showDeleteLinkedDocModal = ref(false)
 
-const deal = createResource({
-  url: 'crm.fcrm.doctype.crm_deal.api.get_deal',
-  params: { name: props.dealId },
-  cache: ['deal', props.dealId],
-  onSuccess: (data) => {
+const { triggerOnChange, assignees, document, scripts, error } = useDocument(
+  'CRM Deal',
+  props.dealId,
+)
+
+const doc = computed(() => document.doc || {})
+
+watch(error, (err) => {
+  if (err) {
+    errorTitle.value = __(
+      err.exc_type == 'DoesNotExistError'
+        ? 'Document not found'
+        : 'Error occurred',
+    )
+    errorMessage.value = __(err.messages?.[0] || 'An error occurred')
+  } else {
     errorTitle.value = ''
     errorMessage.value = ''
+  }
+})
 
-    if (data.organization) {
-      organization.update({
-        params: { doctype: 'CRM Organization', name: data.organization },
+watch(
+  () => document.doc,
+  async (_doc) => {
+    if (scripts.data?.length) {
+      let s = await setupCustomizations(scripts.data, {
+        doc: _doc,
+        $dialog,
+        $socket,
+        router,
+        toast,
+        updateField,
+        createToast: toast.create,
+        deleteDoc: deleteDeal,
+        call,
       })
-      organization.fetch()
-    }
-
-    setupCustomizations(deal, {
-      doc: data,
-      $dialog,
-      $socket,
-      router,
-      toast,
-      updateField,
-      createToast: toast.create,
-      deleteDoc: deleteDeal,
-      resource: {
-        deal,
-        dealContacts,
-        sections,
-      },
-      call,
-    })
-  },
-  onError: (err) => {
-    if (err.messages?.[0]) {
-      errorTitle.value = __('Not permitted')
-      errorMessage.value = __(err.messages?.[0])
-    } else {
-      router.push({ name: 'Deals' })
+      document._actions = s.actions || []
+      document._statuses = s.statuses || []
     }
   },
-})
+  { once: true },
+)
 
-const organization = createResource({
-  url: 'frappe.client.get',
-  onSuccess: (data) => (deal.data._organizationObj = data),
-})
+const organizationDocument = ref(null)
+
+watch(
+  () => doc.value.organization,
+  (org) => {
+    if (org && !organizationDocument.value?.doc) {
+      let { document: _organizationDocument } = useDocument(
+        'CRM Organization',
+        org,
+      )
+      organizationDocument.value = _organizationDocument
+    }
+  },
+  { immediate: true },
+)
+
+const organization = computed(() => organizationDocument.value?.doc || {})
 
 onMounted(() => {
   $socket.on('crm_customer_created', () => {
     toast.success(__('Customer created successfully'))
   })
-
-  if (deal.data) {
-    organization.data = deal.data._organizationObj
-    return
-  }
-  deal.fetch()
 })
 
 onBeforeUnmount(() => {
@@ -478,45 +495,6 @@ const reload = ref(false)
 const showOrganizationModal = ref(false)
 const showFilesUploader = ref(false)
 const _organization = ref({})
-const showDeleteLinkedDocModal = ref(false)
-
-async function deleteDealWithModal() {
-  showDeleteLinkedDocModal.value = true
-}
-function updateDeal(fieldname, value, callback) {
-  value = Array.isArray(fieldname) ? '' : value
-
-  if (validateRequired(fieldname, value)) return
-
-  createResource({
-    url: 'frappe.client.set_value',
-    params: {
-      doctype: 'CRM Deal',
-      name: props.dealId,
-      fieldname,
-      value,
-    },
-    auto: true,
-    onSuccess: () => {
-      deal.reload()
-      reload.value = true
-      toast.success(__('Deal updated'))
-      callback?.()
-    },
-    onError: (err) => {
-      toast.error(__('Error updating deal: {0}', [err.messages?.[0]]))
-    },
-  })
-}
-
-function validateRequired(fieldname, value) {
-  let meta = deal.data.fields_meta || {}
-  if (meta[fieldname]?.reqd && !value) {
-    toast.error(__('{0} is a required field', [meta[fieldname].label]))
-    return true
-  }
-  return false
-}
 
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Deals'), route: { name: 'Deals' } }]
@@ -538,14 +516,14 @@ const breadcrumbs = computed(() => {
 
   items.push({
     label: title.value,
-    route: { name: 'Deal', params: { dealId: deal.data.name } },
+    route: { name: 'Deal', params: { dealId: props.dealId } },
   })
   return items
 })
 
 const title = computed(() => {
   let t = doctypeMeta['CRM Deal']?.title_field || 'name'
-  return deal.data?.[t] || props.dealId
+  return doc.value?.[t] || props.dealId
 })
 
 usePageMeta(() => {
@@ -606,6 +584,7 @@ const tabs = computed(() => {
   ]
   return tabOptions.filter((tab) => (tab.condition ? tab.condition() : true))
 })
+
 const { tabIndex } = useActiveTabManager(tabs, 'lastDealTab')
 
 const sections = createResource({
@@ -730,23 +709,40 @@ function triggerCall() {
   makeCall(mobile_no)
 }
 
-function updateField(name, value, callback) {
+async function triggerStatusChange(value) {
+  await triggerOnChange('status', value)
+  setLostReason()
+}
+
+function updateField(name, value) {
   if (name == 'status' && !isOnboardingStepsCompleted.value) {
     updateOnboardingStep('change_deal_status')
   }
 
-  updateDeal(name, value, () => {
-    deal.data[name] = value
-    callback?.()
+  value = Array.isArray(name) ? '' : value
+  let oldValues = Array.isArray(name) ? {} : doc.value[name]
+
+  if (Array.isArray(name)) {
+    name.forEach((field) => (doc.value[field] = value))
+  } else {
+    doc.value[name] = value
+  }
+
+  document.save.submit(null, {
+    onSuccess: () => (reload.value = true),
+    onError: (err) => {
+      if (Array.isArray(name)) {
+        name.forEach((field) => (doc.value[field] = oldValues[field]))
+      } else {
+        doc.value[name] = oldValues
+      }
+      toast.error(err.messages?.[0] || __('Error updating field'))
+    },
   })
 }
 
-async function deleteDeal(name) {
-  await call('frappe.client.delete', {
-    doctype: 'CRM Deal',
-    name,
-  })
-  router.push({ name: 'Deals' })
+function deleteDeal() {
+  showDeleteLinkedDocModal.value = true
 }
 
 const activities = ref(null)
@@ -759,16 +755,6 @@ function openEmailBox() {
   nextTick(() => (activities.value.emailBox.show = true))
 }
 
-const { assignees, document, triggerOnChange } = useDocument(
-  'CRM Deal',
-  props.dealId,
-)
-
-async function triggerStatusChange(value) {
-  await triggerOnChange('status', value)
-  setLostReason()
-}
-
 const showLostReasonModal = ref(false)
 
 function setLostReason() {
@@ -785,7 +771,10 @@ function setLostReason() {
 }
 
 function beforeStatusChange(data) {
-  if (data?.hasOwnProperty('status') && getDealStatus(data.status).type == 'Lost') {
+  if (
+    data?.hasOwnProperty('status') &&
+    getDealStatus(data.status).type == 'Lost'
+  ) {
     setLostReason()
   } else {
     document.save.submit(null, {
diff --git a/frontend/src/pages/Lead.vue b/frontend/src/pages/Lead.vue
index 5cbd599b..7fd52dad 100644
--- a/frontend/src/pages/Lead.vue
+++ b/frontend/src/pages/Lead.vue
@@ -1,5 +1,5 @@
 <template>
-  <LayoutHeader v-if="lead.data">
+  <LayoutHeader>
     <template #left-header>
       <Breadcrumbs :items="breadcrumbs">
         <template #prefix="{ item }">
@@ -7,38 +7,30 @@
         </template>
       </Breadcrumbs>
     </template>
-    <template #right-header>
+    <template v-if="!errorTitle" #right-header>
       <CustomActions
-        v-if="lead.data._customActions?.length"
-        :actions="lead.data._customActions"
+        v-if="document._actions?.length"
+        :actions="document._actions"
       />
       <CustomActions
         v-if="document.actions?.length"
         :actions="document.actions"
       />
-      <AssignTo
-        v-model="assignees.data"
-        :data="document.doc"
-        doctype="CRM Lead"
-      />
+      <AssignTo v-model="assignees.data" :data="doc" doctype="CRM Lead" />
       <Dropdown
-        v-if="document.doc"
+        v-if="doc"
         :options="
           statusOptions(
             'lead',
-            document.statuses?.length
-              ? document.statuses
-              : lead.data._customStatuses,
+            document.statuses?.length ? document.statuses : document._statuses,
             triggerStatusChange,
           )
         "
       >
         <template #default="{ open }">
-          <Button :label="document.doc.status">
+          <Button v-if="doc.status" :label="doc.status">
             <template #prefix>
-              <IndicatorIcon
-                :class="getLeadStatus(document.doc.status).color"
-              />
+              <IndicatorIcon :class="getLeadStatus(doc.status).color" />
             </template>
             <template #suffix>
               <FeatherIcon
@@ -56,16 +48,16 @@
       />
     </template>
   </LayoutHeader>
-  <div v-if="lead?.data" class="flex h-full overflow-hidden">
+  <div v-if="doc.name" class="flex h-full overflow-hidden">
     <Tabs as="div" v-model="tabIndex" :tabs="tabs">
       <template #tab-panel>
         <Activities
           ref="activities"
           doctype="CRM Lead"
+          :docname="leadId"
           :tabs="tabs"
           v-model:reload="reload"
           v-model:tabIndex="tabIndex"
-          v-model="lead"
           @beforeSave="saveChanges"
           @afterSave="reloadAssignees"
         />
@@ -74,9 +66,9 @@
     <Resizer class="flex flex-col justify-between border-l" side="right">
       <div
         class="flex h-10.5 cursor-copy items-center border-b px-5 py-2.5 text-lg font-medium text-ink-gray-9"
-        @click="copyToClipboard(lead.data.name)"
+        @click="copyToClipboard(leadId)"
       >
-        {{ __(lead.data.name) }}
+        {{ __(leadId) }}
       </div>
       <FileUploader
         @success="(file) => updateField('image', file.file_url)"
@@ -89,17 +81,17 @@
                 size="3xl"
                 class="size-12"
                 :label="title"
-                :image="lead.data.image"
+                :image="doc.image"
               />
               <component
-                :is="lead.data.image ? Dropdown : 'div'"
+                :is="doc.image ? Dropdown : 'div'"
                 v-bind="
-                  lead.data.image
+                  doc.image
                     ? {
                         options: [
                           {
                             icon: 'upload',
-                            label: lead.data.image
+                            label: doc.image
                               ? __('Change image')
                               : __('Upload image'),
                             onClick: openFileSelector,
@@ -127,7 +119,7 @@
               </component>
             </div>
             <div class="flex flex-col gap-2.5 truncate">
-              <Tooltip :text="lead.data.lead_name || __('Set first name')">
+              <Tooltip :text="doc.lead_name || __('Set first name')">
                 <div class="truncate text-2xl font-medium text-ink-gray-9">
                   {{ title }}
                 </div>
@@ -138,8 +130,8 @@
                     <Button
                       @click="
                         () =>
-                          lead.data.mobile_no
-                            ? makeCall(lead.data.mobile_no)
+                          doc.mobile_no
+                            ? makeCall(doc.mobile_no)
                             : toast.error(__('No phone number set'))
                       "
                     >
@@ -153,7 +145,7 @@
                   <div>
                     <Button
                       @click="
-                        lead.data.email
+                        doc.email
                           ? openEmailBox()
                           : toast.error(__('No email set'))
                       "
@@ -168,8 +160,8 @@
                   <div>
                     <Button
                       @click="
-                        lead.data.website
-                          ? openWebsite(lead.data.website)
+                        doc.website
+                          ? openWebsite(doc.website)
                           : toast.error(__('No website set'))
                       "
                     >
@@ -188,6 +180,16 @@
                     </Button>
                   </div>
                 </Tooltip>
+                <Tooltip :text="__('Delete')">
+                  <div>
+                    <Button
+                      @click="deleteLead"
+                      variant="subtle"
+                      theme="red"
+                      icon="trash-2"
+                    />
+                  </div>
+                </Tooltip>
               </div>
               <ErrorMessage :message="__(error)" />
             </div>
@@ -195,8 +197,8 @@
         </template>
       </FileUploader>
       <SLASection
-        v-if="lead.data.sla_status"
-        v-model="lead.data"
+        v-if="doc.sla_status"
+        v-model="doc"
         @updateField="updateField"
       />
       <div
@@ -206,7 +208,7 @@
         <SidePanelLayout
           :sections="sections.data"
           doctype="CRM Lead"
-          :docname="lead.data.name"
+          :docname="leadId"
           @reload="sections.reload"
           @afterFieldChange="reloadAssignees"
         />
@@ -221,13 +223,12 @@
   <ConvertToDealModal
     v-if="showConvertToDealModal"
     v-model="showConvertToDealModal"
-    :lead="lead.data"
+    :lead="doc"
   />
   <FilesUploader
-    v-if="lead.data?.name"
     v-model="showFilesUploader"
     doctype="CRM Lead"
-    :docname="lead.data.name"
+    :docname="leadId"
     @after="
       () => {
         activities?.all_activities?.reload()
@@ -239,11 +240,12 @@
     v-if="showDeleteLinkedDocModal"
     v-model="showDeleteLinkedDocModal"
     :doctype="'CRM Lead'"
-    :docname="props.leadId"
+    :docname="leadId"
     name="Leads"
   />
 </template>
 <script setup>
+import DeleteLinkedDocModal from '@/components/DeleteLinkedDocModal.vue'
 import ErrorPage from '@/components/ErrorPage.vue'
 import Icon from '@/components/Icon.vue'
 import Resizer from '@/components/Resizer.vue'
@@ -293,7 +295,7 @@ import {
   usePageMeta,
   toast,
 } from 'frappe-ui'
-import { ref, computed, onMounted, watch, nextTick } from 'vue'
+import { ref, computed, watch, nextTick } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { useActiveTabManager } from '@/composables/useActiveTabManager'
 
@@ -312,93 +314,56 @@ const props = defineProps({
   },
 })
 
+const reload = ref(false)
+const activities = ref(null)
 const errorTitle = ref('')
 const errorMessage = ref('')
 const showDeleteLinkedDocModal = ref(false)
 const showConvertToDealModal = ref(false)
+const showFilesUploader = ref(false)
 
-const { triggerOnChange, assignees, document } = useDocument(
+const { triggerOnChange, assignees, document, scripts, error } = useDocument(
   'CRM Lead',
   props.leadId,
 )
 
-async function triggerStatusChange(value) {
-  await triggerOnChange('status', value)
-  document.save.submit()
-}
+const doc = computed(() => document.doc || {})
 
-const lead = createResource({
-  url: 'crm.fcrm.doctype.crm_lead.api.get_lead',
-  params: { name: props.leadId },
-  cache: ['lead', props.leadId],
-  onSuccess: (data) => {
+watch(error, (err) => {
+  if (err) {
+    errorTitle.value = __(
+      err.exc_type == 'DoesNotExistError'
+        ? 'Document not found'
+        : 'Error occurred',
+    )
+    errorMessage.value = __(err.messages?.[0] || 'An error occurred')
+  } else {
     errorTitle.value = ''
     errorMessage.value = ''
-    setupCustomizations(lead, {
-      doc: data,
-      $dialog,
-      $socket,
-      router,
-      toast,
-      updateField,
-      createToast: toast.create,
-      deleteDoc: deleteLead,
-      resource: { lead, sections },
-      call,
-    })
-  },
-  onError: (err) => {
-    if (err.messages?.[0]) {
-      errorTitle.value = __('Not permitted')
-      errorMessage.value = __(err.messages?.[0])
-    } else {
-      router.push({ name: 'Leads' })
+  }
+})
+
+watch(
+  () => document.doc,
+  async (_doc) => {
+    if (scripts.data?.length) {
+      let s = await setupCustomizations(scripts.data, {
+        doc: _doc,
+        $dialog,
+        $socket,
+        router,
+        toast,
+        updateField,
+        createToast: toast.create,
+        deleteDoc: deleteLead,
+        call,
+      })
+      document._actions = s.actions || []
+      document._statuses = s.statuses || []
     }
   },
-})
-
-onMounted(() => {
-  if (lead.data) return
-  lead.fetch()
-})
-
-const reload = ref(false)
-const showFilesUploader = ref(false)
-
-function updateLead(fieldname, value, callback) {
-  value = Array.isArray(fieldname) ? '' : value
-
-  if (!Array.isArray(fieldname) && validateRequired(fieldname, value)) return
-
-  createResource({
-    url: 'frappe.client.set_value',
-    params: {
-      doctype: 'CRM Lead',
-      name: props.leadId,
-      fieldname,
-      value,
-    },
-    auto: true,
-    onSuccess: () => {
-      lead.reload()
-      reload.value = true
-      toast.success(__('Lead updated successfully'))
-      callback?.()
-    },
-    onError: (err) => {
-      toast.error(err.messages?.[0] || __('Error updating lead'))
-    },
-  })
-}
-
-function validateRequired(fieldname, value) {
-  let meta = lead.data.fields_meta || {}
-  if (meta[fieldname]?.reqd && !value) {
-    toast.error(__('{0} is a required field', [meta[fieldname].label]))
-    return true
-  }
-  return false
-}
+  { once: true },
+)
 
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Leads'), route: { name: 'Leads' } }]
@@ -420,21 +385,18 @@ const breadcrumbs = computed(() => {
 
   items.push({
     label: title.value,
-    route: { name: 'Lead', params: { leadId: lead.data.name } },
+    route: { name: 'Lead', params: { leadId: props.leadId } },
   })
   return items
 })
 
 const title = computed(() => {
   let t = doctypeMeta['CRM Lead']?.title_field || 'name'
-  return lead.data?.[t] || props.leadId
+  return doc?.[t] || props.leadId
 })
 
 usePageMeta(() => {
-  return {
-    title: title.value,
-    icon: brand.favicon,
-  }
+  return { title: title.value, icon: brand.favicon }
 })
 
 const tabs = computed(() => {
@@ -491,17 +453,6 @@ const tabs = computed(() => {
 
 const { tabIndex, changeTabTo } = useActiveTabManager(tabs, 'lastLeadTab')
 
-watch(tabs, (value) => {
-  if (value && route.params.tabName) {
-    let index = value.findIndex(
-      (tab) => tab.name.toLowerCase() === route.params.tabName.toLowerCase(),
-    )
-    if (index !== -1) {
-      tabIndex.value = index
-    }
-  }
-})
-
 const sections = createResource({
   url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_sidepanel_sections',
   cache: ['sidePanelSections', 'CRM Lead'],
@@ -509,27 +460,38 @@ const sections = createResource({
   auto: true,
 })
 
-function updateField(name, value, callback) {
-  updateLead(name, value, () => {
-    lead.data[name] = value
-    callback?.()
+async function triggerStatusChange(value) {
+  await triggerOnChange('status', value)
+  document.save.submit()
+}
+
+function updateField(name, value) {
+  value = Array.isArray(name) ? '' : value
+  let oldValues = Array.isArray(name) ? {} : doc.value[name]
+
+  if (Array.isArray(name)) {
+    name.forEach((field) => (doc.value[field] = value))
+  } else {
+    doc.value[name] = value
+  }
+
+  document.save.submit(null, {
+    onSuccess: () => (reload.value = true),
+    onError: (err) => {
+      if (Array.isArray(name)) {
+        name.forEach((field) => (doc.value[field] = oldValues[field]))
+      } else {
+        doc.value[name] = oldValues
+      }
+      toast.error(err.messages?.[0] || __('Error updating field'))
+    },
   })
 }
 
-async function deleteLead(name) {
-  await call('frappe.client.delete', {
-    doctype: 'CRM Lead',
-    name,
-  })
-  router.push({ name: 'Leads' })
-}
-
-async function deleteLeadWithModal(name) {
+function deleteLead() {
   showDeleteLinkedDocModal.value = true
 }
 
-const activities = ref(null)
-
 function openEmailBox() {
   let currentTab = tabs.value[tabIndex.value]
   if (!['Emails', 'Comments', 'Activities'].includes(currentTab.name)) {
diff --git a/frontend/src/pages/MobileDeal.vue b/frontend/src/pages/MobileDeal.vue
index 5c8e8284..dbe52f54 100644
--- a/frontend/src/pages/MobileDeal.vue
+++ b/frontend/src/pages/MobileDeal.vue
@@ -1,5 +1,5 @@
 <template>
-  <LayoutHeader v-if="deal.data">
+  <LayoutHeader>
     <header
       class="relative flex h-10.5 items-center justify-between gap-2 py-2.5 pl-2"
     >
@@ -10,23 +10,21 @@
       </Breadcrumbs>
       <div class="absolute right-0">
         <Dropdown
-          v-if="document.doc"
+          v-if="doc"
           :options="
             statusOptions(
               'deal',
               document.statuses?.length
                 ? document.statuses
-                : deal.data._customStatuses,
+                : document._statuses,
               triggerStatusChange,
             )
           "
         >
           <template #default="{ open }">
-            <Button :label="document.doc.status">
+            <Button v-if="doc.status" :label="doc.status">
               <template #prefix>
-                <IndicatorIcon
-                  :class="getDealStatus(document.doc.status).color"
-                />
+                <IndicatorIcon :class="getDealStatus(doc.status).color" />
               </template>
               <template #suffix>
                 <FeatherIcon
@@ -41,18 +39,14 @@
     </header>
   </LayoutHeader>
   <div
-    v-if="deal.data"
+    v-if="doc.name"
     class="flex h-12 items-center justify-between gap-2 border-b px-3 py-2.5"
   >
-    <AssignTo
-      v-model="assignees.data"
-      :data="document.doc"
-      doctype="CRM Deal"
-    />
+    <AssignTo v-model="assignees.data" :data="doc" doctype="CRM Deal" />
     <div class="flex items-center gap-2">
       <CustomActions
-        v-if="deal.data._customActions?.length"
-        :actions="deal.data._customActions"
+        v-if="document._actions?.length"
+        :actions="document._actions"
       />
       <CustomActions
         v-if="document.actions?.length"
@@ -60,14 +54,14 @@
       />
     </div>
   </div>
-  <div v-if="deal.data" class="flex h-full overflow-hidden">
+  <div v-if="doc.name" class="flex h-full overflow-hidden">
     <Tabs as="div" v-model="tabIndex" :tabs="tabs" class="overflow-auto">
       <TabList class="!px-3" />
       <TabPanel v-slot="{ tab }">
         <div v-if="tab.name == 'Details'">
           <SLASection
-            v-if="deal.data.sla_status"
-            v-model="deal.data"
+            v-if="doc.sla_status"
+            v-model="doc"
             @updateField="updateField"
           />
           <div
@@ -77,7 +71,7 @@
             <SidePanelLayout
               :sections="sections.data"
               doctype="CRM Deal"
-              :docname="deal.data.name"
+              :docname="dealId"
               @reload="sections.reload"
               @beforeFieldChange="beforeStatusChange"
               @afterFieldChange="reloadAssignees"
@@ -92,7 +86,7 @@
                       (value, close) => {
                         _contact = {
                           first_name: value,
-                          company_name: deal.data.organization,
+                          company_name: doc.organization,
                         }
                         showContactModal = true
                         close()
@@ -220,23 +214,28 @@
         <Activities
           v-else
           doctype="CRM Deal"
+          :docname="dealId"
           :tabs="tabs"
           v-model:reload="reload"
           v-model:tabIndex="tabIndex"
-          v-model="deal"
           @beforeSave="beforeStatusChange"
           @afterSave="reloadAssignees"
         />
       </TabPanel>
     </Tabs>
   </div>
+  <ErrorPage
+    v-else-if="errorTitle"
+    :errorTitle="errorTitle"
+    :errorMessage="errorMessage"
+  />
   <OrganizationModal
     v-if="showOrganizationModal"
     v-model="showOrganizationModal"
     :data="_organization"
     :options="{
       redirect: false,
-      afterInsert: (doc) => updateField('organization', doc.name),
+      afterInsert: (_doc) => updateField('organization', _doc.name),
     }"
   />
   <ContactModal
@@ -245,9 +244,16 @@
     :contact="_contact"
     :options="{
       redirect: false,
-      afterInsert: (doc) => addContact(doc.name),
+      afterInsert: (_doc) => addContact(_doc.name),
     }"
   />
+  <DeleteLinkedDocModal
+    v-if="showDeleteLinkedDocModal"
+    v-model="showDeleteLinkedDocModal"
+    :doctype="'CRM Deal'"
+    :docname="dealId"
+    name="Deals"
+  />
   <LostReasonModal
     v-if="showLostReasonModal"
     v-model="showLostReasonModal"
@@ -255,6 +261,8 @@
   />
 </template>
 <script setup>
+import DeleteLinkedDocModal from '@/components/DeleteLinkedDocModal.vue'
+import ErrorPage from '@/components/ErrorPage.vue'
 import Icon from '@/components/Icon.vue'
 import DetailsIcon from '@/components/Icons/DetailsIcon.vue'
 import LoadingIndicator from '@/components/Icons/LoadingIndicator.vue'
@@ -306,7 +314,7 @@ import {
   usePageMeta,
   toast,
 } from 'frappe-ui'
-import { ref, computed, h, onMounted } from 'vue'
+import { ref, computed, h, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 
 const { brand } = getSettings()
@@ -323,86 +331,57 @@ const props = defineProps({
   },
 })
 
-const deal = createResource({
-  url: 'crm.fcrm.doctype.crm_deal.api.get_deal',
-  params: { name: props.dealId },
-  cache: ['deal', props.dealId],
-  onSuccess: (data) => {
-    if (data.organization) {
-      organization.update({
-        params: { doctype: 'CRM Organization', name: data.organization },
+const errorTitle = ref('')
+const errorMessage = ref('')
+const showDeleteLinkedDocModal = ref(false)
+
+const { triggerOnChange, assignees, document, scripts, error } = useDocument(
+  'CRM Deal',
+  props.dealId,
+)
+
+const doc = computed(() => document.doc || {})
+
+watch(error, (err) => {
+  if (err) {
+    errorTitle.value = __(
+      err.exc_type == 'DoesNotExistError'
+        ? 'Document not found'
+        : 'Error occurred',
+    )
+    errorMessage.value = __(err.messages?.[0] || 'An error occurred')
+  } else {
+    errorTitle.value = ''
+    errorMessage.value = ''
+  }
+})
+
+watch(
+  () => document.doc,
+  async (_doc) => {
+    if (scripts.data?.length) {
+      let s = await setupCustomizations(scripts.data, {
+        doc: _doc,
+        $dialog,
+        $socket,
+        router,
+        toast,
+        updateField,
+        createToast: toast.create,
+        deleteDoc: deleteDeal,
+        call,
       })
-      organization.fetch()
+      document._actions = s.actions || []
+      document._statuses = s.statuses || []
     }
-
-    setupCustomizations(deal, {
-      doc: data,
-      $dialog,
-      $socket,
-      router,
-      toast,
-      updateField,
-      createToast: toast.create,
-      deleteDoc: deleteDeal,
-      resource: {
-        deal,
-        dealContacts,
-        sections,
-      },
-      call,
-    })
   },
-})
-
-const organization = createResource({
-  url: 'frappe.client.get',
-  onSuccess: (data) => (deal.data._organizationObj = data),
-})
-
-onMounted(() => {
-  if (deal.data) return
-  deal.fetch()
-})
+  { once: true },
+)
 
 const reload = ref(false)
 const showOrganizationModal = ref(false)
 const _organization = ref({})
 
-function updateDeal(fieldname, value, callback) {
-  value = Array.isArray(fieldname) ? '' : value
-
-  if (validateRequired(fieldname, value)) return
-
-  createResource({
-    url: 'frappe.client.set_value',
-    params: {
-      doctype: 'CRM Deal',
-      name: props.dealId,
-      fieldname,
-      value,
-    },
-    auto: true,
-    onSuccess: () => {
-      deal.reload()
-      reload.value = true
-      toast.success(__('Deal updated'))
-      callback?.()
-    },
-    onError: (err) => {
-      toast.error(err.messages?.[0] || __('Error updating deal'))
-    },
-  })
-}
-
-function validateRequired(fieldname, value) {
-  let meta = deal.data.fields_meta || {}
-  if (meta[fieldname]?.reqd && !value) {
-    toast.error(__('{0} is a required field', [meta[fieldname].label]))
-    return true
-  }
-  return false
-}
-
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Deals'), route: { name: 'Deals' } }]
 
@@ -423,14 +402,14 @@ const breadcrumbs = computed(() => {
 
   items.push({
     label: title.value,
-    route: { name: 'Deal', params: { dealId: deal.data.name } },
+    route: { name: 'Deal', params: { dealId: props.dealId } },
   })
   return items
 })
 
 const title = computed(() => {
   let t = doctypeMeta['CRM Deal']?.title_field || 'name'
-  return deal.data?.[t] || props.dealId
+  return doc.value?.[t] || props.dealId
 })
 
 usePageMeta(() => {
@@ -614,26 +593,33 @@ const dealContacts = createResource({
   },
 })
 
-function updateField(name, value, callback) {
-  updateDeal(name, value, () => {
-    deal.data[name] = value
-    callback?.()
+function updateField(name, value) {
+  value = Array.isArray(name) ? '' : value
+  let oldValues = Array.isArray(name) ? {} : doc.value[name]
+
+  if (Array.isArray(name)) {
+    name.forEach((field) => (doc.value[field] = value))
+  } else {
+    doc.value[name] = value
+  }
+
+  document.save.submit(null, {
+    onSuccess: () => (reload.value = true),
+    onError: (err) => {
+      if (Array.isArray(name)) {
+        name.forEach((field) => (doc.value[field] = oldValues[field]))
+      } else {
+        doc.value[name] = oldValues
+      }
+      toast.error(err.messages?.[0] || __('Error updating field'))
+    },
   })
 }
 
-async function deleteDeal(name) {
-  await call('frappe.client.delete', {
-    doctype: 'CRM Deal',
-    name,
-  })
-  router.push({ name: 'Deals' })
+function deleteDeal() {
+  showDeleteLinkedDocModal.value = true
 }
 
-const { assignees, document, triggerOnChange } = useDocument(
-  'CRM Deal',
-  props.dealId,
-)
-
 async function triggerStatusChange(value) {
   await triggerOnChange('status', value)
   setLostReason()
@@ -643,9 +629,9 @@ const showLostReasonModal = ref(false)
 
 function setLostReason() {
   if (
-    getDealStatus(document.doc.status).type !== 'Lost' ||
-    (document.doc.lost_reason && document.doc.lost_reason !== 'Other') ||
-    (document.doc.lost_reason === 'Other' && document.doc.lost_notes)
+    getDealStatus(doc.status).type !== 'Lost' ||
+    (doc.lost_reason && doc.lost_reason !== 'Other') ||
+    (doc.lost_reason === 'Other' && doc.lost_notes)
   ) {
     document.save.submit()
     return
@@ -655,7 +641,10 @@ function setLostReason() {
 }
 
 function beforeStatusChange(data) {
-  if (data?.hasOwnProperty('status') && getDealStatus(data.status).type == 'Lost') {
+  if (
+    data?.hasOwnProperty('status') &&
+    getDealStatus(data.status).type == 'Lost'
+  ) {
     setLostReason()
   } else {
     document.save.submit(null, {
diff --git a/frontend/src/pages/MobileLead.vue b/frontend/src/pages/MobileLead.vue
index f732c9c5..26669ad0 100644
--- a/frontend/src/pages/MobileLead.vue
+++ b/frontend/src/pages/MobileLead.vue
@@ -1,5 +1,5 @@
 <template>
-  <LayoutHeader v-if="lead.data">
+  <LayoutHeader>
     <header
       class="relative flex h-10.5 items-center justify-between gap-2 py-2.5 pl-2"
     >
@@ -10,23 +10,21 @@
       </Breadcrumbs>
       <div class="absolute right-0">
         <Dropdown
-          v-if="document.doc"
+          v-if="doc"
           :options="
             statusOptions(
               'lead',
               document.statuses?.length
                 ? document.statuses
-                : lead.data._customStatuses,
+                : document._statuses,
               triggerStatusChange,
             )
           "
         >
           <template #default="{ open }">
-            <Button :label="document.doc.status">
+            <Button v-if="doc.status" :label="doc.status">
               <template #prefix>
-                <IndicatorIcon
-                  :class="getLeadStatus(document.doc.status).color"
-                />
+                <IndicatorIcon :class="getLeadStatus(doc.status).color" />
               </template>
               <template #suffix>
                 <FeatherIcon
@@ -41,18 +39,14 @@
     </header>
   </LayoutHeader>
   <div
-    v-if="lead.data"
+    v-if="doc.name"
     class="flex h-12 items-center justify-between gap-2 border-b px-3 py-2.5"
   >
-    <AssignTo
-      v-model="assignees.data"
-      :data="document.doc"
-      doctype="CRM Lead"
-    />
+    <AssignTo v-model="assignees.data" :data="doc" doctype="CRM Lead" />
     <div class="flex items-center gap-2">
       <CustomActions
-        v-if="lead.data._customActions?.length"
-        :actions="lead.data._customActions"
+        v-if="document._actions?.length"
+        :actions="document._actions"
       />
       <CustomActions
         v-if="document.actions?.length"
@@ -65,14 +59,14 @@
       />
     </div>
   </div>
-  <div v-if="lead?.data" class="flex h-full overflow-hidden">
+  <div v-if="doc.name" class="flex h-full overflow-hidden">
     <Tabs as="div" v-model="tabIndex" :tabs="tabs" class="overflow-auto">
       <TabList class="!px-3" />
       <TabPanel v-slot="{ tab }">
         <div v-if="tab.name == 'Details'">
           <SLASection
-            v-if="lead.data.sla_status"
-            v-model="lead.data"
+            v-if="doc.sla_status"
+            v-model="doc"
             @updateField="updateField"
           />
           <div
@@ -82,7 +76,7 @@
             <SidePanelLayout
               :sections="sections.data"
               doctype="CRM Lead"
-              :docname="lead.data.name"
+              :docname="leadId"
               @reload="sections.reload"
               @afterFieldChange="reloadAssignees"
             />
@@ -91,16 +85,21 @@
         <Activities
           v-else
           doctype="CRM Lead"
+          :docname="leadId"
           :tabs="tabs"
           v-model:reload="reload"
           v-model:tabIndex="tabIndex"
-          v-model="lead"
           @beforeSave="saveChanges"
           @afterSave="reloadAssignees"
         />
       </TabPanel>
     </Tabs>
   </div>
+  <ErrorPage
+    v-else-if="errorTitle"
+    :errorTitle="errorTitle"
+    :errorMessage="errorMessage"
+  />
   <Dialog
     v-model="showConvertToDealModal"
     :options="{
@@ -167,8 +166,17 @@
       </div>
     </template>
   </Dialog>
+  <DeleteLinkedDocModal
+    v-if="showDeleteLinkedDocModal"
+    v-model="showDeleteLinkedDocModal"
+    :doctype="'CRM Lead'"
+    :docname="leadId"
+    name="Leads"
+  />
 </template>
 <script setup>
+import DeleteLinkedDocModal from '@/components/DeleteLinkedDocModal.vue'
+import ErrorPage from '@/components/ErrorPage.vue'
 import Icon from '@/components/Icon.vue'
 import DetailsIcon from '@/components/Icons/DetailsIcon.vue'
 import ActivityIcon from '@/components/Icons/ActivityIcon.vue'
@@ -215,7 +223,7 @@ import {
   usePageMeta,
   toast,
 } from 'frappe-ui'
-import { ref, computed, onMounted, watch } from 'vue'
+import { ref, computed, watch } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 
 const { brand } = getSettings()
@@ -232,71 +240,55 @@ const props = defineProps({
   },
 })
 
-const lead = createResource({
-  url: 'crm.fcrm.doctype.crm_lead.api.get_lead',
-  params: { name: props.leadId },
-  cache: ['lead', props.leadId],
-  onSuccess: (data) => {
-    setupCustomizations(lead, {
-      doc: data,
-      $dialog,
-      $socket,
-      router,
-      toast,
-      updateField,
-      createToast: toast.create,
-      deleteDoc: deleteLead,
-      resource: {
-        lead,
-        sections,
-      },
-      call,
-    })
-  },
+const errorTitle = ref('')
+const errorMessage = ref('')
+const showDeleteLinkedDocModal = ref(false)
+
+const { triggerOnChange, assignees, document, scripts, error } = useDocument(
+  'CRM Lead',
+  props.leadId,
+)
+
+const doc = computed(() => document.doc || {})
+
+watch(error, (err) => {
+  if (err) {
+    errorTitle.value = __(
+      err.exc_type == 'DoesNotExistError'
+        ? 'Document not found'
+        : 'Error occurred',
+    )
+    errorMessage.value = __(err.messages?.[0] || 'An error occurred')
+  } else {
+    errorTitle.value = ''
+    errorMessage.value = ''
+  }
 })
 
-onMounted(() => {
-  if (lead.data) return
-  lead.fetch()
-})
+watch(
+  () => document.doc,
+  async (_doc) => {
+    if (scripts.data?.length) {
+      let s = await setupCustomizations(scripts.data, {
+        doc: _doc,
+        $dialog,
+        $socket,
+        router,
+        toast,
+        updateField,
+        createToast: toast.create,
+        deleteDoc: deleteLead,
+        call,
+      })
+      document._actions = s.actions || []
+      document._statuses = s.statuses || []
+    }
+  },
+  { once: true },
+)
 
 const reload = ref(false)
 
-function updateLead(fieldname, value, callback) {
-  value = Array.isArray(fieldname) ? '' : value
-
-  if (!Array.isArray(fieldname) && validateRequired(fieldname, value)) return
-
-  createResource({
-    url: 'frappe.client.set_value',
-    params: {
-      doctype: 'CRM Lead',
-      name: props.leadId,
-      fieldname,
-      value,
-    },
-    auto: true,
-    onSuccess: () => {
-      lead.reload()
-      reload.value = true
-      toast.success(__('Lead updated successfully'))
-      callback?.()
-    },
-    onError: (err) => {
-      toast.error(__(err.messages?.[0] || 'Error updating lead'))
-    },
-  })
-}
-
-function validateRequired(fieldname, value) {
-  let meta = lead.data.fields_meta || {}
-  if (meta[fieldname]?.reqd && !value) {
-    toast.error(__('{0} is a required field', [meta[fieldname].label]))
-    return true
-  }
-  return false
-}
-
 const breadcrumbs = computed(() => {
   let items = [{ label: __('Leads'), route: { name: 'Leads' } }]
 
@@ -317,14 +309,14 @@ const breadcrumbs = computed(() => {
 
   items.push({
     label: title.value,
-    route: { name: 'Lead', params: { leadId: lead.data.name } },
+    route: { name: 'Lead', params: { leadId: props.leadId } },
   })
   return items
 })
 
 const title = computed(() => {
   let t = doctypeMeta['CRM Lead']?.title_field || 'name'
-  return lead.data?.[t] || props.leadId
+  return doc.value?.[t] || props.leadId
 })
 
 usePageMeta(() => {
@@ -392,18 +384,8 @@ const tabs = computed(() => {
   ]
   return tabOptions.filter((tab) => (tab.condition ? tab.condition() : true))
 })
-const { tabIndex } = useActiveTabManager(tabs, 'lastLeadTab')
 
-watch(tabs, (value) => {
-  if (value && route.params.tabName) {
-    let index = value.findIndex(
-      (tab) => tab.name.toLowerCase() === route.params.tabName.toLowerCase(),
-    )
-    if (index !== -1) {
-      tabIndex.value = index
-    }
-  }
-})
+const { tabIndex } = useActiveTabManager(tabs, 'lastLeadTab')
 
 const sections = createResource({
   url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_sidepanel_sections',
@@ -412,19 +394,31 @@ const sections = createResource({
   auto: true,
 })
 
-function updateField(name, value, callback) {
-  updateLead(name, value, () => {
-    lead.data[name] = value
-    callback?.()
+function updateField(name, value) {
+  value = Array.isArray(name) ? '' : value
+  let oldValues = Array.isArray(name) ? {} : doc.value[name]
+
+  if (Array.isArray(name)) {
+    name.forEach((field) => (doc.value[field] = value))
+  } else {
+    doc.value[name] = value
+  }
+
+  document.save.submit(null, {
+    onSuccess: () => (reload.value = true),
+    onError: (err) => {
+      if (Array.isArray(name)) {
+        name.forEach((field) => (doc.value[field] = oldValues[field]))
+      } else {
+        doc.value[name] = oldValues
+      }
+      toast.error(err.messages?.[0] || __('Error updating field'))
+    },
   })
 }
 
-async function deleteLead(name) {
-  await call('frappe.client.delete', {
-    doctype: 'CRM Lead',
-    name,
-  })
-  router.push({ name: 'Leads' })
+function deleteLead() {
+  showDeleteLinkedDocModal.value = true
 }
 
 // Convert to Deal
@@ -455,7 +449,7 @@ async function convertToDeal() {
   }
 
   let deal = await call('crm.fcrm.doctype.crm_lead.crm_lead.convert_to_deal', {
-    lead: lead.data.name,
+    lead: props.leadId,
     deal: {},
     existing_contact: existingContact.value,
     existing_organization: existingOrganization.value,
@@ -471,11 +465,6 @@ async function convertToDeal() {
   }
 }
 
-const { assignees, document, triggerOnChange } = useDocument(
-  'CRM Lead',
-  props.leadId,
-)
-
 async function triggerStatusChange(value) {
   await triggerOnChange('status', value)
   document.save.submit()
diff --git a/frontend/src/utils/index.js b/frontend/src/utils/index.js
index 61affc37..50c9fb79 100644
--- a/frontend/src/utils/index.js
+++ b/frontend/src/utils/index.js
@@ -278,25 +278,18 @@ async function getFormScript(script, obj) {
   return formScript || {}
 }
 
-export async function setupCustomizations(doc, obj) {
-  if (!doc.data?._form_script) return []
+export async function setupCustomizations(scripts, obj) {
+  if (!scripts) return []
 
   let statuses = []
   let actions = []
-  if (Array.isArray(doc.data._form_script)) {
-    for (let script of doc.data._form_script) {
-      let _script = await getFormScript(script, obj)
+  if (Array.isArray(scripts)) {
+    for (let s of scripts) {
+      let _script = await getFormScript(s.script, obj)
       actions = actions.concat(_script?.actions || [])
       statuses = statuses.concat(_script?.statuses || [])
     }
-  } else {
-    let _script = await getFormScript(doc.data._form_script, obj)
-    actions = _script?.actions || []
-    statuses = _script?.statuses || []
   }
-
-  doc.data._customStatuses = statuses
-  doc.data._customActions = actions
   return { statuses, actions }
 }