fix: iklan admin

This commit is contained in:
Sabda Yagra 2025-08-05 12:25:43 +07:00
parent ab8f0c1086
commit 4508f5db37
2 changed files with 116 additions and 13 deletions

View File

@ -1,9 +1,16 @@
import { Select, SelectTrigger, SelectValue, SelectContent, SelectGroup, SelectItem } from "@radix-ui/react-select";
import {
Select,
SelectTrigger,
SelectValue,
SelectContent,
SelectGroup,
SelectItem,
} from "@radix-ui/react-select";
import { Icon } from "lucide-react";
import { useTranslations } from "next-intl";
import { useRouter } from "next/navigation";
import router from "next/router";
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import ScrollableContent from "./search-section-new";
import NewContent from "./new-content";
import ContentCategory from "./content-category";
@ -13,6 +20,14 @@ import UserSurveyBox from "./survey-box";
import ScrollableContentPolda from "./scrollable-content-polda";
import AdvertisementPlacements from "./advertisement-placements";
import { useTheme } from "next-themes";
import { listDataAdvertisements } from "@/service/broadcast/broadcast";
interface Advertisement {
id: string;
placements: string;
imageUrl: string;
[key: string]: any;
}
const SearchSectionPolda = () => {
const [contentType, setContentType] = useState("all");
@ -20,6 +35,31 @@ const SearchSectionPolda = () => {
const router = useRouter();
const t = useTranslations("LandingPage");
const { theme } = useTheme();
const [ads, setAds] = useState<Advertisement[]>([]);
const [loading, setLoading] = useState<boolean>(false);
const fetchData = async () => {
try {
setLoading(true);
const res = await listDataAdvertisements(0, "4", "");
const data = res?.data?.data;
const contentData = data?.content;
setAds(contentData);
// if (props.placement == "left") {
// setAds(contentData.slice(0, 2));
// } else {
// setAds(contentData.slice(2));
// }
} catch (error) {
console.error("Error fetching advertisements:", error);
} finally {
setLoading(false);
}
};
useEffect(() => {
fetchData();
}, []);
// Determine background image based on theme
const getBackgroundImage = () => {
@ -31,9 +71,16 @@ const SearchSectionPolda = () => {
};
return (
<div className="flex w-full min-h-screen bg-center bg-cover bg-no-repeat" style={{ backgroundImage: getBackgroundImage() }}>
<div
className="flex w-full min-h-screen bg-center bg-cover bg-no-repeat"
style={{ backgroundImage: getBackgroundImage() }}
>
<div className="hidden xl:block w-[15%] pr-4 py-5 sticky top-[150px] space-y-4 self-start">
<AdvertisementPlacements placement="left"/>
<AdvertisementPlacements
placement="left"
data={ads}
loading={loading}
/>
</div>
<div className="w-full xl:w-[70%] px-4 py-8 bg-white dark:bg-black">
@ -47,7 +94,11 @@ const SearchSectionPolda = () => {
</div>
<div className="hidden xl:block w-[15%] pl-4 py-5 sticky top-[150px] space-y-4 self-start">
<AdvertisementPlacements placement="right"/>
<AdvertisementPlacements
placement="right"
data={ads}
loading={loading}
/>
</div>
</div>
);

View File

@ -1,9 +1,16 @@
import { Select, SelectTrigger, SelectValue, SelectContent, SelectGroup, SelectItem } from "@radix-ui/react-select";
import {
Select,
SelectTrigger,
SelectValue,
SelectContent,
SelectGroup,
SelectItem,
} from "@radix-ui/react-select";
import { Icon } from "lucide-react";
import { useTranslations } from "next-intl";
import { useRouter } from "next/navigation";
import router from "next/router";
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import ScrollableContent from "./search-section-new";
import NewContent from "./new-content";
import ContentCategory from "./content-category";
@ -14,6 +21,14 @@ import ScrollableContentPolda from "./scrollable-content-polda";
import ScrollableContentSatker from "./scrollable-content-satker";
import AdvertisementPlacements from "./advertisement-placements";
import { useTheme } from "next-themes";
import { listDataAdvertisements } from "@/service/broadcast/broadcast";
interface Advertisement {
id: string;
placements: string;
imageUrl: string;
[key: string]: any;
}
const SearchSectionSatker = () => {
const [contentType, setContentType] = useState("all");
@ -23,6 +38,32 @@ const SearchSectionSatker = () => {
const { theme } = useTheme();
const [ads, setAds] = useState<Advertisement[]>([]);
const [loading, setLoading] = useState<boolean>(false);
const fetchData = async () => {
try {
setLoading(true);
const res = await listDataAdvertisements(0, "4", "");
const data = res?.data?.data;
const contentData = data?.content;
setAds(contentData);
// if (props.placement == "left") {
// setAds(contentData.slice(0, 2));
// } else {
// setAds(contentData.slice(2));
// }
} catch (error) {
console.error("Error fetching advertisements:", error);
} finally {
setLoading(false);
}
};
useEffect(() => {
fetchData();
}, []);
// Determine background image based on theme
const getBackgroundImage = () => {
if (theme === "dark") {
@ -33,9 +74,16 @@ const SearchSectionSatker = () => {
};
return (
<div className="flex w-full min-h-screen bg-center bg-cover bg-no-repeat" style={{ backgroundImage: getBackgroundImage() }}>
<div
className="flex w-full min-h-screen bg-center bg-cover bg-no-repeat"
style={{ backgroundImage: getBackgroundImage() }}
>
<div className="hidden xl:block w-[15%] pr-4 py-5 sticky top-[150px] space-y-4 self-start">
<AdvertisementPlacements placement="left"/>
<AdvertisementPlacements
placement="left"
data={ads}
loading={loading}
/>
</div>
<div className="w-full xl:w-[70%] px-4 py-8 bg-white dark:bg-black">
@ -49,7 +97,11 @@ const SearchSectionSatker = () => {
</div>
<div className="hidden xl:block w-[15%] pl-4 py-5 sticky top-[150px] space-y-4 self-start">
<AdvertisementPlacements placement="right"/>
<AdvertisementPlacements
placement="right"
data={ads}
loading={loading}
/>
</div>
</div>
);