alma/NeahFront7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

widget news fetch 5

Browse Source
This commit is contained in:
Alma 2025-04-13 22:44:11 +02:00
parent f099cf0d6c
commit 61e5ccadd2
1 changed files with 38 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
components/news.tsx
View File

@ -25,6 +25,8 @@ interface NewsItem {
}
export function News() {
console.log('[News] Component mounting...');
const [news, setNews] = useState<NewsItem[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
@ -32,21 +34,40 @@ export function News() {
const [dbStatus, setDbStatus] = useState<'connecting' | 'connected' | 'error'>('connecting');
// Debug info display component
const DebugInfo = () => (
<div className="text-xs text-gray-500 mt-2 p-2 bg-gray-100 rounded">
<p>Status: {dbStatus}</p>
<p>Loading: {loading ? 'true' : 'false'}</p>
<p>Error: {error || 'none'}</p>
<p>News items: {news.length}</p>
</div>
);
const DebugInfo = () => {
console.log('[News] Current state:', {
newsCount: news.length,
loading,
error,
dbStatus,
newsItems: news
});
return (
<div className="text-xs text-gray-500 mt-2 p-2 bg-gray-100 rounded">
<p>Status: {dbStatus}</p>
<p>Loading: {loading ? 'true' : 'false'}</p>
<p>Error: {error || 'none'}</p>
<p>News items: {news.length}</p>
<details>
<summary>Debug Details</summary>
<pre className="mt-2 text-[10px] whitespace-pre-wrap">
{JSON.stringify(news, null, 2)}
</pre>
</details>
</div>
);
};
const fetchNews = async (isRefresh = false) => {
console.log('[News] Fetching news, isRefresh:', isRefresh);
if (isRefresh) setRefreshing(true);
setLoading(true);
setDbStatus('connecting');
try {
console.log('[News] Making API request to /api/news');
const response = await fetch('/api/news', {
method: 'GET',
headers: {
@ -54,20 +75,25 @@ export function News() {
},
});
console.log('[News] API response status:', response.status);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
console.log('[News] API response data:', data);
if (data.error) {
throw new Error(data.error);
}
console.log('[News] Setting news items:', data.news);
setNews(data.news || []);
setError(null);
setDbStatus('connected');
} catch (err) {
console.error('[News] Error fetching news:', err);
const errorMessage = err instanceof Error ? err.message : 'Failed to load news';
setError(errorMessage);
setDbStatus('error');
@ -79,7 +105,11 @@ export function News() {
};
useEffect(() => {
console.log('[News] Running useEffect...');
fetchNews();
return () => {
console.log('[News] Component unmounting...');
};
}, []);
if (loading && !refreshing) {