Fix RSS time filters and add draggable grid layout

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

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'}
>