Files
hipmi/src/app_modules/forum/report/posting/index.tsx
Bagasbanuna02 de0790aade # Forum Report
## feat
- Repot posting
- Report komentar
### No issuee
2024-03-18 14:02:01 +08:00

86 lines
2.3 KiB
TypeScript

"use client";
import { Box, Button, Paper, Radio, Stack, Text, Title } from "@mantine/core";
import { MODEL_FORUM_REPORT } from "../../model/interface";
import { useState } from "react";
import { forum_funCreateReportPosting } from "../../fun/create/fun_create_report_posting";
import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
import { useRouter } from "next/navigation";
import { ComponentGlobal_NotifikasiGagal } from "@/app_modules/component_global/notif_global/notifikasi_gagal";
import { RouterForum } from "@/app/lib/router_hipmi/router_forum";
export default function Forum_ReportPosting({
postingId,
listReport,
}: {
postingId: string;
listReport: MODEL_FORUM_REPORT[];
}) {
const [reportValue, setReportValue] = useState("Kebencian");
return (
<>
<Stack px={"sm"}>
<Radio.Group value={reportValue as any} onChange={setReportValue}>
<Stack spacing={"xl"}>
{listReport.map((e) => (
<Stack key={e.id}>
<Radio
value={e.title}
label={<Title order={5}>{e.title}</Title>}
/>
<Text>{e.deskripsi}</Text>
</Stack>
))}
</Stack>
</Radio.Group>
<ButtonAction value={reportValue} postingId={postingId} />
</Stack>
</>
);
}
function ButtonAction({
value,
postingId,
}: {
value: string;
postingId: string;
}) {
const router = useRouter();
const [loading, setLoading] = useState(false);
async function onReport() {
await forum_funCreateReportPosting(postingId, value).then((res) => {
if (res.status === 201) {
ComponentGlobal_NotifikasiBerhasil(res.message, 2000);
setLoading(true);
router.back();
} else {
ComponentGlobal_NotifikasiGagal(res.message);
}
});
}
return (
<>
<Stack mt={"md"}>
<Button
radius={"xl"}
onClick={() => router.replace(RouterForum.report_posting_lainnya + postingId)}
>
Lainnya
</Button>
<Button
radius={"xl"}
color="red"
loaderPosition="center"
loading={loading ? true : false}
onClick={() => onReport()}
>
Report
</Button>
</Stack>
</>
);
}