| @@ -3,9 +3,9 @@ | ||
| 3 | 3 | * Modular table component for displaying trips |
| 4 | 4 | * Supports extensibility for Pro features |
| 5 | 5 | */ |
| 6 | 6 | |
| 7 | -import React from "react"; | |
| 7 | +import React, { useState } from "react"; | |
| 8 | 8 | import { __ } from "../../lib/i18n"; |
| 9 | 9 | import { formatYatraMoney } from "../../lib/currency-display"; |
| 10 | 10 | import { ConditionalRender } from "../ui/conditional-render"; |
| 11 | 11 | import { |
| @@ -18,8 +18,9 @@ | ||
| 18 | 18 | } from "../ui/table"; |
| 19 | 19 | import { Button } from "../ui/button"; |
| 20 | 20 | import { Badge } from "../ui/badge"; |
| 21 | 21 | import { Edit, Trash2, Eye } from "lucide-react"; |
| 22 | +import { ConfirmationDialog } from "../ui/confirmation-dialog"; | |
| 22 | 23 | |
| 23 | 24 | interface Trip { |
| 24 | 25 | id: number; |
| 25 | 26 | title: string; |
| @@ -51,8 +52,12 @@ | ||
| 51 | 52 | onDelete, |
| 52 | 53 | onView, |
| 53 | 54 | showProFeatures = false, |
| 54 | 55 | }) => { |
| 56 | + // Uses the shared ConfirmationDialog like the rest of the admin, instead of | |
| 57 | + // the browser's native confirm() which ignores the admin theme. | |
| 58 | + const [tripToDelete, setTripToDelete] = useState<any | null>(null); | |
| 59 | + | |
| 55 | 60 | const formatDate = (dateString: string) => { |
| 56 | 61 | return new Date(dateString).toLocaleDateString(); |
| 57 | 62 | }; |
| 58 | 63 | |
| @@ -180,20 +185,9 @@ | ||
| 180 | 185 | {onDelete && ( |
| 181 | 186 | <Button |
| 182 | 187 | variant="ghost" |
| 183 | 188 | size="sm" |
| 184 | - onClick={() => { | |
| 185 | - if ( | |
| 186 | - confirm( | |
| 187 | - __( | |
| 188 | - "Are you sure you want to delete this trip?", | |
| 189 | - "yatra", | |
| 190 | - ), | |
| 191 | - ) | |
| 192 | - ) { | |
| 193 | - onDelete(trip); | |
| 194 | - } | |
| 195 | - }} | |
| 189 | + onClick={() => setTripToDelete(trip)} | |
| 196 | 190 | aria-label={__("Delete trip", "yatra")} |
| 197 | 191 | > |
| 198 | 192 | <Trash2 className="w-4 h-4 text-red-500" /> |
| 199 | 193 | </Button> |
| @@ -204,8 +198,27 @@ | ||
| 204 | 198 | </TableRow> |
| 205 | 199 | ))} |
| 206 | 200 | </TableBody> |
| 207 | 201 | </Table> |
| 202 | + | |
| 203 | + <ConfirmationDialog | |
| 204 | + isOpen={tripToDelete !== null} | |
| 205 | + onClose={() => setTripToDelete(null)} | |
| 206 | + onConfirm={() => { | |
| 207 | + if (tripToDelete && onDelete) { | |
| 208 | + onDelete(tripToDelete); | |
| 209 | + } | |
| 210 | + setTripToDelete(null); | |
| 211 | + }} | |
| 212 | + title={__("Delete Trip", "yatra")} | |
| 213 | + message={__( | |
| 214 | + "Are you sure you want to delete this trip? This action cannot be undone.", | |
| 215 | + "yatra", | |
| 216 | + )} | |
| 217 | + confirmText={__("Delete", "yatra")} | |
| 218 | + cancelText={__("Cancel", "yatra")} | |
| 219 | + variant="danger" | |
| 220 | + /> | |
| 208 | 221 | </div> |
| 209 | 222 | ); |
| 210 | 223 | }; |
| 211 | 224 | |
