feat: v1.0.0 — UX polish, security hardening, code quality
UI/UX: - Bill detail page tab UI (Analysis / Timeline / Votes / Notes) - Topic tag pills on bill detail and listing pages — filtered to known topics, clickable, properly labelled via shared lib/topics.ts - Notes panel always-open in Notes tab; sign-in prompt for guests - Collapsible sidebar with icon-only mode and localStorage persistence - Bills page defaults to has-text filter enabled - Follow mode dropdown transparency fix - Favicon (Landmark icon, blue background) Security: - Fernet encryption for ntfy passwords at rest (app/core/crypto.py) - Separate ENCRYPTION_SECRET_KEY env var; falls back to JWT derivation - ntfy_password no longer returned in GET response — replaced with ntfy_password_set: bool; NotificationSettingsUpdate type for writes - JWT_SECRET_KEY fail-fast on startup if using default placeholder - get_optional_user catches (JWTError, ValueError) only, not Exception Bug fixes & code quality: - Dashboard N+1 topic query replaced with single OR query - notification_utils.py topic follower N+1 replaced with batch query - Note query in bill detail page gated on token (enabled: !!token) - search.py max_length=500 guard against oversized queries - CollectionCreate.validate_name wired up with @field_validator - LLM_RATE_LIMIT_RPM default raised from 10 to 50 Authored by: Jack Levy
This commit is contained in:
Jack Levy
@@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { AlertTriangle, CheckCircle, Clock, Cpu, ExternalLink, Tag } from "lucide-react";
|
||||
import { AlertTriangle, CheckCircle, Clock, Cpu, ExternalLink } from "lucide-react";
|
||||
import { BriefSchema, CitedPoint } from "@/lib/types";
|
||||
import { formatDate } from "@/lib/utils";
|
||||
|
||||
@@ -30,28 +30,32 @@ function CitedItem({ point, icon, govinfo_url, openKey, activeKey, setActiveKey
|
||||
<li className="text-sm">
|
||||
<div className="flex items-start gap-2">
|
||||
<span className="mt-0.5 shrink-0">{icon}</span>
|
||||
<span className="flex-1">{cited ? point.text : point}</span>
|
||||
{cited && point.label === "inference" && (
|
||||
<span
|
||||
title="This point is an analytical interpretation, not a literal statement from the bill text"
|
||||
className="shrink-0 text-[10px] px-1.5 py-0.5 rounded border border-border text-muted-foreground font-sans leading-none"
|
||||
>
|
||||
Inferred
|
||||
</span>
|
||||
)}
|
||||
{cited && (
|
||||
<button
|
||||
onClick={() => setActiveKey(isOpen ? null : openKey)}
|
||||
title={isOpen ? "Hide source" : "View source"}
|
||||
className={`shrink-0 text-xs px-1.5 py-0.5 rounded font-mono transition-colors ${
|
||||
isOpen
|
||||
? "bg-primary text-primary-foreground"
|
||||
: "bg-muted text-muted-foreground hover:bg-accent hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
§ {point.citation}
|
||||
</button>
|
||||
)}
|
||||
<div className="flex-1 min-w-0 space-y-1">
|
||||
<div className="flex items-start gap-2">
|
||||
<span className="flex-1">{cited ? point.text : point}</span>
|
||||
{cited && point.label === "inference" && (
|
||||
<span
|
||||
title="This point is an analytical interpretation, not a literal statement from the bill text"
|
||||
className="shrink-0 text-[10px] px-1.5 py-0.5 rounded border border-border text-muted-foreground font-sans leading-none mt-0.5"
|
||||
>
|
||||
Inferred
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{cited && (
|
||||
<button
|
||||
onClick={() => setActiveKey(isOpen ? null : openKey)}
|
||||
title={isOpen ? "Hide source" : "View source"}
|
||||
className={`text-left text-xs px-1.5 py-0.5 rounded font-mono leading-snug transition-colors ${
|
||||
isOpen
|
||||
? "bg-primary text-primary-foreground"
|
||||
: "bg-muted text-muted-foreground hover:bg-accent hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
§ {point.citation}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{cited && isOpen && (
|
||||
<div className="mt-2 ml-5 rounded-md border border-border bg-muted/40 p-3 space-y-2">
|
||||
@@ -165,19 +169,6 @@ export function AIBriefCard({ brief }: AIBriefCardProps) {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{brief.topic_tags && brief.topic_tags.length > 0 && (
|
||||
<div className="flex items-center gap-2 pt-1 border-t border-border flex-wrap">
|
||||
<Tag className="w-3.5 h-3.5 text-muted-foreground shrink-0" />
|
||||
{brief.topic_tags.map((tag) => (
|
||||
<span
|
||||
key={tag}
|
||||
className="text-xs px-2 py-1 bg-accent text-accent-foreground rounded-full"
|
||||
>
|
||||
{tag}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { useState, useEffect, useRef } from "react";
|
||||
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
|
||||
import { StickyNote, Pin, PinOff, Trash2, ChevronDown, ChevronUp, Save } from "lucide-react";
|
||||
import { Pin, PinOff, Trash2, Save } from "lucide-react";
|
||||
import { notesAPI } from "@/lib/api";
|
||||
import { useAuthStore } from "@/stores/authStore";
|
||||
|
||||
@@ -23,7 +23,6 @@ export function NotesPanel({ billId }: NotesPanelProps) {
|
||||
throwOnError: false,
|
||||
});
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [content, setContent] = useState("");
|
||||
const [pinned, setPinned] = useState(false);
|
||||
const [saved, setSaved] = useState(false);
|
||||
@@ -43,7 +42,7 @@ export function NotesPanel({ billId }: NotesPanelProps) {
|
||||
if (!el) return;
|
||||
el.style.height = "auto";
|
||||
el.style.height = `${el.scrollHeight}px`;
|
||||
}, [content, open]);
|
||||
}, [content]);
|
||||
|
||||
const upsert = useMutation({
|
||||
mutationFn: () => notesAPI.upsert(billId, content, pinned),
|
||||
@@ -60,12 +59,14 @@ export function NotesPanel({ billId }: NotesPanelProps) {
|
||||
qc.removeQueries({ queryKey });
|
||||
setContent("");
|
||||
setPinned(false);
|
||||
setOpen(false);
|
||||
},
|
||||
});
|
||||
|
||||
// Don't render for guests
|
||||
if (!token) return null;
|
||||
if (!token) return (
|
||||
<div className="bg-card border border-border rounded-lg p-6 text-center">
|
||||
<p className="text-sm text-muted-foreground">Sign in to add private notes.</p>
|
||||
</div>
|
||||
);
|
||||
if (isLoading) return null;
|
||||
|
||||
const hasNote = !!note;
|
||||
@@ -74,78 +75,56 @@ export function NotesPanel({ billId }: NotesPanelProps) {
|
||||
: content.trim().length > 0;
|
||||
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-lg overflow-hidden">
|
||||
{/* Header / toggle */}
|
||||
<button
|
||||
onClick={() => setOpen((v) => !v)}
|
||||
className="w-full flex items-center justify-between px-4 py-3 text-sm hover:bg-accent transition-colors"
|
||||
>
|
||||
<span className="flex items-center gap-2 font-medium">
|
||||
<StickyNote className="w-4 h-4 text-muted-foreground" />
|
||||
My Note
|
||||
<div className="bg-card border border-border rounded-lg p-4 space-y-3">
|
||||
<textarea
|
||||
ref={textareaRef}
|
||||
value={content}
|
||||
onChange={(e) => setContent(e.target.value)}
|
||||
placeholder="Add a private note about this bill…"
|
||||
rows={3}
|
||||
className="w-full text-sm bg-background border border-border rounded-md px-3 py-2 focus:outline-none focus:ring-1 focus:ring-primary resize-none overflow-hidden"
|
||||
/>
|
||||
|
||||
<div className="flex items-center justify-between gap-3">
|
||||
{/* Left: pin toggle + delete */}
|
||||
<div className="flex items-center gap-3">
|
||||
<button
|
||||
onClick={() => setPinned((v) => !v)}
|
||||
title={pinned ? "Unpin note" : "Pin above tabs"}
|
||||
className={`flex items-center gap-1.5 text-xs px-2.5 py-1.5 rounded-md border transition-colors ${
|
||||
pinned
|
||||
? "border-primary text-primary bg-primary/10"
|
||||
: "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
|
||||
}`}
|
||||
>
|
||||
{pinned ? <Pin className="w-3 h-3" /> : <PinOff className="w-3 h-3" />}
|
||||
{pinned ? "Pinned" : "Pin"}
|
||||
</button>
|
||||
|
||||
{hasNote && (
|
||||
<span className="flex items-center gap-1 text-xs text-muted-foreground font-normal">
|
||||
{note.pinned && <Pin className="w-3 h-3" />}
|
||||
{new Date(note.updated_at).toLocaleDateString()}
|
||||
</span>
|
||||
)}
|
||||
</span>
|
||||
{open ? <ChevronUp className="w-4 h-4 text-muted-foreground" /> : <ChevronDown className="w-4 h-4 text-muted-foreground" />}
|
||||
</button>
|
||||
|
||||
{open && (
|
||||
<div className="px-4 pb-4 space-y-3 border-t border-border pt-3">
|
||||
<textarea
|
||||
ref={textareaRef}
|
||||
value={content}
|
||||
onChange={(e) => setContent(e.target.value)}
|
||||
placeholder="Add a private note about this bill…"
|
||||
rows={3}
|
||||
className="w-full text-sm bg-background border border-border rounded-md px-3 py-2 focus:outline-none focus:ring-1 focus:ring-primary resize-none overflow-hidden"
|
||||
/>
|
||||
|
||||
<div className="flex items-center justify-between gap-3">
|
||||
{/* Left: pin toggle + delete */}
|
||||
<div className="flex items-center gap-3">
|
||||
<button
|
||||
onClick={() => setPinned((v) => !v)}
|
||||
title={pinned ? "Unpin note" : "Pin to top of page"}
|
||||
className={`flex items-center gap-1.5 text-xs px-2.5 py-1.5 rounded-md border transition-colors ${
|
||||
pinned
|
||||
? "border-primary text-primary bg-primary/10"
|
||||
: "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
|
||||
}`}
|
||||
>
|
||||
{pinned ? <Pin className="w-3 h-3" /> : <PinOff className="w-3 h-3" />}
|
||||
{pinned ? "Pinned" : "Pin"}
|
||||
</button>
|
||||
|
||||
{hasNote && (
|
||||
<button
|
||||
onClick={() => remove.mutate()}
|
||||
disabled={remove.isPending}
|
||||
title="Delete note"
|
||||
className="p-1.5 rounded-md text-muted-foreground hover:text-destructive hover:bg-accent transition-colors"
|
||||
>
|
||||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Right: save */}
|
||||
<button
|
||||
onClick={() => upsert.mutate()}
|
||||
disabled={!content.trim() || upsert.isPending || (!isDirty && !saved)}
|
||||
className="flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 transition-colors"
|
||||
onClick={() => remove.mutate()}
|
||||
disabled={remove.isPending}
|
||||
title="Delete note"
|
||||
className="p-1.5 rounded-md text-muted-foreground hover:text-destructive hover:bg-accent transition-colors"
|
||||
>
|
||||
<Save className="w-3 h-3" />
|
||||
{saved ? "Saved!" : upsert.isPending ? "Saving…" : "Save"}
|
||||
<Trash2 className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p className="text-xs text-muted-foreground">Private — only visible to you.</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Right: save */}
|
||||
<button
|
||||
onClick={() => upsert.mutate()}
|
||||
disabled={!content.trim() || upsert.isPending || (!isDirty && !saved)}
|
||||
className="flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
<Save className="w-3 h-3" />
|
||||
{saved ? "Saved!" : upsert.isPending ? "Saving…" : "Save"}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p className="text-xs text-muted-foreground">Private — only visible to you.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -9,9 +9,10 @@ import type { BillVote, MemberVotePosition } from "@/lib/types";
|
||||
|
||||
interface VotePanelProps {
|
||||
billId: string;
|
||||
alwaysRender?: boolean;
|
||||
}
|
||||
|
||||
export function VotePanel({ billId }: VotePanelProps) {
|
||||
export function VotePanel({ billId, alwaysRender = false }: VotePanelProps) {
|
||||
const [expanded, setExpanded] = useState(true);
|
||||
|
||||
const { data: votes, isLoading } = useQuery({
|
||||
@@ -33,7 +34,16 @@ export function VotePanel({ billId }: VotePanelProps) {
|
||||
.map((f) => f.follow_value)
|
||||
);
|
||||
|
||||
if (isLoading || !votes || votes.length === 0) return null;
|
||||
if (isLoading || !votes || votes.length === 0) {
|
||||
if (!alwaysRender) return null;
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-lg p-6 text-center">
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{isLoading ? "Checking for roll-call votes…" : "No roll-call votes have been recorded for this bill."}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-lg overflow-hidden">
|
||||
|
||||
Reference in New Issue
Block a user