From c328d1cd102d896b1e581dc2693b9e60727f1fd0 Mon Sep 17 00:00:00 2001
From: Darko Gjorgjijoski <dg@darkog.com>
Date: Mon, 6 Apr 2026 22:56:57 +0200
Subject: [PATCH] Mount send modals on index views and dashboard, pass missing
 props

SendInvoiceModal and SendEstimateModal were only mounted on detail
views. Resend from table dropdowns did nothing because the modal
component was not in the DOM. Added to index views and dashboard.

Pass canCreatePayment and canCreateEstimate props to InvoiceDropdown
from detail view and dashboard.
---
 .../company/dashboard/components/DashboardTable.vue       | 1 +
 .../features/company/dashboard/views/DashboardView.vue    | 5 +++++
 .../company/estimates/views/EstimateIndexView.vue         | 3 +++
 .../features/company/invoices/views/InvoiceDetailView.vue | 6 ++++++
 .../features/company/invoices/views/InvoiceIndexView.vue  | 8 ++++++++
 5 files changed, 23 insertions(+)

diff --git a/resources/scripts-v2/features/company/dashboard/components/DashboardTable.vue b/resources/scripts-v2/features/company/dashboard/components/DashboardTable.vue
index 5e55ed84..1bf12493 100644
--- a/resources/scripts-v2/features/company/dashboard/components/DashboardTable.vue
+++ b/resources/scripts-v2/features/company/dashboard/components/DashboardTable.vue
@@ -168,6 +168,7 @@ const canCreateInvoiceFromEstimate = computed(() => userStore.hasAbilities(ABILI
               :can-delete="canDeleteInvoice"
               :can-send="canSendInvoice"
               :can-create-payment="canCreatePayment"
+              :can-create-estimate="canCreateEstimate"
             />
           </template>
         </BaseTable>
diff --git a/resources/scripts-v2/features/company/dashboard/views/DashboardView.vue b/resources/scripts-v2/features/company/dashboard/views/DashboardView.vue
index 8d087e1d..7f1cc6d9 100644
--- a/resources/scripts-v2/features/company/dashboard/views/DashboardView.vue
+++ b/resources/scripts-v2/features/company/dashboard/views/DashboardView.vue
@@ -5,6 +5,8 @@ import { useUserStore } from '../../../../stores/user.store'
 import DashboardStats from '../components/DashboardStats.vue'
 import DashboardChart from '../components/DashboardChart.vue'
 import DashboardTable from '../components/DashboardTable.vue'
+import SendInvoiceModal from '@v2/features/company/invoices/components/SendInvoiceModal.vue'
+import SendEstimateModal from '@v2/features/company/estimates/components/SendEstimateModal.vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -27,4 +29,7 @@ onMounted(() => {
     <DashboardChart />
     <DashboardTable />
   </BasePage>
+
+  <SendInvoiceModal />
+  <SendEstimateModal />
 </template>
diff --git a/resources/scripts-v2/features/company/estimates/views/EstimateIndexView.vue b/resources/scripts-v2/features/company/estimates/views/EstimateIndexView.vue
index 86ccd2ba..c2d5eea6 100644
--- a/resources/scripts-v2/features/company/estimates/views/EstimateIndexView.vue
+++ b/resources/scripts-v2/features/company/estimates/views/EstimateIndexView.vue
@@ -220,6 +220,8 @@
       </BaseTable>
     </div>
   </BasePage>
+
+  <SendEstimateModal />
 </template>
 
 <script setup lang="ts">
@@ -228,6 +230,7 @@ import { useI18n } from 'vue-i18n'
 import { debouncedWatch } from '@vueuse/core'
 import { useEstimateStore } from '../store'
 import EstimateDropdown from '../components/EstimateDropdown.vue'
+import SendEstimateModal from '../components/SendEstimateModal.vue'
 import { useUserStore } from '../../../../stores/user.store'
 import { useDialogStore } from '../../../../stores/dialog.store'
 import type { Estimate } from '../../../../types/domain/estimate'
diff --git a/resources/scripts-v2/features/company/invoices/views/InvoiceDetailView.vue b/resources/scripts-v2/features/company/invoices/views/InvoiceDetailView.vue
index cc1b5b88..917dc89c 100644
--- a/resources/scripts-v2/features/company/invoices/views/InvoiceDetailView.vue
+++ b/resources/scripts-v2/features/company/invoices/views/InvoiceDetailView.vue
@@ -45,6 +45,8 @@
           :can-create="canCreate"
           :can-delete="canDelete"
           :can-send="canSend"
+          :can-create-payment="canCreatePayment"
+          :can-create-estimate="canCreateEstimate"
         />
       </template>
     </BasePageHeader>
@@ -276,6 +278,10 @@ const canCreatePayment = computed<boolean>(() => {
   )
 })
 
+const canCreateEstimate = computed<boolean>(() => {
+  return userStore.hasAbilities('create-estimate')
+})
+
 const invoiceData = ref<Invoice | null>(null)
 const isMarkAsSent = ref<boolean>(false)
 const isLoading = ref<boolean>(false)
diff --git a/resources/scripts-v2/features/company/invoices/views/InvoiceIndexView.vue b/resources/scripts-v2/features/company/invoices/views/InvoiceIndexView.vue
index 29701567..5405df6b 100644
--- a/resources/scripts-v2/features/company/invoices/views/InvoiceIndexView.vue
+++ b/resources/scripts-v2/features/company/invoices/views/InvoiceIndexView.vue
@@ -329,6 +329,7 @@
               :can-delete="canDelete"
               :can-send="canSend"
               :can-create-payment="canCreatePayment"
+              :can-create-estimate="canCreateEstimate"
             />
           </template>
         </BaseTable>
@@ -469,6 +470,8 @@
       </div>
     </template>
   </BasePage>
+
+  <SendInvoiceModal />
 </template>
 
 <script setup lang="ts">
@@ -479,6 +482,7 @@ import { debouncedWatch } from '@vueuse/core'
 import { useInvoiceStore } from '../store'
 import { useRecurringInvoiceStore } from '../../recurring-invoices/store'
 import InvoiceDropdown from '../components/InvoiceDropdown.vue'
+import SendInvoiceModal from '../components/SendInvoiceModal.vue'
 import RecurringInvoiceDropdown from '../../recurring-invoices/components/RecurringInvoiceDropdown.vue'
 import { useUserStore } from '../../../../stores/user.store'
 import { useDialogStore } from '../../../../stores/dialog.store'
@@ -649,6 +653,10 @@ const canCreatePayment = computed<boolean>(() => {
   return userStore.hasAbilities('create-payment')
 })
 
+const canCreateEstimate = computed<boolean>(() => {
+  return userStore.hasAbilities('create-estimate')
+})
+
 const hasAtLeastOneAbility = computed<boolean>(() => {
   return canDelete.value || canEdit.value || canView.value || canSend.value
 })