59 lines
1.7 KiB
TypeScript
59 lines
1.7 KiB
TypeScript
import { Paper } from "@mui/material";
|
||
import { countryStore } from "@shared";
|
||
import { observer } from "mobx-react-lite";
|
||
import { ArrowLeft } from "lucide-react";
|
||
import { useEffect } from "react";
|
||
import { useNavigate, useParams } from "react-router-dom";
|
||
|
||
export const CountryPreviewPage = observer(() => {
|
||
const { id } = useParams();
|
||
const { getCountry, country } = countryStore;
|
||
const navigate = useNavigate();
|
||
|
||
useEffect(() => {
|
||
(async () => {
|
||
await getCountry(id as string);
|
||
})();
|
||
}, [id]);
|
||
|
||
return (
|
||
<Paper className="w-full h-full p-3 flex flex-col gap-10">
|
||
<div className="flex justify-between items-center">
|
||
<button
|
||
className="flex items-center gap-2"
|
||
onClick={() => navigate(-1)}
|
||
>
|
||
<ArrowLeft size={20} />
|
||
Назад
|
||
</button>
|
||
{/* <div className="flex gap-2">
|
||
<Button
|
||
variant="contained"
|
||
color="primary"
|
||
onClick={() => navigate(`/user/${id}/edit`)}
|
||
startIcon={<Pencil size={20} />}
|
||
>
|
||
Редактировать
|
||
</Button>
|
||
<Button
|
||
variant="contained"
|
||
color="error"
|
||
onClick={() => navigate(`/user/${id}/delete`)}
|
||
startIcon={<Trash2 size={20} />}
|
||
>
|
||
Удалить
|
||
</Button>
|
||
</div> */}
|
||
</div>
|
||
{country && (
|
||
<div className="flex flex-col gap-10 w-full">
|
||
<div className="flex flex-col gap-2">
|
||
<h1 className="text-lg font-bold">Название</h1>
|
||
<p>{country?.name}</p>
|
||
</div>
|
||
</div>
|
||
)}
|
||
</Paper>
|
||
);
|
||
});
|