123 lines
4.0 KiB
TypeScript
123 lines
4.0 KiB
TypeScript
"use client"
|
||
|
||
import { useState } from "react"
|
||
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog"
|
||
import { Button } from "@/components/ui/button"
|
||
import { Shield, ShieldAlert, ShieldX } from "lucide-react"
|
||
|
||
interface User {
|
||
national_id: string
|
||
name: string
|
||
in_shelter?: string
|
||
last_updated?: string
|
||
}
|
||
|
||
interface ReportOnBehalfModalProps {
|
||
isOpen: boolean
|
||
onClose: () => void
|
||
user: User | null
|
||
onReport: (userId: string, status: string) => void
|
||
}
|
||
|
||
export function ReportOnBehalfModal({ isOpen, onClose, user, onReport }: ReportOnBehalfModalProps) {
|
||
const [loading, setLoading] = useState(false)
|
||
|
||
if (!user) return null
|
||
|
||
const handleReport = async (status: string) => {
|
||
setLoading(true)
|
||
try {
|
||
await onReport(user.national_id, status)
|
||
onClose()
|
||
} catch (error) {
|
||
console.error("Error reporting:", error)
|
||
} finally {
|
||
setLoading(false)
|
||
}
|
||
}
|
||
|
||
const getStatusText = (status?: string) => {
|
||
switch (status) {
|
||
case "yes":
|
||
return "במקלט/חדר מוגן"
|
||
case "no":
|
||
return "לא במקלט"
|
||
case "no_alarm":
|
||
return "אין אזעקה"
|
||
case "safe_after_exit":
|
||
return "אני בטוח.ה (סוף אירוע)"
|
||
default:
|
||
return "אין דיווח"
|
||
}
|
||
}
|
||
|
||
return (
|
||
<Dialog open={isOpen} onOpenChange={onClose}>
|
||
<DialogContent className="max-w-md" dir="rtl">
|
||
<DialogHeader className="text-center" dir="rtl">
|
||
<DialogTitle className="text-center" dir="rtl" >דיווח עבור {user.name}</DialogTitle>
|
||
<DialogDescription className="text-center" dir="rtl">בחר סטטוס לדיווח עבור המשתמש</DialogDescription>
|
||
</DialogHeader>
|
||
|
||
<div className="space-y-4 text-center" dir="rtl">
|
||
{user.in_shelter && (
|
||
<div className="bg-blue-50 p-3 rounded">
|
||
<p className="text-sm text-gray-600">סטטוס נוכחי:</p>
|
||
<p className="font-semibold text-blue-600">{getStatusText(user.in_shelter)}</p>
|
||
{user.last_updated && (
|
||
<p className="text-xs text-gray-500">עודכן: {new Date(user.last_updated).toLocaleString("he-IL")}</p>
|
||
)}
|
||
</div>
|
||
)}
|
||
|
||
<div className="space-y-3">
|
||
<Button
|
||
variant="outline"
|
||
className="w-full h-16 text-lg border-green-200 hover:bg-green-50"
|
||
onClick={() => handleReport("no_alarm")}
|
||
disabled={loading}
|
||
>
|
||
<ShieldAlert className="ml-2 h-6 w-6 text-green-600" />
|
||
אין אזעקה באזור
|
||
</Button>
|
||
|
||
<Button
|
||
variant="outline"
|
||
className="w-full h-20 text-xl border-green-200 hover:bg-green-50"
|
||
onClick={() => handleReport("yes")}
|
||
disabled={loading}
|
||
>
|
||
<Shield className="ml-2 h-8 w-8 text-green-600" />
|
||
במקלט/חדר מוגן
|
||
</Button>
|
||
|
||
<Button
|
||
variant="outline"
|
||
className="w-full h-16 text-lg border-emerald-200 hover:bg-emerald-50"
|
||
onClick={() => handleReport("safe_after_exit")}
|
||
disabled={loading}
|
||
>
|
||
<Shield className="ml-2 h-6 w-6 text-emerald-600" />
|
||
בטוח אחרי יציאה מהמקלט
|
||
</Button>
|
||
|
||
<Button
|
||
variant="outline"
|
||
className="w-full h-16 text-lg border-orange-200 hover:bg-orange-50"
|
||
onClick={() => handleReport("no")}
|
||
disabled={loading}
|
||
>
|
||
<ShieldX className="ml-2 h-6 w-6 text-orange-600" />
|
||
לא במקלט - אין מקלט בקרבת מקום
|
||
</Button>
|
||
</div>
|
||
|
||
<Button variant="outline" onClick={onClose} className="w-full">
|
||
ביטול
|
||
</Button>
|
||
</div>
|
||
</DialogContent>
|
||
</Dialog>
|
||
)
|
||
}
|