HTML 77.2%
TypeScript 10.5%
Python 9.6%
JavaScript 2.5%
1'use client';2import { usePathname, useRouter, useSearchParams } from 'next/navigation';3import { useState } from 'react';45/**6 * "As of" date picker for the History tab. Writes `?tab=history&asof=YYYY-MM-DD` (keeping other params) so the7 * server renders the entity's attributes as known at that date (`GET /entities/{slug}/asof`).8 */9export function AsOfPicker({ value }: { value?: string }) {10 const router = useRouter();11 const pathname = usePathname();12 const sp = useSearchParams();13 const [date, setDate] = useState(value ?? '');14 const today = new Date().toISOString().slice(0, 10);1516 const go = (d: string | null) => {17 const next = new URLSearchParams(sp.toString());18 next.set('tab', 'history');19 if (d) next.set('asof', d);20 else next.delete('asof');21 router.replace(`${pathname}?${next.toString()}`, { scroll: false });22 };2324 return (25 <form26 className="flex flex-wrap items-end gap-2"27 onSubmit={(e) => {28 e.preventDefault();29 if (date) go(date);30 }}31 >32 <label className="block min-w-0">33 <span className="eyebrow block pb-1">As of date (UTC)</span>34 <input type="date" name="asof" value={date} max={today} onChange={(e) => setDate(e.target.value)} className="h-11 w-full min-w-[11rem] border border-rule bg-surface px-2.5 text-sm text-ink focus:border-accent focus:outline-none" />35 </label>36 <button type="submit" disabled={!date} className="inline-flex h-11 items-center bg-ink px-3 text-sm font-medium text-canvas hover:opacity-90 disabled:opacity-40">37 View as of38 </button>39 {value && (40 <button41 type="button"42 onClick={() => {43 setDate('');44 go(null);45 }}46 className="inline-flex h-11 items-center border border-rule px-3 text-sm text-ink-2 hover:text-ink"47 >48 Back to today49 </button>50 )}51 </form>52 );53}54