fix: button relevant in media tracking and table

This commit is contained in:
Sabda Yagra 2026-01-09 18:35:20 +07:00
parent 2d09af2e8b
commit 0ad1acee09
6 changed files with 98 additions and 49 deletions

View File

@ -89,7 +89,8 @@ const columns: ColumnDef<any>[] = [
cell: ({ row, table }) => { cell: ({ row, table }) => {
const original = row.original; const original = row.original;
const isValid = original.isValid; // const isValid = original.isValid;
const isRelevant = original.isRelevant;
const link = original.link; const link = original.link;
const updateRow = (data: Partial<any>) => { const updateRow = (data: Partial<any>) => {
@ -99,10 +100,10 @@ const columns: ColumnDef<any>[] = [
const handleValid = async () => { const handleValid = async () => {
try { try {
await validateMediaLink(original.id, true); await validateMediaLink(original.id, true);
updateRow({ updateRow({
isValid: true, isRelevant: true,
}); });
table.options.meta?.refetchData?.();
} catch (err: any) { } catch (err: any) {
toast.error(err.message); toast.error(err.message);
} }
@ -113,8 +114,9 @@ const columns: ColumnDef<any>[] = [
await validateMediaLink(original.id, false); await validateMediaLink(original.id, false);
updateRow({ updateRow({
isValid: false, isRelevant: false,
}); });
table.options.meta?.refetchData?.();
} catch (err: any) { } catch (err: any) {
toast.error(err.message); toast.error(err.message);
} }
@ -124,24 +126,55 @@ const columns: ColumnDef<any>[] = [
return <span className="text-muted-foreground">-</span>; return <span className="text-muted-foreground">-</span>;
} }
if (isValid === true) { if (isRelevant === true) {
return ( return (
<Button <Button
size="sm" size="sm"
className="bg-green-600 hover:bg-green-700" className="bg-green-600 hover:bg-green-700"
disabled disabled
> >
Valid Relevan
</Button> </Button>
); );
} }
return ( return (
<div className="flex gap-2"> <div className="flex gap-2">
<Button size="sm" variant="outline" onClick={handleValid}> <Button
size="sm"
variant="outline"
onClick={handleValid}
className="flex items-center"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M18.7 7.2c-.4-.4-1-.4-1.4 0l-7.5 7.5l-3.1-3.1c-.4-.4-1-.4-1.4 0s-.4 1 0 1.4l3.8 3.8c.2.2.4.3.7.3s.5-.1.7-.3l8.2-8.2c.4-.4.4-1 0-1.4"
/>
</svg>
Relevan Relevan
</Button> </Button>
<Button size="sm" variant="outline" onClick={handleInvalid}> <Button size="sm" variant="outline" onClick={handleInvalid} className="flex text-center items-center justify-center">
<svg
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 24 24"
>
<path
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="1.5"
d="M6.758 17.243L12.001 12m5.243-5.243L12 12m0 0L6.758 6.757M12.001 12l5.243 5.243"
/>
</svg>
Tidak Relevan Tidak Relevan
</Button> </Button>
</div> </div>

View File

@ -124,6 +124,9 @@ const NewsDetailTable = () => {
) )
); );
}, },
refetchData: () => {
fetchData();
},
}, },
state: { state: {
sorting, sorting,
@ -163,7 +166,7 @@ const NewsDetailTable = () => {
pageIndex: 0, pageIndex: 0,
pageSize: Number(showData), pageSize: Number(showData),
}); });
}, [page, showData]); }, [page, showData, id]);
async function fetchData() { async function fetchData() {
try { try {

View File

@ -52,32 +52,34 @@ const columns: ColumnDef<any>[] = [
header: "Judul", header: "Judul",
cell: ({ row }) => <span>{row.getValue("title")}</span>, cell: ({ row }) => <span>{row.getValue("title")}</span>,
}, },
// { {
// accessorKey: "resultTotal", accessorKey: "resultTotal",
// header: () => <div className="text-center w-full">Jumlah Amplifikasi</div>, header: () => <div className="text-center w-full">Total Artikel</div>,
// cell: ({ row }) => { cell: ({ row }) => {
// const value = row.getValue("resultTotal") as number | string | null; const value = row.getValue("resultTotal") as number | string | null;
// const finalValue = const finalValue =
// value === null || value === undefined || value === "" value === null || value === undefined || value === ""
// ? 0 ? 0
// : Number(value); : Number(value);
// return <div className="text-center w-full">{finalValue}</div>; return <div className="text-center w-full">{finalValue}</div>;
// }, },
// }, },
{ {
accessorKey: "amplification", accessorKey: "amplification",
header: () => <div className="text-center w-full">Jumlah Amplifikasi</div>, header: () => <div className="text-center w-full">Jumlah Amplifikasi</div>,
cell: ({ row }) => { cell: ({ row }) => {
const totalRaw = row.getValue("amplification") as number | string | null; const raw = row.getValue("amplification") as string | null;
const total = let total = 0;
totalRaw === null || totalRaw === undefined || totalRaw === "" let invalidTotal = 0;
? 0
: Number(totalRaw);
const invalidTotal = 0; if (raw && typeof raw === "string") {
const parts = raw.split("/").map((v) => v.trim());
total = Number(parts[0]) || 0;
invalidTotal = Number(parts[1]) || 0;
}
return ( return (
<div className="text-center w-full font-medium"> <div className="text-center w-full font-medium">

View File

@ -894,7 +894,6 @@ const EventModal = ({
const resCsrf = await getCsrfToken(); const resCsrf = await getCsrfToken();
const csrfToken = resCsrf?.data?.token; const csrfToken = resCsrf?.data?.token;
console.log("CSRF TOKEN : ", csrfToken);
const headers = { const headers = {
"X-XSRF-TOKEN": csrfToken, "X-XSRF-TOKEN": csrfToken,
}; };

View File

@ -2,6 +2,7 @@ import api from "@/src/lib/api";
import { import {
httpGetInterceptor, httpGetInterceptor,
httpPostInterceptor, httpPostInterceptor,
httpPutInterceptor,
} from "../http-config/http-interceptor-service"; } from "../http-config/http-interceptor-service";
export async function getMediaTrackingMonitoring(page: number, size: number) { export async function getMediaTrackingMonitoring(page: number, size: number) {
@ -63,31 +64,41 @@ export async function listDataTracking(
); );
} }
export async function listDataAllNonPagination(search: string) { export async function listDataAllNonPagination(search: string) {
return await httpGetInterceptor( return await httpGetInterceptor(
`media/public/list?enablePage=0&sort=desc&title=${search || ""}` `media/public/list?enablePage=0&sort=desc&title=${search || ""}`
); );
} }
export const validateMediaLink = async ( export async function validateMediaLink(resultId: number, isRelevant: boolean) {
resultId: number, const url = "media/tracking/monitoring/results/relevant";
isRelevant: boolean
) => { const payload = {
try {
const res = await api.put(
"/media/tracking/monitoring/results/relevant",
{
resultId, resultId,
isRelevant, isRelevant,
}
);
return res.data;
} catch (error: any) {
throw new Error(
error?.response?.data?.messages?.[0] ||
"Gagal memperbarui status relevansi"
);
}
}; };
return httpPutInterceptor(url, payload);
}
// export const validateMediaLink = async (
// resultId: number,
// isRelevant: boolean
// ) => {
// try {
// const res = await api.put(
// "/media/tracking/monitoring/results/relevant",
// {
// resultId,
// isRelevant,
// }
// );
// return res.data;
// } catch (error: any) {
// throw new Error(
// error?.response?.data?.messages?.[0] ||
// "Gagal memperbarui status relevansi"
// );
// }
// };

View File

@ -4,5 +4,6 @@ import "@tanstack/react-table";
declare module "@tanstack/react-table" { declare module "@tanstack/react-table" {
interface TableMeta<TData> { interface TableMeta<TData> {
updateData: (rowIndex: number, value: Partial<TData>) => void; updateData: (rowIndex: number, value: Partial<TData>) => void;
refetchData?: () => void;
} }
} }