This commit is contained in:
hanif salafi 2025-07-24 16:31:25 +07:00
commit 7d9f23896e
40 changed files with 624 additions and 280 deletions

View File

@ -76,9 +76,6 @@ export default function EditUserForm() {
},
});
const passwordVal = form.watch("password");
const confPasswordVal = form.watch("confirmPassword");
useEffect(() => {
initData();
}, []);

View File

@ -354,7 +354,7 @@ export default function EditUserForm() {
rules={["minLength", "specialChar", "number", "capital", "match"]}
minLength={8}
value={passwordVal || ""}
valueAgain={confPasswordVal}
valueAgain={confPasswordVal || ""}
onChange={(isValid) => {
form.setValue("isValidPassword", isValid);
}}

View File

@ -752,7 +752,7 @@ export default function CreateUserForm() {
rules={["minLength", "specialChar", "number", "capital", "match"]}
minLength={8}
value={passwordVal || ""}
valueAgain={confPasswordVal}
valueAgain={confPasswordVal || ""}
onChange={(isValid) => {
form.setValue("isValidPassword", isValid);
}}

View File

@ -191,8 +191,6 @@ export default function DetailUserForm() {
},
});
const passwordVal = form.watch("password");
const confPasswordVal = form.watch("confirmPassword");
const selectedRole = form.watch("role");
useEffect(() => {

View File

@ -757,7 +757,7 @@ export default function EditUserForm() {
rules={["minLength", "specialChar", "number", "capital", "match"]}
minLength={8}
value={passwordVal || ""}
valueAgain={confPasswordVal}
valueAgain={confPasswordVal || ""}
onChange={(isValid) => {
form.setValue("isValidPassword", isValid);
}}

View File

@ -125,16 +125,16 @@ export default function CreateCategoryModal() {
});
const contentType = form.watch("contentType");
const isAllContentChecked = listContent.every((item) =>
contentType?.includes(item.id)
const isAllContentChecked = contentType && listContent.every((item) =>
contentType.includes(item.id)
);
const users = form.watch("selectedUser");
const isAllUserChecked = userList.every((item) => users?.includes(item.id));
const isAllUserChecked = users && userList.every((item) => users.includes(item.id));
const target = form.watch("publishTo");
const isAllTargetChecked = publishToList.every((item) =>
target?.includes(item.id)
const isAllTargetChecked = target && publishToList.every((item) =>
target.includes(item.id)
);
const { getRootProps, getInputProps } = useDropzone({

View File

@ -146,12 +146,12 @@ export default function EditCategoryModal(props: {
form.setValue("id", String(data?.id));
form.setValue("title", String(data?.name));
form.setValue("description", String(data?.description));
form.setValue("contentType", data?.mediaTypes?.split(","));
form.setValue("contentType", data?.mediaTypes?.split(",") || []);
form.setValue(
"selectedUser",
removeAndReturn(data?.publishedFor, [2, 3, 4])
);
form.setValue("publishTo", data?.publishedLocation?.split(","));
form.setValue("publishTo", data?.publishedLocation?.split(",") || []);
form.setValue("file", thumbnailLink);
setUnitData(filterString(data?.publishedLocationLevel, "under"));
@ -183,16 +183,16 @@ export default function EditCategoryModal(props: {
}
const contentType = form.watch("contentType");
const isAllContentChecked = listContent.every((item) =>
contentType?.includes(item.id)
const isAllContentChecked = contentType && listContent.every((item) =>
contentType.includes(item.id)
);
const users = form.watch("selectedUser");
const isAllUserChecked = userList.every((item) => users?.includes(item.id));
const isAllUserChecked = users && userList.every((item) => users.includes(item.id));
const target = form.watch("publishTo");
const isAllTargetChecked = publishToList.every((item) =>
target?.includes(item.id)
const isAllTargetChecked = target && publishToList.every((item) =>
target.includes(item.id)
);
useEffect(() => {

View File

@ -68,11 +68,11 @@ export function UnitMapping(props: {
const unitType = form.watch("items");
const isAllUnitChecked = unitList.every((item) =>
unitType?.includes(String(item.id))
const isAllUnitChecked = unitType && unitList.every((item) =>
unitType.includes(String(item.id))
);
const isAllSatkerChecked = satkerList.every((item) =>
unitType?.includes(String(item.id))
const isAllSatkerChecked = unitType && satkerList.every((item) =>
unitType.includes(String(item.id))
);
const setupUnit = (data: UnitType[]) => {

View File

@ -91,8 +91,8 @@ export default function CreateFAQModal() {
});
const target = form.watch("publishTo");
const isAllTargetChecked = publishToList.every((item) =>
target?.includes(item.id)
const isAllTargetChecked = target && publishToList.every((item) =>
target.includes(item.id)
);
const onSubmit = async (data: z.infer<typeof FormSchema>) => {

View File

@ -74,11 +74,11 @@ export function UnitMapping(props: {
const unitType = form.watch("items");
const isAllUnitChecked = unitList.every((item) =>
unitType?.includes(String(item.id))
const isAllUnitChecked = unitType && unitList.every((item) =>
unitType.includes(String(item.id))
);
const isAllSatkerChecked = satkerList.every((item) =>
unitType?.includes(String(item.id))
const isAllSatkerChecked = unitType && satkerList.every((item) =>
unitType.includes(String(item.id))
);
const isAllPolresChecked = polresList.every((item) =>
unitType?.includes(String(item.id))

View File

@ -132,29 +132,36 @@ const useTableColumns = () => {
accessorKey: "statusName",
header: "Status",
cell: ({ row }) => {
const statusColors: Record<string, string> = {
diterima: "bg-green-100 text-green-600",
"menunggu review": "bg-orange-100 text-orange-600",
const statusId = Number(row.original?.statusId);
const reviewedAtLevel = row.original?.reviewedAtLevel || "";
const creatorGroupLevelId = Number(row.original?.creatorGroupLevelId);
const needApprovalFromLevel = Number(
row.original?.needApprovalFromLevel
);
const userHasReviewed = reviewedAtLevel.includes(`:${userLevelId}:`);
const isCreator = creatorGroupLevelId === Number(userLevelId);
const isWaitingForReview =
statusId === 2 && !userHasReviewed && !isCreator;
const isApprovalNeeded =
statusId === 1 && needApprovalFromLevel === Number(userLevelId);
const label =
isWaitingForReview || isApprovalNeeded
? "Menunggu Review"
: statusId === 2
? "Diterima"
: row.original?.statusName;
const colors: Record<string, string> = {
"Menunggu Review": "bg-orange-100 text-orange-600",
Diterima: "bg-green-100 text-green-600",
default: "bg-red-200 text-red-600",
};
const colors = [
"bg-orange-100 text-orange-600",
"bg-orange-100 text-orange-600",
"bg-green-100 text-green-600",
"bg-blue-100 text-blue-600",
"bg-red-200 text-red-600",
];
const status =
Number(row.original?.statusId) == 2 &&
row.original?.reviewedAtLevel !== null &&
!row.original?.reviewedAtLevel?.includes(`:${userLevelId}:`) &&
Number(row.original?.creatorGroupLevelId) != Number(userLevelId)
? "1"
: row.original?.statusId;
const statusStyles =
colors[Number(status)] || "bg-red-200 text-red-600";
// const statusStyles = statusColors[status] || "bg-red-200 text-red-600";
const statusStyles = colors[label] || colors.default;
return (
<Badge
@ -163,18 +170,7 @@ const useTableColumns = () => {
statusStyles
)}
>
{(Number(row.original?.statusId) == 2 &&
!row.original?.reviewedAtLevel !== null &&
!row.original?.reviewedAtLevel?.includes(
`:${Number(userLevelId)}:`
) &&
Number(row.original?.creatorGroupLevelId) !=
Number(userLevelId)) ||
(Number(row.original?.statusId) == 1 &&
Number(row.original?.needApprovalFromLevel) ==
Number(userLevelId))
? "Menunggu Review"
: row.original?.statusName}{" "}
{label}
</Badge>
);
},

View File

@ -281,11 +281,11 @@ export default function DetailDaily() {
const output = form.watch("output");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const unit = form.watch("unit");
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
const handleAllCheckedChange = (checked: boolean | string) => {
if (checked) {
@ -318,11 +318,11 @@ export default function DetailDaily() {
const handleUnitCheckedChange = (id: string, checked: boolean | string) => {
if (checked) {
form.setValue("unit", [...unit, id]);
form.setValue("unit", [...(unit ?? []), id]);
} else {
if (id == "2") {
const temp = [];
for (const element of unit) {
for (const element of unit ?? []) {
if (element == "1") {
temp.push("1");
}
@ -331,7 +331,7 @@ export default function DetailDaily() {
} else {
form.setValue(
"unit",
unit.filter((value) => value !== id)
(unit ?? []).filter((value) => value !== id)
);
}
}
@ -542,14 +542,14 @@ export default function DetailDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -564,7 +564,7 @@ export default function DetailDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -574,7 +574,7 @@ export default function DetailDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -592,7 +592,7 @@ export default function DetailDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -603,7 +603,7 @@ export default function DetailDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}

View File

@ -294,11 +294,11 @@ export default function EditDaily() {
const output = form.watch("output");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const unit = form.watch("unit");
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
const handleAllCheckedChange = (checked: boolean | string) => {
if (checked) {
@ -314,7 +314,7 @@ export default function EditDaily() {
const handleItemCheckedChange = (id: string, checked: boolean | string) => {
form.setValue(
"output",
checked ? [...output, id] : output.filter((value) => value !== id)
checked ? [...(output ?? []), id] : (output ?? []).filter((value) => value !== id)
);
};
@ -331,11 +331,11 @@ export default function EditDaily() {
const handleUnitCheckedChange = (id: string, checked: boolean | string) => {
if (checked) {
form.setValue("unit", [...unit, id]);
form.setValue("unit", [...(unit ?? []), id]);
} else {
if (id == "2") {
const temp = [];
for (const element of unit) {
for (const element of unit ?? []) {
if (element == "1") {
temp.push("1");
}
@ -344,7 +344,7 @@ export default function EditDaily() {
} else {
form.setValue(
"unit",
unit.filter((value) => value !== id)
(unit ?? []).filter((value) => value !== id)
);
}
}
@ -506,7 +506,7 @@ export default function EditDaily() {
<Checkbox
checked={unit?.includes(item.id)}
disabled={
item.id === "3" && !unit.includes("2")
item.id === "3" && !(unit?.includes("2") ?? false)
}
onCheckedChange={(checked) =>
handleUnitCheckedChange(item.id, checked)
@ -550,14 +550,14 @@ export default function EditDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -572,7 +572,7 @@ export default function EditDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -582,7 +582,7 @@ export default function EditDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -600,7 +600,7 @@ export default function EditDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -611,7 +611,7 @@ export default function EditDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}

View File

@ -242,11 +242,11 @@ export default function CreateDaily() {
const output = form.watch("output");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const unit = form.watch("unit");
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
const handleAllCheckedChange = (checked: boolean | string) => {
if (checked) {
@ -262,7 +262,7 @@ export default function CreateDaily() {
const handleItemCheckedChange = (id: string, checked: boolean | string) => {
form.setValue(
"output",
checked ? [...output, id] : output.filter((value) => value !== id)
checked ? [...(output ?? []), id] : (output ?? []).filter((value) => value !== id)
);
};
@ -279,11 +279,11 @@ export default function CreateDaily() {
const handleUnitCheckedChange = (id: string, checked: boolean | string) => {
if (checked) {
form.setValue("unit", [...unit, id]);
form.setValue("unit", [...(unit ?? []), id]);
} else {
if (id == "2") {
const temp = [];
for (const element of unit) {
for (const element of unit ?? []) {
if (element == "1") {
temp.push("1");
}
@ -292,7 +292,7 @@ export default function CreateDaily() {
} else {
form.setValue(
"unit",
unit.filter((value) => value !== id)
(unit ?? []).filter((value) => value !== id)
);
}
}
@ -472,7 +472,7 @@ export default function CreateDaily() {
<Checkbox
checked={unit?.includes(item.id)}
disabled={
item.id === "3" && !unit.includes("2")
item.id === "3" && !(unit?.includes("2") ?? false)
}
onCheckedChange={(checked) =>
handleUnitCheckedChange(item.id, checked)
@ -516,14 +516,14 @@ export default function CreateDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -538,7 +538,7 @@ export default function CreateDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -548,7 +548,7 @@ export default function CreateDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -566,7 +566,7 @@ export default function CreateDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -577,7 +577,7 @@ export default function CreateDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}

View File

@ -281,11 +281,11 @@ export default function DetailDaily() {
const output = form.watch("output");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const unit = form.watch("unit");
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
const handleAllCheckedChange = (checked: boolean | string) => {
if (checked) {
@ -301,7 +301,7 @@ export default function DetailDaily() {
const handleItemCheckedChange = (id: string, checked: boolean | string) => {
form.setValue(
"output",
checked ? [...output, id] : output.filter((value) => value !== id)
checked ? [...(output ?? []), id] : (output ?? []).filter((value) => value !== id)
);
};
@ -318,11 +318,11 @@ export default function DetailDaily() {
const handleUnitCheckedChange = (id: string, checked: boolean | string) => {
if (checked) {
form.setValue("unit", [...unit, id]);
form.setValue("unit", [...(unit ?? []), id]);
} else {
if (id == "2") {
const temp = [];
for (const element of unit) {
for (const element of unit ?? []) {
if (element == "1") {
temp.push("1");
}
@ -331,7 +331,7 @@ export default function DetailDaily() {
} else {
form.setValue(
"unit",
unit.filter((value) => value !== id)
(unit ?? []).filter((value) => value !== id)
);
}
}
@ -542,14 +542,14 @@ export default function DetailDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -564,7 +564,7 @@ export default function DetailDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -574,7 +574,7 @@ export default function DetailDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -592,7 +592,7 @@ export default function DetailDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -603,7 +603,7 @@ export default function DetailDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}

View File

@ -294,11 +294,11 @@ export default function EditDaily() {
const output = form.watch("output");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const unit = form.watch("unit");
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
const handleAllCheckedChange = (checked: boolean | string) => {
if (checked) {
@ -314,7 +314,7 @@ export default function EditDaily() {
const handleItemCheckedChange = (id: string, checked: boolean | string) => {
form.setValue(
"output",
checked ? [...output, id] : output.filter((value) => value !== id)
checked ? [...(output ?? []), id] : (output ?? []).filter((value) => value !== id)
);
};
@ -331,11 +331,11 @@ export default function EditDaily() {
const handleUnitCheckedChange = (id: string, checked: boolean | string) => {
if (checked) {
form.setValue("unit", [...unit, id]);
form.setValue("unit", [...(unit ?? []), id]);
} else {
if (id == "2") {
const temp = [];
for (const element of unit) {
for (const element of unit ?? []) {
if (element == "1") {
temp.push("1");
}
@ -344,7 +344,7 @@ export default function EditDaily() {
} else {
form.setValue(
"unit",
unit.filter((value) => value !== id)
(unit ?? []).filter((value) => value !== id)
);
}
}
@ -506,7 +506,7 @@ export default function EditDaily() {
<Checkbox
checked={unit?.includes(item.id)}
disabled={
item.id === "3" && !unit.includes("2")
item.id === "3" && !(unit?.includes("2") ?? false)
}
onCheckedChange={(checked) =>
handleUnitCheckedChange(item.id, checked)
@ -550,14 +550,14 @@ export default function EditDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -572,7 +572,7 @@ export default function EditDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -582,7 +582,7 @@ export default function EditDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -600,7 +600,7 @@ export default function EditDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -611,7 +611,7 @@ export default function EditDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}

View File

@ -264,9 +264,9 @@ export default function CreateDaily() {
const media = form.watch("media");
const unit = form.watch("unit");
const isAllChecked = items.every((item) => output?.includes(item.id));
const isAllMediaChecked = medias.every((item) => media?.includes(item.id));
const isAllUnitChecked = units.every((item) => unit?.includes(item.id));
const isAllChecked = output && items.every((item) => output.includes(item.id));
const isAllMediaChecked = media && medias.every((item) => media.includes(item.id));
const isAllUnitChecked = unit && units.every((item) => unit.includes(item.id));
useEffect(() => {
async function initState() {
@ -398,10 +398,8 @@ export default function CreateDaily() {
form.setValue(
"output",
checked
? [...output, item.id]
: output.filter(
(value) => value !== item.id
)
? [...(output ?? []), item.id]
: (output ?? []).filter((value) => value !== item.id)
);
}}
/>
@ -464,16 +462,14 @@ export default function CreateDaily() {
checked={unit?.includes(item.id)}
disabled={
item.id === "polres" &&
!unit.includes("polda")
!(unit?.includes("polda") ?? false)
}
onCheckedChange={(checked) => {
form.setValue(
"unit",
checked
? [...unit, item.id]
: unit.filter(
(value) => value !== item.id
)
? [...(unit ?? []), item.id]
: (unit ?? []).filter((value) => value !== item.id)
);
}}
/>
@ -515,14 +511,14 @@ export default function CreateDaily() {
id={list.id}
name={`all${list.id}`}
checked={
unit.includes("2")
unit?.includes("2") ?? false
? true
: !!selected[list.id]
}
onCheckedChange={() =>
handleParentChange(list.id)
}
disabled={unit.includes("2")}
disabled={unit?.includes("2") ?? false}
/>
<label
htmlFor={list.name}
@ -537,7 +533,7 @@ export default function CreateDaily() {
<div className="flex items-center space-x-2">
<Checkbox
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selectAll[list.id]
}
@ -547,7 +543,7 @@ export default function CreateDaily() {
Boolean(e)
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor="all-polres"
@ -565,7 +561,7 @@ export default function CreateDaily() {
<Checkbox
id={`${list.id}${subDes.id}`}
checked={
unit.includes("3")
unit?.includes("3") ?? false
? true
: !!selected[
`${list.id}${subDes.id}`
@ -576,7 +572,7 @@ export default function CreateDaily() {
`${list.id}${subDes.id}`
)
}
disabled={unit.includes("3")}
disabled={unit?.includes("3") ?? false}
/>
<label
htmlFor={`${list.id}${subDes.id}`}
@ -648,8 +644,8 @@ export default function CreateDaily() {
form.setValue(
"media",
checked
? [...media, item.id]
: media.filter(
? [...(media ?? []), item.id]
: (media ?? []).filter(
(value) => value !== item.id
)
);

View File

@ -24,6 +24,7 @@ import {
} from "@/components/ui/table";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import {
ChevronDown,
ChevronLeft,
ChevronRight,
Eye,
@ -61,6 +62,7 @@ import {
SelectValue,
} from "@/components/ui/select";
import { useTranslations } from "next-intl";
import { Label } from "@/components/ui/label";
type StatusFilter = string[];
@ -87,7 +89,8 @@ const ContentTable = () => {
const userLevelId = getCookiesDecrypt("ulie");
const [categories, setCategories] = React.useState<string[]>();
const [categoryFilter, setCategoryFilter] = React.useState<string[]>([]);
const [statusFilter, setStatusFilter] = React.useState<StatusFilter>([]);
// const [statusFilter, setStatusFilter] = React.useState<StatusFilter>([]);
const [statusFilter, setStatusFilter] = React.useState<any[]>([]);
const [startDateString, setStartDateString] = React.useState<string>("");
const [endDateString, setEndDateString] = React.useState<string>("");
const [filterByCreator, setFilterByCreator] = React.useState<string>("");
@ -168,6 +171,14 @@ const ContentTable = () => {
table.getColumn("judul")?.setFilterValue(e.target.value);
};
function handleStatusCheckboxChange(value: any) {
setStatusFilter((prev: any) =>
prev.includes(value)
? prev.filter((status: any) => status !== value)
: [...prev, value]
);
}
return (
<div className="w-full overflow-x-auto">
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between md:flex-row md:items-center md:justify-between lg:flex-row items-start lg:justify-between lg:items-center px-5">
@ -185,43 +196,88 @@ const ContentTable = () => {
/>
</InputGroup>
</div>
<div className=" items-center gap-3 w-full md:w-[200px]">
{/* <Select
onValueChange={(value) => {
setStatusFilter([value]);
}}
>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Select a Filter Status" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Status</SelectLabel>
<SelectItem value="1">Menunggu Review</SelectItem>
<SelectItem value="2">Diterima</SelectItem>
<SelectItem value="3">Minta Update</SelectItem>
<SelectItem value="4">Ditolak</SelectItem>
</SelectGroup>
</SelectContent>
</Select> */}
<Select
onValueChange={(value) => {
setFileTypeFilter([value]);
}}
>
<SelectTrigger className="w-full lg:w-[180px]">
<SelectValue placeholder={t("selectFilter")} />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Filter</SelectLabel>
<SelectItem value="1">{t("image")}</SelectItem>
<SelectItem value="2">{t("audio-visual")}</SelectItem>
<SelectItem value="3">{t("text")}</SelectItem>
<SelectItem value="4">Audio</SelectItem>
</SelectGroup>
</SelectContent>
</Select>
<div className="flex flex-row gap-3">
<div className=" items-center gap-3 w-full md:w-[152px] border border-black rounded-lg">
<Select
onValueChange={(value) => {
setFileTypeFilter([value]);
}}
>
<SelectTrigger className="w-full lg:w-[150px]">
<SelectValue placeholder={t("selectFilter")} />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Filter</SelectLabel>
<SelectItem value="1">{t("image")}</SelectItem>
<SelectItem value="2">{t("audio-visual")}</SelectItem>
<SelectItem value="3">{t("text")}</SelectItem>
<SelectItem value="4">{t("audio")}</SelectItem>
</SelectGroup>
</SelectContent>
</Select>
</div>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="ml-auto" size="md">
Filter <ChevronDown />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
align="end"
className="w-64 h-[150px] overflow-y-auto"
>
<Label className="ml-2 mt-2">Status</Label>
<div className="flex items-center px-4 py-1">
<input
type="checkbox"
id="status-2"
className="mr-2"
checked={statusFilter.includes(1)}
onChange={() => handleStatusCheckboxChange(1)}
/>
<label htmlFor="status-2" className="text-sm">
Menunggu Review
</label>
</div>
<div className="flex items-center px-4 py-1">
<input
type="checkbox"
id="status-2"
className="mr-2"
checked={statusFilter.includes(2)}
onChange={() => handleStatusCheckboxChange(2)}
/>
<label htmlFor="status-2" className="text-sm">
Diterima
</label>
</div>
<div className="flex items-center px-4 py-1">
<input
type="checkbox"
id="status-3"
className="mr-2"
checked={statusFilter.includes(3)}
onChange={() => handleStatusCheckboxChange(3)}
/>
<label htmlFor="status-3" className="text-sm">
Minta Update
</label>
</div>
<div className="flex items-center px-4 py-1">
<input
type="checkbox"
id="status-4"
className="mr-2"
checked={statusFilter.includes(4)}
onChange={() => handleStatusCheckboxChange(4)}
/>
<label htmlFor="status-4" className="text-sm">
Ditolak
</label>
</div>
</DropdownMenuContent>
</DropdownMenu>
</div>
</div>
<Table className="overflow-hidden mt-3">

View File

@ -81,8 +81,8 @@ export default function CreateSpvFAQModal() {
});
const target = form.watch("publishTo");
const isAllTargetChecked = publishToList.every((item) =>
target?.includes(item.id)
const isAllTargetChecked = target && publishToList.every((item) =>
target.includes(item.id)
);
const onSubmit = async (data: z.infer<typeof FormSchema>) => {

View File

@ -98,7 +98,6 @@ export default function FilterPage() {
setSearchTitle(title);
setCategoryFilter(category ? category.split("&") : []);
setSortByOpt(sortBy === "popular" ? "clickCount" : "createdAt");
}, [searchParams]);
useEffect(() => {
@ -120,7 +119,7 @@ export default function FilterPage() {
"",
isInt,
pageNumber
);
);
const content = response?.data?.data?.content || [];
const total = response?.data?.data?.totalPages || 1;
@ -437,10 +436,21 @@ export default function FilterPage() {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableContent",
{ defaultValue: "Downloadable ContentS" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -486,10 +486,27 @@ const FilterPage = () => {
<div className="flex flex-col md:flex-row items-start gap-5 py-10 px-4 lg:px-20 bg-[#f7f7f7] dark:bg-black">
<p>
{" "}
Audio {">"} <span className="font-bold">{t("allAudio", { defaultValue: "All Audio" })}</span>
Audio {">"}{" "}
<span className="font-bold">
{t("allAudio", { defaultValue: "All Audio" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableAudio", { defaultValue: "Downloadable Audio" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -529,7 +546,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -547,7 +566,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("searchDate", { defaultValue: "Search Date" })}
placeholderText={t("searchDate", {
defaultValue: "Search Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -707,14 +728,20 @@ const FilterPage = () => {
<div className="w-full pr-4 lg:pr-16 pb-4">
<Reveal>
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })} </h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}{" "}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -502,10 +502,27 @@ const FilterPage = () => {
<div className="flex flex-col md:flex-row items-start gap-5 py-10 px-4 lg:px-20 bg-[#f7f7f7] dark:bg-black">
<p>
{" "}
{t("text", { defaultValue: "Text" })} {">"} <span className="font-bold">{t("allText", { defaultValue: "All Text" })}</span>
{t("text", { defaultValue: "Text" })} {">"}{" "}
<span className="font-bold">
{t("allText", { defaultValue: "All Text" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableText", { defaultValue: "Downloadable Text" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -545,7 +562,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -563,7 +582,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -769,14 +790,20 @@ const FilterPage = () => {
<Reveal>
<div className="flex-1">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -503,10 +503,26 @@ const FilterPage = () => {
<p> {t("image", { defaultValue: "Image" })}</p>
{">"}
<p>
<span className="font-bold">{t("allImage", { defaultValue: "All Image" })}</span>
<span className="font-bold">
{t("allImage", { defaultValue: "All Image" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableImage", { defaultValue: "Downloadable Image" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -542,7 +558,9 @@ const FilterPage = () => {
onKeyDown={handleKeyDown}
type="text"
id="search"
placeholder={t("searchTitle", { defaultValue: "Search Title" })}
placeholder={t("searchTitle", {
defaultValue: "Search Title",
})}
className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
/>
</div>
@ -556,7 +574,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -574,7 +594,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -753,14 +775,20 @@ const FilterPage = () => {
<Reveal>
<div className="w-full">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -499,10 +499,27 @@ const FilterPage = () => {
<p>
{" "}
{t("video", { defaultValue: "Video" })}&nbsp;
{">"} <span className="font-bold">{t("allVideo", { defaultValue: "All Video" })}</span>
{">"}{" "}
<span className="font-bold">
{t("allVideo", { defaultValue: "All Video" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableVideo", { defaultValue: "Downloadable Video" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -542,7 +559,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -560,7 +579,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -766,14 +787,20 @@ const FilterPage = () => {
<Reveal>
<div className="w-full">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -319,7 +319,7 @@ const FilterPage = () => {
}
}
const handleCategoryFilter = (e: boolean, id: string) => {
const handleCategoryFilter = (e: boolean, id: string) => {
let filter = [...categoryFilter];
if (e) {
@ -486,10 +486,27 @@ const FilterPage = () => {
<div className="flex flex-col md:flex-row items-start gap-5 py-10 px-4 lg:px-20 bg-[#f7f7f7] dark:bg-black">
<p>
{" "}
Audio {">"} <span className="font-bold">{t("allAudio", { defaultValue: "All Audio" })}</span>
Audio {">"}{" "}
<span className="font-bold">
{t("allAudio", { defaultValue: "All Audio" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableAudio", { defaultValue: "Downloadable Audio" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -529,7 +546,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -547,7 +566,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("searchDate", { defaultValue: "Search Date" })}
placeholderText={t("searchDate", {
defaultValue: "Search Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -707,14 +728,20 @@ const FilterPage = () => {
<div className="w-full pr-4 lg:pr-16 pb-4">
<Reveal>
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })} </h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}{" "}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -492,10 +492,27 @@ const FilterPage = () => {
<div className="flex flex-row md:flex-row items-start gap-3 py-10 px-4 lg:px-20 bg-[#f7f7f7] dark:bg-black">
<p>
{" "}
{t("text", { defaultValue: "Text" })} {">"} <span className="font-bold">{t("allText", { defaultValue: "All Text" })}</span>
{t("text", { defaultValue: "Text" })} {">"}{" "}
<span className="font-bold">
{t("allText", { defaultValue: "All Text" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableText", { defaultValue: "Downloadable Text" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -535,7 +552,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -553,7 +572,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -759,14 +780,20 @@ const FilterPage = () => {
<Reveal>
<div className="flex-1">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -303,7 +303,7 @@ const FilterPage = () => {
}
}
const handleCategoryFilter = (e: boolean, id: string) => {
const handleCategoryFilter = (e: boolean, id: string) => {
let filter = [...categoryFilter];
if (e) {
@ -469,10 +469,27 @@ const FilterPage = () => {
<div className="flex flex-row md:flex-row items-start gap-3 py-10 px-4 lg:px-20 bg-[#f7f7f7] dark:bg-black">
<p>
{" "}
{t("image", { defaultValue: "Image" })} {">"} <span className="font-bold">{t("allImage", { defaultValue: "All Image" })}</span>
{t("image", { defaultValue: "Image" })} {">"}{" "}
<span className="font-bold">
{t("allImage", { defaultValue: "All Image" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableImage", { defaultValue: "Downloadable Image" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -507,7 +524,9 @@ const FilterPage = () => {
onKeyDown={handleKeyDown}
type="text"
id="search"
placeholder={t("searchTitle", { defaultValue: "Search Title" })}
placeholder={t("searchTitle", {
defaultValue: "Search Title",
})}
className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
/>
</div>
@ -521,7 +540,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -539,7 +560,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -718,14 +741,20 @@ const FilterPage = () => {
<Reveal>
<div className="flex-1">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -487,10 +487,27 @@ const FilterPage = () => {
<p>
{" "}
{t("video", { defaultValue: "Video" })}&nbsp;
{">"} <span className="font-bold">{t("allVideo", { defaultValue: "All Video" })}</span>
{">"}{" "}
<span className="font-bold">
{t("allVideo", { defaultValue: "All Video" })}
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t("downloadableVideo", { defaultValue: "Downloadable Video" })}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}
@ -530,7 +547,9 @@ const FilterPage = () => {
className="mt-1 w-full text-xs border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
onChange={(date) => setMonthYearFilter(date)}
dateFormat="MM | yyyy"
placeholderText={t("selectYear", { defaultValue: "Select Year" })}
placeholderText={t("selectYear", {
defaultValue: "Select Year",
})}
showMonthYearPicker
/>
</div>
@ -548,7 +567,9 @@ const FilterPage = () => {
onChange={(update) => {
setDateRange(update);
}}
placeholderText={t("selectDate", { defaultValue: "Select Date" })}
placeholderText={t("selectDate", {
defaultValue: "Select Date",
})}
onCalendarClose={() => setCalenderState(!calenderState)}
/>
<div className="flex items-center">
@ -754,14 +775,20 @@ const FilterPage = () => {
<Reveal>
<div className="flex-1">
<div className="flex flex-col items-end mb-4">
<h2 className="text-lg font-semibold">{t("sortBy", { defaultValue: "Sort By" })}</h2>
<h2 className="text-lg font-semibold">
{t("sortBy", { defaultValue: "Sort By" })}
</h2>
<select
defaultValue={sortBy == "popular" ? "terpopuler" : "terbaru"}
onChange={(e) => handleSorting(e)}
className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500"
>
<option value="latest">{t("latest", { defaultValue: "Latest" })}</option>
<option value="popular">{t("mostPopular", { defaultValue: "Most Popular" })}</option>
<option value="latest">
{t("latest", { defaultValue: "Latest" })}
</option>
<option value="popular">
{t("mostPopular", { defaultValue: "Most Popular" })}
</option>
</select>
</div>

View File

@ -98,7 +98,6 @@ export default function FilterPage() {
setSearchTitle(title);
setCategoryFilter(category ? category.split("&") : []);
setSortByOpt(sortBy === "popular" ? "clickCount" : "createdAt");
}, [searchParams]);
useEffect(() => {
@ -120,7 +119,7 @@ export default function FilterPage() {
"",
isInt,
pageNumber
);
);
const content = response?.data?.data?.content || [];
const total = response?.data?.data?.totalPages || 1;
@ -437,10 +436,21 @@ export default function FilterPage() {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableContent",
{ defaultValue: "Downloadable ContentS" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -494,10 +494,21 @@ const FilterPage = () => {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableAudio",
{ defaultValue: "Downloadable Audio" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -510,10 +510,21 @@ const FilterPage = () => {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableText",
{ defaultValue: "Downloadable Text" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -516,10 +516,21 @@ const FilterPage = () => {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "Downloadable Image" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
<div className="flex flex-col lg:flex-row gap-6 pl-4 lg:pl-20 py-4">

View File

@ -425,10 +425,22 @@ export default function FilterPage() {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableContent",
{ defaultValue: "Downloadable ContentS" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${
totalContent ?? 0
} ${t("downloadableImage", {
defaultValue: "artikel berisi Foto yang dapat diunduh",
})}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -511,10 +511,21 @@ const FilterPage = () => {
</span>
</p>
<p className="font-bold">|</p>
<p>{`${t("thereIs", { defaultValue: "There Is" })} ${totalContent} ${t(
"downloadableVideo",
{ defaultValue: "Downloadable Video" }
)}`}</p>
{!title ? (
<p>
{`${t("thereIs", { defaultValue: "Terdapat" })} ${totalContent} ${t(
"downloadableImage",
{ defaultValue: "artikel berisi Foto yang dapat diunduh" }
)}`}
</p>
) : (
<>
<p>
{t("search-results", { defaultValue: "Hasil pencarian untuk" })}{" "}
<span className="font-bold">"{title}"</span>
</p>
</>
)}
</div>
{/* Left */}

View File

@ -571,6 +571,7 @@ export default function FormAudioUpdate() {
</div>
<Button
type="button"
size="icon"
color="destructive"
variant="outline"

View File

@ -550,6 +550,7 @@ export default function FormImageUpdate() {
</div>
<Button
type="button"
size="icon"
color="destructive"
variant="outline"

View File

@ -553,6 +553,7 @@ export default function FormTeksUpdate() {
</div>
<Button
type="button"
size="icon"
color="destructive"
variant="outline"

View File

@ -627,6 +627,7 @@ export default function FormVideoUpdate() {
</div>
<Button
type="button"
size="icon"
color="destructive"
variant="outline"

View File

@ -643,7 +643,7 @@
"FilterPage": {
"downloadableContent": "Downloadable Content",
"content": "Content",
"allContent":"All Content",
"allContent": "All Content",
"image": "Image",
"video": "Video",
"text": "Text",
@ -666,7 +666,8 @@
"categories": "Categories",
"sortBy": "Sort by",
"latest": "Latest",
"mostPopular": "Most Popular"
"mostPopular": "Most Popular",
"search-results": "Search Result"
},
"Planning": {
"planning": "Planning",

View File

@ -667,7 +667,8 @@
"categories": "Kategori",
"sortBy": "Urutkan Berdasarkan",
"latest": "Terbaru",
"mostPopular": "Terpopuler"
"mostPopular": "Terpopuler",
"search-results": "Hasil Pencarian"
},
"Planning": {
"planning": "Perencanaan",