diff --git a/components/details/details-content.tsx b/components/details/details-content.tsx index 3ff7026..a1b8c51 100644 --- a/components/details/details-content.tsx +++ b/components/details/details-content.tsx @@ -6,6 +6,7 @@ import { getArticleById, getListArticle } from "@/service/article"; import { close, loading } from "@/config/swal"; import { useParams } from "next/navigation"; import Author from "../landing-page/author"; +import { Link2, MailIcon } from "lucide-react"; type TabKey = "trending" | "comments" | "latest"; @@ -366,7 +367,48 @@ export default function DetailContent() { }} /> - + {/* */} +
+

AUTHOR

+
+ {/* Foto Profil */} +
+ Author +
+ + {/* Info Author */} +
+

+ {articleDetail?.createdByName} +

+ +
+ {/* Button lihat semua post */} + + +
+ +
+
+ +
+
+
+
+
Tags: diff --git a/components/table/article-table.tsx b/components/table/article-table.tsx index cfc6718..bcc9342 100644 --- a/components/table/article-table.tsx +++ b/components/table/article-table.tsx @@ -46,7 +46,7 @@ import { TableCell, } from "@/components/ui/table"; import CustomPagination from "../layout/custom-pagination"; -import { $ZodNumberDef } from "zod/v4/core"; +import DatePicker from "react-datepicker"; const columns = [ { name: "No", uid: "no" }, @@ -61,6 +61,7 @@ const columns = [ const columnsOtherRole = [ { name: "No", uid: "no" }, { name: "Judul", uid: "title" }, + { name: "Source", uid: "source" }, { name: "Kategori", uid: "category" }, { name: "Tanggal Unggah", uid: "createdAt" }, { name: "Kreator", uid: "createdByName" }, @@ -85,7 +86,9 @@ export default function ArticleTable() { const [search, setSearch] = useState(""); const [categories, setCategories] = useState([]); const [selectedCategories, setSelectedCategories] = useState(""); - const [startDateValue, setStartDateValue] = useState({ + const [selectedSource, setSelectedSource] = useState(""); + const [selectedStatus, setSelectedStatus] = useState(""); + const [dateRange, setDateRange] = useState({ startDate: null, endDate: null, }); @@ -99,24 +102,49 @@ export default function ArticleTable() { const res = await getArticleByCategory(); const data = res?.data?.data; setCategories(data); + console.log("category", data); } + useEffect(() => { + initState(); + }, [ + page, + showData, + search, + selectedCategories, + selectedSource, + dateRange, + selectedStatus, + ]); + async function initState() { loading(); const req = { limit: showData, page: page, search: search, - categorySlug: Array.from(selectedCategories).join(","), + category: selectedCategories || "", + source: selectedSource || "", + isPublish: + selectedStatus !== "" ? selectedStatus === "publish" : undefined, + startDate: dateRange.startDate + ? new Date(dateRange.startDate).toISOString() + : "", + endDate: dateRange.endDate + ? new Date(dateRange.endDate).toISOString() + : "", sort: "desc", sortBy: "created_at", }; + const res = await getArticlePagination(req); - await getTableNumber(parseInt(showData), res.data?.data); + + let data = res.data?.data || []; + + await getTableNumber(parseInt(showData), data); setTotalPage(res?.data?.meta?.totalPage); close(); } - // panggil ulang setiap state berubah useEffect(() => { initState(); @@ -174,7 +202,7 @@ export default function ArticleTable() { initState(); }; - const copyUrlArticle = async (id: $ZodNumberDef) => { + const copyUrlArticle = async (id: number) => { const url = `${window.location.protocol}//${window.location.host}` + "/detail/" + @@ -347,24 +375,63 @@ export default function ArticleTable() { {categories - ?.filter((category: any) => category.slug != null) + ?.filter((category: any) => category.title != null) .map((category: any) => ( - + {category.title} ))}
- {/*
+
+

Source

+ +
+
+

Status

+ +
+

Tanggal

- setStartDateValue(e)} - inputClassName="z-50 w-full text-sm bg-transparent border-1 border-gray-200 px-2 py-[6px] rounded-xl h-[40px] text-gray-600 dark:text-gray-300" + { + setDateRange({ + startDate: update[0], + endDate: update[1], + }); + }} + isClearable + dateFormat="dd/MM/yyyy" + className="z-50 w-full text-sm bg-transparent border border-gray-200 px-2 py-[6px] rounded-xl h-[40px] text-gray-600 dark:text-gray-300" + placeholderText="Pilih rentang tanggal" /> -
*/} +
diff --git a/public/profile.jpg b/public/profile.jpg new file mode 100644 index 0000000..354bbe1 Binary files /dev/null and b/public/profile.jpg differ diff --git a/service/article.ts b/service/article.ts index 8faddf4..5a4c803 100644 --- a/service/article.ts +++ b/service/article.ts @@ -1,6 +1,11 @@ import { PaginationRequest } from "@/types/globals"; import { httpGet } from "./http-config/http-base-services"; -import { httpDeleteInterceptor, httpGetInterceptor, httpPostInterceptor, httpPutInterceptor } from "./http-config/http-interceptor-services"; +import { + httpDeleteInterceptor, + httpGetInterceptor, + httpPostInterceptor, + httpPutInterceptor, +} from "./http-config/http-interceptor-services"; export async function getListArticle(props: PaginationRequest) { const { @@ -40,13 +45,20 @@ export async function getArticlePagination(props: PaginationRequest) { sort, categorySlug, isBanner, + isPublish, + source, } = props; + return await httpGetInterceptor( - `/articles?limit=${limit}&page=${page}&title=${search}&startDate=${startDate || ""}&endDate=${ - endDate || "" - }&categoryId=${category || ""}&sortBy=${sortBy || "created_at"}&sort=${ - sort || "asc" - }&category=${categorySlug || ""}&isBanner=${isBanner || ""}` + `/articles?limit=${limit}&page=${page}&title=${search}&startDate=${ + startDate || "" + }&endDate=${endDate || ""}&categoryId=${category || ""}&source=${ + source || "" + }&isPublish=${isPublish !== undefined ? isPublish : ""}&sortBy=${ + sortBy || "created_at" + }&sort=${sort || "asc"}&category=${categorySlug || ""}&isBanner=${ + isBanner || "" + }` ); } diff --git a/types/globals.tsx b/types/globals.tsx index df33f2b..42a9bdc 100644 --- a/types/globals.tsx +++ b/types/globals.tsx @@ -310,6 +310,7 @@ export type PaginationRequest = { category?: string; sortBy?: string; sort?: string; + source?: string; categorySlug?: string; isBanner?: boolean; };