From ccc708ac231b25a84b17024645248f7920636544 Mon Sep 17 00:00:00 2001 From: Anang Yusman Date: Mon, 29 Sep 2025 14:08:32 +0800 Subject: [PATCH] update --- app/category/popular-news/page.tsx | 13 +- app/detail/[id]/page.tsx | 19 + components/details/details-content.tsx | 430 ++++++++++-------- components/editor/basic-editor.js | Bin 0 -> 64 bytes components/editor/custom-editor.js | 188 ++++++-- components/editor/editor-example.tsx | 164 +++++++ components/editor/editor-test.tsx | 176 +++++++ components/editor/fixed-editor.js | Bin 0 -> 9796 bytes components/editor/form-editor.js | 102 +++++ components/editor/minimal-editor.js | 81 ++++ components/editor/optimized-editor.tsx | 105 +++++ components/editor/readonly-editor.js | 136 ++++++ components/editor/simple-editor.js | 95 ++++ components/editor/simple-readonly-editor.js | 109 +++++ components/editor/stable-editor.js | 93 ++++ components/editor/static-editor.js | 93 ++++ components/editor/strict-readonly-editor.js | 113 +++++ components/editor/tinymce-editor.tsx | 309 +++++++++++++ components/editor/view-editor.js | 262 ++++++++++- .../form/article/create-article-form.tsx | 70 +-- components/form/article/edit-article-form.tsx | 27 +- .../generate-ai-content-rewrite-form.tsx | 56 ++- .../form/article/generate-ai-single-form.tsx | 6 +- components/landing-page/banner-news.tsx | 57 +-- components/landing-page/breaking-news.tsx | 77 ++-- components/landing-page/headers.tsx | 125 ++--- components/landing-page/latest-news.tsx | 71 +-- components/landing-page/news.tsx | 72 +-- components/table/article-table.tsx | 10 +- package-lock.json | 229 +++++----- package.json | 19 +- 31 files changed, 2686 insertions(+), 621 deletions(-) create mode 100644 app/detail/[id]/page.tsx create mode 100644 components/editor/basic-editor.js create mode 100644 components/editor/editor-example.tsx create mode 100644 components/editor/editor-test.tsx create mode 100644 components/editor/fixed-editor.js create mode 100644 components/editor/form-editor.js create mode 100644 components/editor/minimal-editor.js create mode 100644 components/editor/optimized-editor.tsx create mode 100644 components/editor/readonly-editor.js create mode 100644 components/editor/simple-editor.js create mode 100644 components/editor/simple-readonly-editor.js create mode 100644 components/editor/stable-editor.js create mode 100644 components/editor/static-editor.js create mode 100644 components/editor/strict-readonly-editor.js create mode 100644 components/editor/tinymce-editor.tsx diff --git a/app/category/popular-news/page.tsx b/app/category/popular-news/page.tsx index 4efe75e..3e97694 100644 --- a/app/category/popular-news/page.tsx +++ b/app/category/popular-news/page.tsx @@ -1,14 +1,19 @@ +import BannerNews from "@/components/landing-page/banner-news"; import Footer from "@/components/landing-page/footer"; -import HeaderPopular from "@/components/landing-page/headers-popular"; -import Navbar from "@/components/landing-page/navbar"; +import HeaderLatest from "@/components/landing-page/headers-latest"; +import LatestNews from "@/components/landing-page/latest-news"; -export default function PopularPage() { +import Navbar from "@/components/landing-page/navbar"; +import News from "@/components/landing-page/news"; + +export default function LatestPage() { return (
- + +
diff --git a/app/detail/[id]/page.tsx b/app/detail/[id]/page.tsx new file mode 100644 index 0000000..6aba50d --- /dev/null +++ b/app/detail/[id]/page.tsx @@ -0,0 +1,19 @@ +import DetailContent from "@/components/details/details-content"; +import Footer from "@/components/landing-page/footer"; +import Navbar from "@/components/landing-page/navbar"; +import Image from "next/image"; + +export default function Home() { + return ( +
+
+ +
+ +
+ +
+
+
+ ); +} diff --git a/components/details/details-content.tsx b/components/details/details-content.tsx index bf0a483..523d47a 100644 --- a/components/details/details-content.tsx +++ b/components/details/details-content.tsx @@ -5,7 +5,6 @@ import Link from "next/link"; import { getArticleById, getListArticle } from "@/service/article"; import { close, loading } from "@/config/swal"; import { useParams } from "next/navigation"; -import { CommentIcon } from "../icons/sidebar-icon"; type TabKey = "trending" | "comments" | "latest"; @@ -40,9 +39,9 @@ export default function DetailContent() { const [articles, setArticles] = useState([]); const [articleDetail, setArticleDetail] = useState(null); const [showData, setShowData] = useState("5"); - const [search, setSearch] = useState(""); + const [search, setSearch] = useState("-"); const [listCategory, setListCategory] = useState([]); - const [selectedCategories, setSelectedCategories] = useState(""); + const [selectedCategories, setSelectedCategories] = useState("-"); const [startDateValue, setStartDateValue] = useState({ startDate: null, endDate: null, @@ -56,6 +55,8 @@ export default function DetailContent() { null ); + const [selectedIndex, setSelectedIndex] = useState(0); + const [tabArticles, setTabArticles] = useState([]); const [activeTab, setActiveTab] = useState("trending"); @@ -67,29 +68,46 @@ export default function DetailContent() { ]; useEffect(() => { - initState(); - }, [page, showData, startDateValue, selectedCategories]); + fetchTabArticles(); + }, [activeTab]); - async function initState() { - // loading(); - const req = { + async function fetchTabArticles() { + const req: any = { limit: showData, page, search, categorySlug: Array.from(selectedCategories).join(","), sort: "desc", - isPublish: true, sortBy: "created_at", }; + // Sesuaikan sortBy berdasarkan tab + if (activeTab === "trending") { + req.sortBy = "view_count"; + } else if (activeTab === "comments") { + req.sortBy = "comment_count"; + } else { + req.sortBy = "created_at"; + } + + // Hanya kirimkan search jika valid + if (search && search !== "-" && search !== "") { + req.search = search; + } + + if (selectedCategories && selectedCategories !== "-") { + req.categorySlug = selectedCategories; + } + try { const res = await getListArticle(req); - setArticles(res?.data?.data || []); - setTotalPage(res?.data?.meta?.totalPage || 1); - } finally { - // close(); + setTabArticles(res?.data?.data || []); + } catch (error) { + console.error("Failed fetching tab articles:", error); + setTabArticles([]); // Optional fallback } } + const content: Record< TabKey, { image: string; title: string; date: string }[] @@ -135,6 +153,31 @@ export default function DetailContent() { ], }; + useEffect(() => { + initState(); + }, [page, showData]); + + async function initState() { + // loading(); + const req = { + limit: showData, + page: 1, + search: "", + categorySlug: "", + sort: "desc", + isPublish: true, + sortBy: "created_at", + }; + + try { + const res = await getListArticle(req); + setArticles(res?.data?.data || []); + setTotalPage(res?.data?.meta?.totalPage || 1); + } finally { + // close(); + } + } + useEffect(() => { initStateData(); }, [listCategory]); @@ -147,10 +190,18 @@ export default function DetailContent() { setThumbnail(data?.thumbnailUrl); setDiseId(data?.aiArticleId); setDetailFiles(data?.files); - setArticleDetail(data); // <-- Add this + setArticleDetail(data); close(); } + if (!articleDetail?.files || articleDetail.files.length === 0) { + return ( +
+

Gambar tidak tersedia

+
+ ); + } + return ( <>
@@ -159,76 +210,89 @@ export default function DetailContent() {

{articleDetail?.title}

-
-
-
- +
+ + - - - - - -
+ + + + +
- - {articleDetail?.createdByName} - - - + + {articleDetail?.createdByName} + + • + - - {new Date(articleDetail?.createdAt).toLocaleDateString( - "id-ID", - { - day: "numeric", - month: "long", - year: "numeric", - } - )} - + {new Date(articleDetail?.createdAt).toLocaleDateString( + "id-ID", + { + day: "numeric", + month: "long", + year: "numeric", + } + )} - in - {articleDetail?.categories?.[0]?.title} -
-
- 0 -
+ + • + {articleDetail?.categories?.[0]?.title}
- {articleDetail?.files?.[0]?.fileUrl ? ( + {/* Gambar utama */} +
Berita - ) : ( -
-

Gambar tidak tersedia

-
- )} +
-
-
-

0

-

SHARES

-
-
-

3

-

VIEWS

-
+ {/* Thumbnail */} +
+ {articleDetail.files.map((file: any, index: number) => ( + + ))} +
+ + {/* Slug */} +

+ {articleDetail?.slug} +

+
+
+
- - - - - - - - - - + - - - - - - - - +
-

- {articleDetail?.slug} -

-
-
-

- {/* - Mikulnews.com - - */} - - {articleDetail?.description} -

- +
+
+
+ {/* */}
Tags: @@ -362,19 +382,12 @@ export default function DetailContent() {
-
- Berita Utama -
+

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib - ditandai * + ditandai *

@@ -383,11 +396,11 @@ export default function DetailContent() { htmlFor="komentar" className="block text-sm font-medium mb-1" > - Komentar * + Komentar *