78 lines
2.8 KiB
TypeScript
78 lines
2.8 KiB
TypeScript
import * as React from "react";
|
|
import { XMLParser } from "fast-xml-parser";
|
|
import * as styles from "../styles/containers/News.module.css"
|
|
import type { News as NewsType, PostillonNews } from "../lib/interfaces";
|
|
|
|
const NEWS_REFRESH_INTERVAL = 15 * 60 * 1000;
|
|
|
|
const News = () => {
|
|
const [news, setNews] = React.useState<JSX.Element[]>([])
|
|
|
|
const processNews = (news: NewsType[], postillon: PostillonNews[]) => {
|
|
const newsTable: JSX.Element[] = []
|
|
|
|
let i = 0;
|
|
for (const n of news) {
|
|
if (!n.title || n.title === "") continue;
|
|
|
|
const updated = new Date(n.updated);
|
|
newsTable.push(
|
|
<tr key={++i}>
|
|
<td>{n.title}</td>
|
|
<td>{updated.getHours()}:{updated.getMinutes().toString().padStart(2, "0")}</td>
|
|
</tr>
|
|
);
|
|
}
|
|
|
|
const toUsePostillon = postillon.filter((news) => !news.categories.includes("Sonntagsfrage") && !news.categories.includes("Newsticker") && !news.categories.includes("Ratgeber") && !news.categories.includes("PamS") && !news.categories.includes("Leserbriefe") && !news.categories.includes("Podcast"));
|
|
toUsePostillon.forEach((n, index) => {
|
|
if (index > 2) return;
|
|
const randTablePos = Math.floor(Math.random() * newsTable.length);
|
|
const updated = new Date(n.pubDate);
|
|
newsTable.splice(randTablePos, 0,
|
|
<tr key={n.title}>
|
|
<td>{n.title}</td>
|
|
<td>{updated.getHours()}:{updated.getMinutes().toString().padStart(2, "0")}</td>
|
|
</tr>
|
|
)
|
|
})
|
|
|
|
setNews([...newsTable]);
|
|
}
|
|
|
|
const pullNews = async () => {
|
|
const xml = new XMLParser();
|
|
const response = await fetch("https://www.tagesschau.de/xml/atom/");
|
|
const feed: { title: string; updated: string; }[] = xml.parse(await response.text()).feed.entry;
|
|
|
|
// Feedburner does not allow cors but at least we get JSON
|
|
const postResponse = await fetch("https://api.rss2json.com/v1/api.json?rss_url=https%3A%2F%2Ffeeds.feedburner.com%2Fblogspot%2FrkEL");
|
|
const data = await postResponse.json()
|
|
|
|
processNews(feed, data.items);
|
|
}
|
|
|
|
React.useEffect(() => {
|
|
pullNews()
|
|
const newsInterval = setInterval(pullNews, NEWS_REFRESH_INTERVAL);
|
|
|
|
return () => clearInterval(newsInterval);
|
|
}, [])
|
|
|
|
return <div className={`container ${styles.container}`}>
|
|
<div className={styles.inner}>
|
|
<table>
|
|
<tbody>
|
|
{news}
|
|
</tbody>
|
|
</table>
|
|
<table>
|
|
<tbody>
|
|
{news}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
export default News; |