57 lines
1.4 KiB
TypeScript
57 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
|
|
type CardTier = "GOLD" | "SILVER" | "BRONZE";
|
|
|
|
const labels: Record<CardTier, string> = {
|
|
GOLD: "طلایی",
|
|
SILVER: "نقره ای",
|
|
BRONZE: "برنزی",
|
|
};
|
|
|
|
export default function CardTierSelect({
|
|
playerId,
|
|
initial,
|
|
}: {
|
|
playerId: string;
|
|
initial: CardTier;
|
|
}) {
|
|
const [value, setValue] = useState<CardTier>(initial);
|
|
const [loading, setLoading] = useState(false);
|
|
const router = useRouter();
|
|
|
|
async function handleChange(next: CardTier) {
|
|
setValue(next);
|
|
setLoading(true);
|
|
|
|
const res = await fetch(`/api/admin/players/${playerId}/card-tier`, {
|
|
method: "PATCH",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ cardTier: next }),
|
|
});
|
|
|
|
if (!res.ok) {
|
|
setValue(initial);
|
|
} else {
|
|
router.refresh();
|
|
}
|
|
|
|
setLoading(false);
|
|
}
|
|
|
|
return (
|
|
<select
|
|
value={value}
|
|
onChange={(e) => handleChange(e.target.value as CardTier)}
|
|
disabled={loading}
|
|
className="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs focus:outline-none focus:ring-2 focus:ring-emerald-500 disabled:opacity-50"
|
|
>
|
|
<option value="GOLD">{labels.GOLD}</option>
|
|
<option value="SILVER">{labels.SILVER}</option>
|
|
<option value="BRONZE">{labels.BRONZE}</option>
|
|
</select>
|
|
);
|
|
}
|