feat(ui): replace native confirm() with DaisyUI modal composable (F7.2)

Create useConfirm composable (promise-based, singleton state) and
ConfirmModal component. Replace all 10 confirm()/window.confirm() calls
across 9 pages and 1 composable.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Matthieu
2026-02-09 11:20:13 +01:00
parent 046f464378
commit 6152848957
11 changed files with 152 additions and 21 deletions

View File

@@ -0,0 +1,73 @@
/**
* Promise-based confirmation dialog composable.
*
* Usage:
* const { confirm, confirmState } = useConfirm()
* const ok = await confirm({ message: 'Supprimer ?' })
* if (ok) { ... }
*
* The ConfirmModal component reads `confirmState` to render the dialog.
*/
import { reactive } from 'vue'
export interface ConfirmOptions {
title?: string
message: string
confirmText?: string
cancelText?: string
dangerous?: boolean
}
export interface ConfirmState {
open: boolean
title: string
message: string
confirmText: string
cancelText: string
dangerous: boolean
resolve: ((value: boolean) => void) | null
}
const state = reactive<ConfirmState>({
open: false,
title: '',
message: '',
confirmText: 'Supprimer',
cancelText: 'Annuler',
dangerous: true,
resolve: null,
})
function confirm(options: ConfirmOptions): Promise<boolean> {
return new Promise((resolve) => {
state.title = options.title ?? 'Confirmation'
state.message = options.message
state.confirmText = options.confirmText ?? 'Supprimer'
state.cancelText = options.cancelText ?? 'Annuler'
state.dangerous = options.dangerous ?? true
state.resolve = resolve
state.open = true
})
}
function handleConfirm() {
state.resolve?.(true)
state.open = false
state.resolve = null
}
function handleCancel() {
state.resolve?.(false)
state.open = false
state.resolve = null
}
export function useConfirm() {
return {
confirm,
confirmState: state,
handleConfirm,
handleCancel,
}
}

View File

@@ -3,6 +3,7 @@ import { navigateTo, useRoute } from '#imports'
import { useSites } from '~/composables/useSites'
import { useToast } from '~/composables/useToast'
import { useDocuments } from '~/composables/useDocuments'
import { useConfirm } from '~/composables/useConfirm'
import { getFileIcon } from '~/utils/fileIcons'
import { canPreviewDocument } from '~/utils/documentPreview'
@@ -41,6 +42,7 @@ export function useSiteManagement() {
const { showError, showSuccess } = useToast()
const { sites, loading, loadSites, createSite, updateSite, deleteSite } = useSites()
const { uploadDocuments, deleteDocument, loadDocumentsBySite } = useDocuments()
const { confirm: confirmDialog } = useConfirm()
const showAddSiteModal = ref(false)
const showEditSiteModal = ref(false)
@@ -132,7 +134,8 @@ export function useSiteManagement() {
if (index !== -1) {
sites.value[index] = {
...sites.value[index],
...updated
...updated,
id,
}
}
}
@@ -251,9 +254,9 @@ export function useSiteManagement() {
const confirmDeleteSite = async (site: SiteWithDocuments) => {
if (
!confirm(
`Êtes-vous sûr de vouloir supprimer le site "${site.name}" ? Cette action est irréversible.`
)
!await confirmDialog({
message: `Êtes-vous sûr de vouloir supprimer le site "${site.name}" ? Cette action est irréversible.`,
})
) {
return
}