Merge branch 'main' of https://gitlab.com/hanifsalafi/mediahub_redesign into prod
This commit is contained in:
commit
7d9f23896e
|
|
@ -76,9 +76,6 @@ export default function EditUserForm() {
|
|||
},
|
||||
});
|
||||
|
||||
const passwordVal = form.watch("password");
|
||||
const confPasswordVal = form.watch("confirmPassword");
|
||||
|
||||
useEffect(() => {
|
||||
initData();
|
||||
}, []);
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -191,8 +191,6 @@ export default function DetailUserForm() {
|
|||
},
|
||||
});
|
||||
|
||||
const passwordVal = form.watch("password");
|
||||
const confPasswordVal = form.watch("confirmPassword");
|
||||
const selectedRole = form.watch("role");
|
||||
|
||||
useEffect(() => {
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -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({
|
||||
|
|
|
|||
|
|
@ -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(() => {
|
||||
|
|
|
|||
|
|
@ -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[]) => {
|
||||
|
|
|
|||
|
|
@ -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>) => {
|
||||
|
|
|
|||
|
|
@ -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))
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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}`}
|
||||
|
|
|
|||
|
|
@ -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}`}
|
||||
|
|
|
|||
|
|
@ -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}`}
|
||||
|
|
|
|||
|
|
@ -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}`}
|
||||
|
|
|
|||
|
|
@ -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}`}
|
||||
|
|
|
|||
|
|
@ -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
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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>) => {
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -499,10 +499,27 @@ const FilterPage = () => {
|
|||
<p>
|
||||
{" "}
|
||||
{t("video", { defaultValue: "Video" })}
|
||||
{">"} <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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -487,10 +487,27 @@ const FilterPage = () => {
|
|||
<p>
|
||||
{" "}
|
||||
{t("video", { defaultValue: "Video" })}
|
||||
{">"} <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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -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 */}
|
||||
|
|
|
|||
|
|
@ -571,6 +571,7 @@ export default function FormAudioUpdate() {
|
|||
</div>
|
||||
|
||||
<Button
|
||||
type="button"
|
||||
size="icon"
|
||||
color="destructive"
|
||||
variant="outline"
|
||||
|
|
|
|||
|
|
@ -550,6 +550,7 @@ export default function FormImageUpdate() {
|
|||
</div>
|
||||
|
||||
<Button
|
||||
type="button"
|
||||
size="icon"
|
||||
color="destructive"
|
||||
variant="outline"
|
||||
|
|
|
|||
|
|
@ -553,6 +553,7 @@ export default function FormTeksUpdate() {
|
|||
</div>
|
||||
|
||||
<Button
|
||||
type="button"
|
||||
size="icon"
|
||||
color="destructive"
|
||||
variant="outline"
|
||||
|
|
|
|||
|
|
@ -627,6 +627,7 @@ export default function FormVideoUpdate() {
|
|||
</div>
|
||||
|
||||
<Button
|
||||
type="button"
|
||||
size="icon"
|
||||
color="destructive"
|
||||
variant="outline"
|
||||
|
|
|
|||
|
|
@ -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",
|
||||
|
|
|
|||
|
|
@ -667,7 +667,8 @@
|
|||
"categories": "Kategori",
|
||||
"sortBy": "Urutkan Berdasarkan",
|
||||
"latest": "Terbaru",
|
||||
"mostPopular": "Terpopuler"
|
||||
"mostPopular": "Terpopuler",
|
||||
"search-results": "Hasil Pencarian"
|
||||
},
|
||||
"Planning": {
|
||||
"planning": "Perencanaan",
|
||||
|
|
|
|||
Loading…
Reference in New Issue