feat(interest): add public interest tracking for members of Congress

Adds Google Trends, NewsAPI, and Google News RSS scoring for members,
mirroring the existing bill interest pipeline. Member profiles now show
a Public Interest chart (with signal breakdown) and a Related News panel.

Key changes:
- New member_trend_scores + member_news_articles tables (migration 0008)
- fetch_gnews_articles() added to news_service for unlimited RSS article storage
- Bill news fetcher now combines NewsAPI + Google News RSS (more coverage)
- New member_interest Celery worker with scheduled news + trend tasks
- GET /members/{id}/trend and /news API endpoints
- TrendChart redesigned with signal breakdown badges and bar+line combo chart
- NewsPanel accepts generic article shape (bills and members)

Co-Authored-By: Jack Levy

frontend/app/members/[id]/page.tsx

@@ -13,7 +13,9 @@ import {
   FileText,
   Users,
 } from "lucide-react";
-import { useMember, useMemberBills } from "@/lib/hooks/useMembers";
+import { useMember, useMemberBills, useMemberTrend, useMemberNews } from "@/lib/hooks/useMembers";
+import { TrendChart } from "@/components/bills/TrendChart";
+import { NewsPanel } from "@/components/bills/NewsPanel";
 import { FollowButton } from "@/components/shared/FollowButton";
 import { BillCard } from "@/components/shared/BillCard";
 import { cn, partyBadgeColor } from "@/lib/utils";
