wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: admin stiker

Browse Source 
deskrispi:
- feature update status sticker
This commit is contained in:
Bagasbanuna02
2025-05-16 16:37:16 +08:00
parent 7da8fb165a
commit e7858a2812
6 changed files with 180 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/app/api/sticker/[id]/activation/route.ts Normal file
View File

@@ -0,0 +1,39 @@
import { NextResponse } from "next/server";
import { prisma } from "@/lib";
export { PUT };
async function PUT(request: Request, { params }: { params: { id: string } }) {
const method = request.method;
if (method !== "PUT") {
return NextResponse.json(
{ success: false, message: "Method not allowed" },
{ status: 405 }
);
}
try {
const { id } = params;
const data = await request.json();
const sticker = await prisma.sticker.update({
where: {
id: id,
},
data: {
isActive: data.isActive,
},
});
return NextResponse.json(
{ success: true, message: "Success update data sticker", data: sticker },
{ status: 200 }
);
} catch (error) {
console.error("Error update data sticker", error);
return NextResponse.json(
{ success: false, message: "Error update data sticker" },
{ status: 500 }
);
}
}

2
src/app/api/sticker/route.ts
View File

@@ -62,7 +62,7 @@ async function GET(request: Request) {
try {
const sticker = await prisma.sticker.findMany({
orderBy: {
updatedAt: "desc",
createdAt: "desc",
},
include: {
MasterEmotions: true,

2
src/app_modules/admin/_admin_global/_component/comp_admin_modal.tsx
View File

@@ -32,7 +32,7 @@ export function Admin_ComponentModal({
centered
title={title}
withCloseButton={withCloseButton ? withCloseButton : false}
closeOnClickOutside={closeOnClickOutside}
closeOnClickOutside={closeOnClickOutside ? closeOnClickOutside : false}
>
{children}
</Modal>

34
src/app_modules/admin/app_info/lib/api_fetch_stiker.tsx
View File

@@ -164,4 +164,38 @@ export const apiAdminDeleteSticker = async ({ id }: { id: string }) => {
console.error("Error delete sticker", error);
throw error; // Re-throw the error to handle it in the calling function
}
};
export const apiAdminUpdateStatusStickerById = async ({ data }: { data: any }) => {
try {
// Fetch token from cookie
const { token } = await fetch("/api/get-cookie").then((res) => res.json());
if (!token) {
console.error("No token found");
return null;
}
const response = await fetch(`/api/sticker/${data.id}/activation`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
Authorization: `Bearer ${token}`,
},
body: JSON.stringify(data),
});
// Check if the response is OK
if (!response.ok) {
const errorData = await response.json().catch(() => null);
console.error("Failed to update status sticker", response.statusText, errorData);
throw new Error(errorData?.message || "Failed to update status sticker");
}
// Return the JSON response
return await response.json();
} catch (error) {
console.error("Error update status sticker", error);
throw error; // Re-throw the error to handle it in the calling function
}
};

5
src/app_modules/admin/app_info/view/sticker/view_detail_sticker.tsx
View File

@@ -168,11 +168,6 @@ export default function AdminAppInformation_ViewStickerDetail() {
fileId: data?.fileId as string,
});
if (!deleteFile.success) {
ComponentGlobal_NotifikasiPeringatan("Gagal delete gambar");
return;
}
setLoadingDelete(false);
ComponentAdminGlobal_NotifikasiBerhasil("Berhasil dihapus");
router.back();

132
src/app_modules/admin/app_info/view/view_stiker.tsx
View File

@@ -19,8 +19,9 @@ import {
ScrollArea,
Spoiler,
Stack,
Switch,
Table,
Text
Text,
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { IconPencil, IconPlus } from "@tabler/icons-react";
@@ -29,18 +30,25 @@ import { useRouter } from "next/navigation";
import { useState } from "react";
import { ComponentAdminGlobal_TitlePage } from "../../_admin_global/_component";
import { Admin_ComponentBoxStyle } from "../../_admin_global/_component/comp_admin_boxstyle";
import { apiAdminGetSticker } from "../lib/api_fetch_stiker";
import { Admin_ComponentModal } from "../../_admin_global/_component/comp_admin_modal";
import { ComponentAdminGlobal_NotifikasiBerhasil } from "../../_admin_global/admin_notifikasi/notifikasi_berhasil";
import { ComponentAdminGlobal_NotifikasiGagal } from "../../_admin_global/admin_notifikasi/notifikasi_gagal";
import {
apiAdminGetSticker,
apiAdminUpdateStatusStickerById,
} from "../lib/api_fetch_stiker";
export default function AdminAppInformation_ViewSticker() {
const router = useRouter();
const [loadingCreate, setLoadingCreate] = useState(false);
const [loadingDetail, setLoadingDetail] = useState<string | null>(null);
const [dataSticker, setDataSticker] = useState<ISticker[] | null>(null);
const [isActivation, setIsActivation] = useState(false);
const [updateStatus, setUpdateStatus] = useState({
const [dataUpdate, setDataUpdate] = useState({
id: "",
active: false,
isActive: false,
});
const [loadingUpdate, setLoadingUpdate] = useState(false);
const [opened, setOpened] = useState(false);
useShallowEffect(() => {
const fetchData = async () => {
@@ -57,6 +65,44 @@ export default function AdminAppInformation_ViewSticker() {
fetchData();
}, []);
const handleUpdateActivation = async ({
id,
value,
}: {
id: string;
value: boolean;
}) => {
const data = {
id: id,
isActive: value,
};
try {
setLoadingUpdate(true);
const updt = await apiAdminUpdateStatusStickerById({
data: data as any,
});
if (updt.success) {
const cloneData = [...(dataSticker || [])];
const index = cloneData.findIndex((e) => e.id === id);
if (index !== -1) {
cloneData[index].isActive = value;
setDataSticker([...cloneData]);
}
ComponentAdminGlobal_NotifikasiBerhasil(updt.message);
} else {
ComponentAdminGlobal_NotifikasiGagal(updt.message);
}
} catch (error) {
console.log("Error update status sticker", error);
} finally {
setLoadingUpdate(false);
}
};
return (
<>
<Stack>
@@ -94,9 +140,9 @@ export default function AdminAppInformation_ViewSticker() {
<th>
<Center c={AdminColor.white}>Aksi</Center>
</th>
{/* <th>
<th>
<Center c={AdminColor.white}>Status</Center>
</th> */}
</th>
<th>
<Center c={AdminColor.white}>Stiker</Center>
@@ -112,10 +158,9 @@ export default function AdminAppInformation_ViewSticker() {
router,
loadingDetail,
setLoadingDetail,
isActivation,
setIsActivation,
updateStatus,
setUpdateStatus,
setOpened,
dataUpdate,
setDataUpdate,
})}
</tbody>
</Table>
@@ -123,6 +168,41 @@ export default function AdminAppInformation_ViewSticker() {
</Admin_ComponentBoxStyle>
)}
</Stack>
<Admin_ComponentModal opened={opened} onClose={() => setOpened(false)}>
<Stack>
<Text fw={500} c={AdminColor.white}>
Apakah anda yakin ingin mengubah status stiker ini ?
</Text>
<Group position="center">
<Button
radius={"xl"}
onClick={() => {
setOpened(false);
setLoadingUpdate(false);
}}
>
Tidak
</Button>
<Button
loading={loadingUpdate}
loaderPosition="center"
radius={"xl"}
bg={MainColor.green}
color="green"
onClick={() => {
handleUpdateActivation({
id: dataUpdate.id,
value: dataUpdate.isActive,
});
setOpened(false);
}}
>
Ya
</Button>
</Group>
</Stack>
</Admin_ComponentModal>
</>
);
}
@@ -132,10 +212,12 @@ type RowTableProps = {
router: AppRouterInstance;
loadingDetail: string | null;
setLoadingDetail: (val: string | null) => void;
isActivation: boolean;
setIsActivation: (val: boolean) => void;
updateStatus: { id: string; active: boolean };
setUpdateStatus: (val: { id: string; active: boolean }) => void;
setOpened: (val: boolean) => void;
dataUpdate: {
id: string;
isActive: boolean;
};
setDataUpdate: (val: { id: string; isActive: boolean }) => void;
};
const rowTable = ({
@@ -143,10 +225,9 @@ const rowTable = ({
router,
loadingDetail,
setLoadingDetail,
isActivation,
setIsActivation,
updateStatus,
setUpdateStatus,
setOpened,
dataUpdate,
setDataUpdate,
}: RowTableProps) => {
if (!Array.isArray(dataSticker) || dataSticker.length === 0) {
return (
@@ -184,23 +265,20 @@ const rowTable = ({
</Button>
</Center>
</td>
{/* <td>
<td>
<Center>
<Switch
checked={e.isActive}
color="green"
color="yellow"
onLabel="ON"
offLabel="OFF"
onChange={(val) => {
setIsActivation(true);
setUpdateStatus({
id: e?.id,
active: val.currentTarget.checked as any,
});
setDataUpdate({ id: e.id, isActive: val.currentTarget.checked });
setOpened(true);
}}
/>
</Center>
</td> */}
</td>
<td>
<Center>
<Paper bg="gray" p={"xs"}>