lepton/Admin_dash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix RSS time filters and add draggable grid layout

Browse Source 
Normalize pub_date to ISO 8601 on insert so SQLite datetime comparisons
work correctly. Migrate existing RFC 2822 dates. Change 1h filter to 12h.
Add react-grid-layout with persistent drag/resize and reset button.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Shivam Patel
2026-02-09 17:51:06 -05:00
parent 717d52bd9a
commit 4ee365cfc0
13 changed files with 324 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/widgets/GlobeCard.tsx
View File

@@ -155,8 +155,8 @@ export function GlobeCard() {
}, []);
return (
<div className="col-span-1 md:col-span-2 lg:col-span-2 row-span-2 bg-neutral-900 border border-neutral-800 rounded-xl relative overflow-hidden group hover:border-neutral-700 transition-colors">
<div className="absolute top-6 left-6 z-10 pointer-events-none">
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl relative overflow-hidden group hover:border-neutral-700 transition-colors">
<div className="widget-drag-handle absolute top-6 left-6 right-6 z-10">
<div className="flex items-center gap-2 text-neutral-400">
<Globe size={18} />
<span className="text-sm font-medium">Visitor Map</span>

8
components/widgets/NewsFeed.tsx
View File

@@ -150,10 +150,10 @@ function FeedFilterPills({
);
}
type TimeFilter = '1h' | '24h' | '7d' | '30d';
type TimeFilter = '12h' | '24h' | '7d' | '30d';
const TIME_FILTER_OPTIONS: { value: TimeFilter; label: string }[] = [
{ value: '1h', label: '1h' },
{ value: '12h', label: '12h' },
{ value: '24h', label: '24h' },
{ value: '7d', label: '7d' },
{ value: '30d', label: '30d' },
@@ -479,9 +479,9 @@ export function NewsFeed() {
const hasFeeds = feeds.length > 0;
return (
<div className="col-span-1 md:col-span-4 lg:col-span-4 row-span-3 bg-neutral-900 border border-neutral-800 rounded-xl p-5 flex flex-col hover:border-neutral-700 transition-colors overflow-hidden">
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl p-5 flex flex-col hover:border-neutral-700 transition-colors overflow-hidden">
{/* Header */}
<div className="flex items-center justify-between gap-3 shrink-0 mb-3">
<div className="widget-drag-handle flex items-center justify-between gap-3 shrink-0 mb-3">
<div className="flex items-center gap-2 text-neutral-400">
<Rss size={18} />
<span className="text-sm font-medium">Feed</span>

15
components/widgets/UptimeCard.tsx
View File

@@ -3,6 +3,7 @@
import { Activity, RefreshCcw, AlertCircle, X, Plus, Trash2, ExternalLink, ChevronDown, ChevronUp, Pencil, Check } from 'lucide-react';
import { useState, useEffect, useCallback, useRef } from 'react';
import { format, subHours, subDays, subMonths } from 'date-fns';
import { useLayoutContext } from '@/components/dashboard/GridShell';
// --- Types ---
@@ -592,14 +593,20 @@ export function UptimeCard() {
}
};
const rowSpan = expanded ? 'row-span-2' : 'row-span-1';
const { updateWidgetSize } = useLayoutContext();
const [leftLabel, rightLabel] = rangeEdgeLabels(timeRange);
const handleToggleExpand = useCallback(() => {
const next = !expanded;
setExpanded(next);
updateWidgetSize('uptime', 2, next ? 2 : 1);
}, [expanded, updateWidgetSize]);
return (
<>
<div className={`col-span-1 md:col-span-2 lg:col-span-2 ${rowSpan} bg-neutral-900 border border-neutral-800 rounded-xl p-5 flex flex-col hover:border-neutral-700 transition-all duration-300 overflow-hidden`}>
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl p-5 flex flex-col hover:border-neutral-700 transition-all duration-300 overflow-hidden">
{/* Header */}
<div className="flex justify-between items-center shrink-0 mb-3">
<div className="widget-drag-handle flex justify-between items-center shrink-0 mb-3">
<div className="flex items-center gap-2 text-neutral-400">
<Activity size={18} />
<span className="text-sm font-medium">Uptime Monitor</span>
@@ -608,7 +615,7 @@ export function UptimeCard() {
<div className="flex items-center gap-2">
<TimeRangeSelector value={timeRange} onChange={handleTimeRangeChange} />
<button
onClick={() => setExpanded(!expanded)}
onClick={handleToggleExpand}
className="text-neutral-500 hover:text-neutral-300 transition-colors p-1 rounded-lg hover:bg-neutral-800"
title={expanded ? 'Collapse' : 'Expand'}
>

8
components/widgets/WeatherCard.tsx
View File

@@ -59,7 +59,7 @@ export function WeatherCard() {
if (loading) {
return (
<div className="col-span-1 md:col-span-2 lg:col-span-2 row-span-1 bg-neutral-900 border border-neutral-800 rounded-xl p-6 relative overflow-hidden animate-pulse">
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl p-6 relative overflow-hidden animate-pulse">
<div className="h-4 w-24 bg-neutral-800 rounded mb-4" />
<div className="h-10 w-16 bg-neutral-800 rounded" />
</div>
@@ -69,7 +69,7 @@ export function WeatherCard() {
if (!weather?.current) {
// ... error state
return (
<div className="col-span-1 md:col-span-2 lg:col-span-2 row-span-1 bg-neutral-900 border border-neutral-800 rounded-xl p-6 flex items-center justify-center text-red-500">
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl p-6 flex items-center justify-center text-red-500">
Failed to load weather
</div>
);
@@ -79,8 +79,8 @@ export function WeatherCard() {
const today = weather.daily;
return (
<div className="col-span-1 md:col-span-2 lg:col-span-2 row-span-1 bg-neutral-900 border border-neutral-800 rounded-xl p-6 relative overflow-hidden group hover:border-neutral-700 transition-colors">
<div className="flex justify-between items-start mb-2">
<div className="h-full bg-neutral-900 border border-neutral-800 rounded-xl p-6 relative overflow-hidden group hover:border-neutral-700 transition-colors">
<div className="widget-drag-handle flex justify-between items-start mb-2">
<div className="flex items-center gap-2 text-neutral-400">
<Cloud size={18} />
<span className="text-sm font-medium">Local Weather</span>