mediahub-fe/components/landing-page/news-ticker.tsx

99 lines
4.0 KiB
TypeScript

// import { listCarousel } from '@/service/landing/landing';
// import React, { useEffect, useRef, useState } from 'react'
// import NewsTicker from "react-advanced-news-ticker";
// const NewsTicker = () => {
// const [content, setContent] = useState([]);
// const newsTickerRef = useRef<any>(null);
// useEffect(() => {
// async function fetchCarouselData() {
// try {
// const response = await listCarousel();
// setContent(response.data?.data || []);
// console.log('Carousel data:', response.data?.data);
// } catch (error) {
// console.error('Error fetching carousel data:', error);
// }
// }
// fetchCarouselData();
// }, []);
// function formatDateIndonesianWithTime(dateString: any) {
// const options: any = {
// year: 'numeric',
// month: 'long',
// day: 'numeric',
// hour: 'numeric',
// minute: 'numeric'
// };
// const formattedDate = new Date(dateString).toLocaleDateString('id-ID', options);
// return formattedDate.replace('pukul', '-');
// }
// const dummyNews = Array.from({ length: 10 }, (_, index) => ({
// id: index + 1,
// title: `Berita ${index + 1}`,
// name: `Penulis ${index + 1}`,
// }));
// return (
// <section className='section-news fixed-bottom'>
// <div className='breaking-news pt-3 pl-3' >
// Breaking News
// </div>
// <div className='news pt-3'>
// {content.length > 0 ?
// (
// <NewsTicker maxRows={1}
// rowHeight={45}
// duration={4000}
// ref={newsTickerRef}
// autoStart={true}
// style={{ listStyleType: "none" }}
// >
// {content.map((item: any) => (
// <>
// <div key={item.id} className="news-item">
// <a style={{ color: "black" }}
// href={
// Number(item.fileType?.id) == 1
// ? `/image/detail/${item.slug}`
// : Number(item.fileType?.id) == 2
// ? `/video/detail/${item.slug}`
// : Number(item.fileType?.id) == 3
// ? `/document/detail/${item.slug}`
// : `/audio/detail/${item.slug}`
// }
// >
// {item.title}.
// </a>
// </div>
// <div>
// {formatDateIndonesianWithTime(item.createdAt)}
// </div>
// </>
// ))}
// </NewsTicker>
// ) : (
// <p className='pl-4'>Loading...</p> // Tampilkan pesan "Loading..." saat data belum tersedia.
// )}
// </div>
// <div className='navigation pr-0 mr-0'>
// <button className="arrow-button left" onClick={() => { newsTickerRef?.current?.moveDown() }}>&#9664;</button>
// <button className="arrow-button right" onClick={() => { newsTickerRef?.current?.moveUp() }}>&#9654;</button>
// </div>
// </section>
// )
// }
// export default NewsTicker