@@ -28,6 +30,8 @@ export default function MemberDetailPage({ params }: { params: Promise<{ id: str
   const { id } = use(params);
   const { data: member, isLoading } = useMember(id);
   const { data: billsData } = useMemberBills(id);
+  const { data: trendData } = useMemberTrend(id, 30);
+  const { data: newsData } = useMemberNews(id);
 
   if (isLoading) return <div className="text-center py-20 text-muted-foreground">Loading...</div>;
   if (!member) return <div className="text-center py-20 text-muted-foreground">Member not found.</div>;
@@ -156,6 +160,12 @@ export default function MemberDetailPage({ params }: { params: Promise<{ id: str
 
         {/* Right column */}
         <div className="space-y-4">
+          {/* Public Interest */}
+          <TrendChart data={trendData ?? []} title="Public Interest" />
+
+          {/* News */}
+          <NewsPanel articles={newsData} />
+
           {/* Legislation stats */}
           {(member.sponsored_count != null || member.cosponsored_count != null) && (
             <div className="bg-card border border-border rounded-lg p-4 space-y-3">

frontend/components/bills/NewsPanel.tsx

@@ -1,9 +1,16 @@
 import { ExternalLink, Newspaper } from "lucide-react";
-import { NewsArticle } from "@/lib/types";
 import { formatDate } from "@/lib/utils";
 
+interface ArticleLike {
+  id: number;
+  source?: string;
+  headline?: string;
+  url?: string;
+  published_at?: string;
+}
+
 interface NewsPanelProps {
-  articles?: NewsArticle[];
+  articles?: ArticleLike[];
 }
 
 export function NewsPanel({ articles }: NewsPanelProps) {

frontend/components/bills/TrendChart.tsx

@@ -1,51 +1,89 @@
 "use client";
 
-import { TrendingUp } from "lucide-react";
+import { TrendingUp, Newspaper, Radio } from "lucide-react";
 import {
-  LineChart,
+  ComposedChart,
   Line,
+  Bar,
   XAxis,
   YAxis,
   Tooltip,
   ResponsiveContainer,
   CartesianGrid,
+  Legend,
 } from "recharts";
-import { TrendScore } from "@/lib/types";
-import { formatDate } from "@/lib/utils";
+import { TrendScore, MemberTrendScore } from "@/lib/types";
+
+type AnyTrendScore = TrendScore | MemberTrendScore;
 
 interface TrendChartProps {
-  data?: TrendScore[];
+  data?: AnyTrendScore[];
+  title?: string;
 }
 
-export function TrendChart({ data }: TrendChartProps) {
+function ScoreBadge({ label, value, icon }: { label: string; value: number | string; icon: React.ReactNode }) {
+  return (
+    <div className="flex flex-col items-center gap-0.5">
+      <div className="text-muted-foreground">{icon}</div>
+      <span className="text-xs font-semibold tabular-nums">{value}</span>
+      <span className="text-[10px] text-muted-foreground">{label}</span>
+    </div>
+  );
+}
+
+export function TrendChart({ data, title = "Public Interest" }: TrendChartProps) {
   const chartData = data?.map((d) => ({
-    date: new Date(d.score_date).toLocaleDateString("en-US", { month: "short", day: "numeric" }),
+    date: new Date(d.score_date + "T00:00:00").toLocaleDateString("en-US", { month: "short", day: "numeric" }),
     score: Math.round(d.composite_score),
-    news: d.newsapi_count,
+    newsapi: d.newsapi_count,
     gnews: d.gnews_count,
+    gtrends: Math.round(d.gtrends_score),
   })) ?? [];
 
-  const latest = data?.[data.length - 1]?.composite_score;
+  const latest = data?.[data.length - 1];
 
   return (
-    <div className="bg-card border border-border rounded-lg p-4">
-      <div className="flex items-center justify-between mb-4">
+    <div className="bg-card border border-border rounded-lg p-4 space-y-4">
+      <div className="flex items-center justify-between">
         <h3 className="font-semibold text-sm flex items-center gap-2">
           <TrendingUp className="w-4 h-4" />
-          Public Interest
+          {title}
         </h3>
         {latest !== undefined && (
-          <span className="text-2xl font-bold tabular-nums">{Math.round(latest)}</span>
+          <span className="text-2xl font-bold tabular-nums">{Math.round(latest.composite_score)}</span>
         )}
       </div>
 
+      {/* Signal breakdown badges */}
+      {latest && (
+        <div className="flex justify-around border border-border rounded-md p-2 bg-muted/30">
+          <ScoreBadge
+            label="NewsAPI"
+            value={latest.newsapi_count}
+            icon={<Newspaper className="w-3 h-3" />}
+          />
+          <div className="w-px bg-border" />
+          <ScoreBadge
+            label="Google News"
+            value={latest.gnews_count}
+            icon={<Radio className="w-3 h-3" />}
+          />
+          <div className="w-px bg-border" />
+          <ScoreBadge
+            label="Trends"
+            value={`${Math.round(latest.gtrends_score)}/100`}
+            icon={<TrendingUp className="w-3 h-3" />}
+          />
+        </div>
+      )}
+
       {chartData.length === 0 ? (
         <p className="text-xs text-muted-foreground italic text-center py-8">
-          Trend data not yet available.
+          Interest data not yet available. Check back after the nightly scoring run.
         </p>
       ) : (
         <ResponsiveContainer width="100%" height={180}>
-          <LineChart data={chartData} margin={{ top: 4, right: 4, left: -20, bottom: 0 }}>
+          <ComposedChart data={chartData} margin={{ top: 4, right: 4, left: -20, bottom: 0 }}>
             <CartesianGrid strokeDasharray="3 3" stroke="hsl(var(--border))" />
             <XAxis
               dataKey="date"
@@ -64,23 +102,33 @@ export function TrendChart({ data }: TrendChartProps) {
                 borderRadius: "6px",
                 fontSize: "12px",
               }}
+              formatter={(value: number, name: string) => {
+                const labels: Record<string, string> = {
+                  score: "Composite",
+                  newsapi: "NewsAPI articles",
+                  gnews: "Google News articles",
+                  gtrends: "Google Trends",
+                };
+                return [value, labels[name] ?? name];
+              }}
             />
+            <Bar dataKey="gnews" fill="hsl(var(--muted-foreground))" opacity={0.3} name="gnews" radius={[2, 2, 0, 0]} />
+            <Bar dataKey="newsapi" fill="hsl(var(--primary))" opacity={0.3} name="newsapi" radius={[2, 2, 0, 0]} />
             <Line
               type="monotone"
               dataKey="score"
               stroke="hsl(var(--primary))"
               strokeWidth={2}
               dot={false}
-              name="Zeitgeist Score"
+              name="score"
             />
-          </LineChart>
+          </ComposedChart>
         </ResponsiveContainer>
       )}
 
-      <div className="mt-3 flex gap-4 text-xs text-muted-foreground">
-        <span>Score: 0–100 composite</span>
-        <span>NewsAPI + Google News + Trends</span>
-      </div>
+      <p className="text-[10px] text-muted-foreground">
+        Composite 0–100 · NewsAPI articles (max 40 pts) + Google News volume (max 30 pts) + Google Trends score (max 30 pts)
+      </p>
     </div>
   );
 }

frontend/lib/api.ts

@@ -6,6 +6,8 @@ import type {
   DashboardData,
   Follow,
   Member,
+  MemberTrendScore,
+  MemberNewsArticle,
   NewsArticle,
   PaginatedResponse,
   SettingsData,
@@ -81,6 +83,10 @@ export const membersAPI = {
     apiClient.get<Member>(`/api/members/${id}`).then((r) => r.data),
   getBills: (id: string, params?: Record<string, unknown>) =>
     apiClient.get<PaginatedResponse<Bill>>(`/api/members/${id}/bills`, { params }).then((r) => r.data),
+  getTrend: (id: string, days?: number) =>
+    apiClient.get<MemberTrendScore[]>(`/api/members/${id}/trend`, { params: { days } }).then((r) => r.data),
+  getNews: (id: string) =>
+    apiClient.get<MemberNewsArticle[]>(`/api/members/${id}/news`).then((r) => r.data),
 };
 
 // Follows

frontend/lib/hooks/useMembers.ts

@@ -26,3 +26,21 @@ export function useMemberBills(id: string) {
     enabled: !!id,
   });
 }
+
+export function useMemberTrend(id: string, days = 30) {
+  return useQuery({
+    queryKey: ["member-trend", id, days],
+    queryFn: () => membersAPI.getTrend(id, days),
+    staleTime: 60 * 60 * 1000,
+    enabled: !!id,
+  });
+}
+
+export function useMemberNews(id: string) {
+  return useQuery({
+    queryKey: ["member-news", id],
+    queryFn: () => membersAPI.getNews(id),
+    staleTime: 10 * 60 * 1000,
+    enabled: !!id,
+  });
+}

frontend/lib/types.ts

@@ -15,6 +15,23 @@ export interface MemberLeadership {
   current?: boolean;
 }
 
+export interface MemberTrendScore {
+  score_date: string;
+  newsapi_count: number;
+  gnews_count: number;
+  gtrends_score: number;
+  composite_score: number;
+}
+
+export interface MemberNewsArticle {
+  id: number;
+  source?: string;
+  headline?: string;
+  url?: string;
+  published_at?: string;
+  relevance_score?: number;
+}
+
 export interface Member {
   bioguide_id: string;
   name: string;
@@ -34,6 +51,7 @@ export interface Member {
   leadership_json?: MemberLeadership[];
   sponsored_count?: number;
   cosponsored_count?: number;
+  latest_trend?: MemberTrendScore;
 }
 
 export interface CitedPoint {