Add confirmation dialog for pipeline cancellation

(cherry picked from commit 81e3496aa4)
This commit is contained in:
yangdx 2025-10-25 03:55:00 +08:00 committed by Raphaël MANSUY
parent 74d0a22020
commit 46c13e23f0
6 changed files with 49 additions and 3 deletions

View file

@ -30,6 +30,7 @@ export default function PipelineStatusDialog({
const [status, setStatus] = useState<PipelineStatusResponse | null>(null) const [status, setStatus] = useState<PipelineStatusResponse | null>(null)
const [position, setPosition] = useState<DialogPosition>('center') const [position, setPosition] = useState<DialogPosition>('center')
const [isUserScrolled, setIsUserScrolled] = useState(false) const [isUserScrolled, setIsUserScrolled] = useState(false)
const [showCancelConfirm, setShowCancelConfirm] = useState(false)
const historyRef = useRef<HTMLDivElement>(null) const historyRef = useRef<HTMLDivElement>(null)
// Reset position when dialog opens // Reset position when dialog opens
@ -37,6 +38,9 @@ export default function PipelineStatusDialog({
if (open) { if (open) {
setPosition('center') setPosition('center')
setIsUserScrolled(false) setIsUserScrolled(false)
} else {
// Reset confirmation dialog state when main dialog closes
setShowCancelConfirm(false)
} }
}, [open]) }, [open])
@ -81,8 +85,9 @@ export default function PipelineStatusDialog({
return () => clearInterval(interval) return () => clearInterval(interval)
}, [open, t]) }, [open, t])
// Handle cancel pipeline // Handle cancel pipeline confirmation
const handleCancelPipeline = async () => { const handleConfirmCancel = async () => {
setShowCancelConfirm(false)
try { try {
const result = await cancelPipeline() const result = await cancelPipeline()
if (result.status === 'cancellation_requested') { if (result.status === 'cancellation_requested') {
@ -186,7 +191,7 @@ export default function PipelineStatusDialog({
variant="destructive" variant="destructive"
size="sm" size="sm"
disabled={!canCancel} disabled={!canCancel}
onClick={handleCancelPipeline} onClick={() => setShowCancelConfirm(true)}
title={ title={
status?.cancellation_requested status?.cancellation_requested
? t('documentPanel.pipelineStatus.cancelInProgress') ? t('documentPanel.pipelineStatus.cancelInProgress')
@ -233,6 +238,32 @@ export default function PipelineStatusDialog({
</div> </div>
</div> </div>
</DialogContent> </DialogContent>
{/* Cancel Confirmation Dialog */}
<Dialog open={showCancelConfirm} onOpenChange={setShowCancelConfirm}>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>{t('documentPanel.pipelineStatus.cancelConfirmTitle')}</DialogTitle>
<DialogDescription>
{t('documentPanel.pipelineStatus.cancelConfirmDescription')}
</DialogDescription>
</DialogHeader>
<div className="flex justify-end gap-3 mt-4">
<Button
variant="outline"
onClick={() => setShowCancelConfirm(false)}
>
{t('common.cancel')}
</Button>
<Button
variant="destructive"
onClick={handleConfirmCancel}
>
{t('documentPanel.pipelineStatus.cancelConfirmButton')}
</Button>
</div>
</DialogContent>
</Dialog>
</Dialog> </Dialog>
) )
} }

View file

@ -169,6 +169,9 @@
"historyMessages": "رسائل السجل", "historyMessages": "رسائل السجل",
"cancelButton": "إلغاء", "cancelButton": "إلغاء",
"cancelTooltip": "إلغاء معالجة خط الأنابيب", "cancelTooltip": "إلغاء معالجة خط الأنابيب",
"cancelConfirmTitle": "تأكيد إلغاء خط الأنابيب",
"cancelConfirmDescription": "سيؤدي هذا الإجراء إلى إيقاف معالجة خط الأنابيب الجارية. هل أنت متأكد من أنك تريد المتابعة؟",
"cancelConfirmButton": "تأكيد الإلغاء",
"cancelInProgress": "الإلغاء قيد التقدم...", "cancelInProgress": "الإلغاء قيد التقدم...",
"pipelineNotRunning": "خط الأنابيب غير قيد التشغيل", "pipelineNotRunning": "خط الأنابيب غير قيد التشغيل",
"cancelSuccess": "تم طلب إلغاء خط الأنابيب", "cancelSuccess": "تم طلب إلغاء خط الأنابيب",

View file

@ -169,6 +169,9 @@
"historyMessages": "History Messages", "historyMessages": "History Messages",
"cancelButton": "Cancel", "cancelButton": "Cancel",
"cancelTooltip": "Cancel pipeline processing", "cancelTooltip": "Cancel pipeline processing",
"cancelConfirmTitle": "Confirm Pipeline Cancellation",
"cancelConfirmDescription": "This will interrupt the ongoing pipeline processing. Are you sure you want to continue?",
"cancelConfirmButton": "Confirm Cancellation",
"cancelInProgress": "Cancellation in progress...", "cancelInProgress": "Cancellation in progress...",
"pipelineNotRunning": "Pipeline not running", "pipelineNotRunning": "Pipeline not running",
"cancelSuccess": "Pipeline cancellation requested", "cancelSuccess": "Pipeline cancellation requested",

View file

@ -169,6 +169,9 @@
"historyMessages": "Messages d'Historique", "historyMessages": "Messages d'Historique",
"cancelButton": "Annuler", "cancelButton": "Annuler",
"cancelTooltip": "Annuler le traitement du pipeline", "cancelTooltip": "Annuler le traitement du pipeline",
"cancelConfirmTitle": "Confirmer l'Annulation du Pipeline",
"cancelConfirmDescription": "Cette action interrompra le traitement du pipeline en cours. Êtes-vous sûr de vouloir continuer ?",
"cancelConfirmButton": "Confirmer l'Annulation",
"cancelInProgress": "Annulation en cours...", "cancelInProgress": "Annulation en cours...",
"pipelineNotRunning": "Le pipeline n'est pas en cours d'exécution", "pipelineNotRunning": "Le pipeline n'est pas en cours d'exécution",
"cancelSuccess": "Annulation du pipeline demandée", "cancelSuccess": "Annulation du pipeline demandée",

View file

@ -169,6 +169,9 @@
"historyMessages": "历史消息", "historyMessages": "历史消息",
"cancelButton": "中断", "cancelButton": "中断",
"cancelTooltip": "中断流水线处理", "cancelTooltip": "中断流水线处理",
"cancelConfirmTitle": "确认中断流水线",
"cancelConfirmDescription": "此操作将中断正在进行的流水线处理。确定要继续吗?",
"cancelConfirmButton": "确认中断",
"cancelInProgress": "取消请求进行中...", "cancelInProgress": "取消请求进行中...",
"pipelineNotRunning": "流水线未运行", "pipelineNotRunning": "流水线未运行",
"cancelSuccess": "流水线中断请求已发送", "cancelSuccess": "流水线中断请求已发送",

View file

@ -169,6 +169,9 @@
"historyMessages": "歷史消息", "historyMessages": "歷史消息",
"cancelButton": "中斷", "cancelButton": "中斷",
"cancelTooltip": "中斷流水線處理", "cancelTooltip": "中斷流水線處理",
"cancelConfirmTitle": "確認中斷流水線",
"cancelConfirmDescription": "此操作將中斷正在進行的流水線處理。確定要繼續嗎?",
"cancelConfirmButton": "確認中斷",
"cancelInProgress": "取消請求進行中...", "cancelInProgress": "取消請求進行中...",
"pipelineNotRunning": "流水線未運行", "pipelineNotRunning": "流水線未運行",
"cancelSuccess": "流水線中斷請求已發送", "cancelSuccess": "流水線中斷請求已發送",