- Add weather router with OpenWeatherMap integration and 1-hour cache - Add is_starred column to calendar events with countdown widget - Add weather_city setting with Settings page input - Replace people/locations stats with open todos count + weather card - Add quick-add dropdown (event/todo/reminder) to dashboard header - Make CalendarWidget events single-line thin rows - Add rain warnings to smart briefing when chance > 40% - Invalidate dashboard/upcoming queries on form mutations - Migration 004: is_starred + weather_city columns Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
33 lines
1010 B
TypeScript
33 lines
1010 B
TypeScript
import { differenceInCalendarDays } from 'date-fns';
|
|
import { Star } from 'lucide-react';
|
|
|
|
interface CountdownWidgetProps {
|
|
event: {
|
|
id: number;
|
|
title: string;
|
|
start_datetime: string;
|
|
};
|
|
}
|
|
|
|
export default function CountdownWidget({ event }: CountdownWidgetProps) {
|
|
const daysUntil = differenceInCalendarDays(new Date(event.start_datetime), new Date());
|
|
if (daysUntil < 0) return null;
|
|
|
|
const label = daysUntil === 0
|
|
? 'Today'
|
|
: daysUntil === 1
|
|
? '1 day'
|
|
: `${daysUntil} days`;
|
|
|
|
return (
|
|
<div className="flex items-center gap-2.5 px-3.5 py-2.5 rounded-lg bg-amber-500/[0.07] border border-amber-500/10">
|
|
<Star className="h-3.5 w-3.5 text-amber-400 fill-amber-400 shrink-0" />
|
|
<span className="text-sm text-amber-200/90 truncate">
|
|
<span className="font-semibold tabular-nums">{label}</span>
|
|
{daysUntil > 0 ? ' until ' : ' — '}
|
|
<span className="font-medium text-foreground">{event.title}</span>
|
|
</span>
|
|
</div>
|
|
);
|
|
}
|