Lobbying explorer frontend

.gitignore

@@ -92,5 +92,10 @@ cert.txt
 # local MCP server config (contains auth tokens)
 .mcp.json
 mcp-server/create-agent-key.ts
-.gcloudignore
+
+# Claude
 CLAUDE.md
+
+#gcloud
+.gcloudignore
+

components/Navbar.tsx

@@ -15,6 +15,7 @@ import {
   NavbarLinkAiTools,
   NavbarLinkBills,
   NavbarLinkHearings,
+  NavbarLinkLobbying,
   NavbarLinkEditProfile,
   NavbarLinkEffective,
   NavbarLinkFAQ,
@@ -79,6 +80,9 @@ const MobileNav: React.FC<React.PropsWithChildren<unknown>> = () => {
           <NavbarLinkHearings handleClick={closeNav} />
         ) : null}
         <NavbarLinkTestimony handleClick={closeNav} />
+        {flags().lobbyingTable ? (
+          <NavbarLinkLobbying handleClick={closeNav} />
+        ) : null}
         {authenticated ? <NavbarLinkNewsfeed handleClick={closeNav} /> : <></>}
         <NavDropdown className={"navLink-primary"} title={t("about")}>
           <NavbarLinkGoals handleClick={closeNav} />
@@ -233,6 +237,12 @@ const DesktopNav: React.FC<React.PropsWithChildren<unknown>> = () => {
         <NavbarLinkTestimony />
       </div>
 
+      {flags().lobbyingTable ? (
+        <div className={`align-self-center`}>
+          <NavbarLinkLobbying />
+        </div>
+      ) : null}
+
       {authenticated ? (
         <div className="align-self-center">
           <NavbarLinkNewsfeed />

components/NavbarComponents.tsx

@@ -142,6 +142,27 @@ export const NavbarLinkBills: React.FC<
   )
 }
 
+export const NavbarLinkLobbying: React.FC<
+  React.PropsWithChildren<{
+    handleClick?: any
+    other?: any
+  }>
+> = ({ handleClick, other }) => {
+  const isMobile = useMediaQuery("(max-width: 768px)")
+  const { t } = useTranslation(["common", "auth"])
+  return (
+    <Nav.Item onClick={handleClick}>
+      <NavLink
+        className={isMobile ? "navLink-primary" : DESKTOP_NAV_ITEM_CLASS}
+        href="/lobbying"
+        {...other}
+      >
+        {t("navigation.lobbying")}
+      </NavLink>
+    </Nav.Item>
+  )
+}
+
 export const NavbarLinkBallotQuestions: React.FC<
   React.PropsWithChildren<{
     handleClick?: any

components/bill/BillDetails.tsx

@@ -6,7 +6,7 @@ import { Banner } from "../shared/StyledSharedComponents"
 import { BillNumber, Styled } from "./BillNumber"
 import { BillTestimonies } from "./BillTestimonies"
 import BillTrackerConnectedView from "./BillTracker"
-import { LobbyingTable } from "./LobbyingTable"
+import { LobbyingBillCard } from "components/lobbying/LobbyingBillCard"
 import { Committees, Hearing, Sponsors } from "./SponsorsAndCommittees"
 import { Status } from "./Status"
 import { Summary } from "./Summary"
@@ -99,7 +99,11 @@ export const BillDetails = ({ bill }: BillProps) => {
 
             <BillTestimonies bill={bill} className="mt-4" />
             {flags.lobbyingTable && (
-              <LobbyingTable bill={bill} className="mt-4 pb-1" />
+              <LobbyingBillCard
+                court={bill.court}
+                billId={bill.id}
+                className="mt-4 pb-1"
+              />
             )}
           </Col>
           <Col md={4}>

components/db/lobbying.ts

@@ -0,0 +1,228 @@
+import {
+  collection,
+  doc,
+  getDoc,
+  getDocs,
+  limit,
+  orderBy,
+  query,
+  where
+} from "firebase/firestore"
+import { useAsync } from "react-async-hook"
+import type {
+  LobbyingClientSummary,
+  LobbyingFiling,
+  LobbyingRegistrant,
+  LobbyingStats
+} from "functions/src/lobbying/types"
+import { firestore } from "../firebase"
+
+// Mirror of constants in functions/src/lobbying/types.ts — kept here to avoid
+// pulling firebase-admin (a Node-only package) into the browser bundle.
+const FILINGS_COLLECTION = "lobbyingFilings"
+const REGISTRANTS_COLLECTION = "lobbyingRegistrants"
+const CLIENTS_COLLECTION = "lobbyingClients"
+const LOBBYING_STATS_COLLECTION = "lobbyingMeta"
+const LOBBYING_STATS_DOC_ID = "stats"
+
+// ── Internal fetchers ─────────────────────────────────────────────────────────
+
+async function fetchLobbyingStats(): Promise<LobbyingStats | undefined> {
+  const snap = await getDoc(
+    doc(firestore, LOBBYING_STATS_COLLECTION, LOBBYING_STATS_DOC_ID)
+  )
+  return snap.exists() ? (snap.data() as LobbyingStats) : undefined
+}
+
+async function fetchFilingsForBill(
+  court: number,
+  billId: string
+): Promise<LobbyingFiling[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, FILINGS_COLLECTION),
+      where("generalCourt", "==", court),
+      where("billId", "==", billId)
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingFiling)
+}
+
+async function fetchRegistrants(opts: {
+  regType?: "Lobbyist" | "Employer"
+  year?: number
+  pageSize?: number
+}): Promise<LobbyingRegistrant[]> {
+  const constraints = [
+    opts.regType ? where("regType", "==", opts.regType) : undefined,
+    opts.year ? where("year", "==", opts.year) : undefined,
+    orderBy("entityNameNorm"),
+    limit(opts.pageSize ?? 50)
+  ].filter(Boolean) as Parameters<typeof query>[1][]
+
+  const snap = await getDocs(
+    query(collection(firestore, REGISTRANTS_COLLECTION), ...constraints)
+  )
+  return snap.docs.map(d => d.data() as LobbyingRegistrant)
+}
+
+async function fetchRegistrant(
+  registrantId: string
+): Promise<LobbyingRegistrant | undefined> {
+  const snap = await getDoc(
+    doc(firestore, REGISTRANTS_COLLECTION, registrantId)
+  )
+  return snap.exists() ? (snap.data() as LobbyingRegistrant) : undefined
+}
+
+async function fetchFilingsForRegistrant(
+  registrantId: string
+): Promise<LobbyingFiling[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, FILINGS_COLLECTION),
+      where("registrantId", "==", registrantId),
+      orderBy("year", "desc")
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingFiling)
+}
+
+async function fetchClients(opts: {
+  year?: number
+  pageSize?: number
+}): Promise<LobbyingClientSummary[]> {
+  const constraints = [
+    opts.year ? where("years", "array-contains", opts.year) : undefined,
+    orderBy("clientNameNorm"),
+    limit(opts.pageSize ?? 50)
+  ].filter(Boolean) as Parameters<typeof query>[1][]
+
+  const snap = await getDocs(
+    query(collection(firestore, CLIENTS_COLLECTION), ...constraints)
+  )
+  return snap.docs.map(d => d.data() as LobbyingClientSummary)
+}
+
+async function fetchClient(
+  clientSlug: string
+): Promise<LobbyingClientSummary | undefined> {
+  const snap = await getDoc(doc(firestore, CLIENTS_COLLECTION, clientSlug))
+  return snap.exists() ? (snap.data() as LobbyingClientSummary) : undefined
+}
+
+async function fetchAllRegistrants(): Promise<LobbyingRegistrant[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, REGISTRANTS_COLLECTION),
+      orderBy("entityNameNorm"),
+      limit(2000)
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingRegistrant)
+}
+
+async function fetchRegistrantsByEntityName(
+  entityNameNorm: string
+): Promise<LobbyingRegistrant[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, REGISTRANTS_COLLECTION),
+      where("entityNameNorm", "==", entityNameNorm),
+      orderBy("year", "desc")
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingRegistrant)
+}
+
+async function fetchFilingsForEntityName(
+  entityNameNorm: string
+): Promise<LobbyingFiling[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, FILINGS_COLLECTION),
+      where("entityNameNorm", "==", entityNameNorm),
+      orderBy("year", "desc")
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingFiling)
+}
+
+async function fetchFilingsForCourt(court: number): Promise<LobbyingFiling[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, FILINGS_COLLECTION),
+      where("generalCourt", "==", court)
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingFiling)
+}
+
+async function fetchFilingsForClient(
+  clientNameNorm: string
+): Promise<LobbyingFiling[]> {
+  const snap = await getDocs(
+    query(
+      collection(firestore, FILINGS_COLLECTION),
+      where("clientNameNorm", "==", clientNameNorm),
+      orderBy("year", "desc")
+    )
+  )
+  return snap.docs.map(d => d.data() as LobbyingFiling)
+}
+
+// ── Public hooks ──────────────────────────────────────────────────────────────
+
+export function useLobbyingFilingsForCourt(court: number) {
+  return useAsync(fetchFilingsForCourt, [court])
+}
+
+export function useLobbyingAllRegistrants() {
+  return useAsync(fetchAllRegistrants, [])
+}
+
+export function useLobbyingRegistrantsByEntityName(entityNameNorm: string) {
+  return useAsync(fetchRegistrantsByEntityName, [entityNameNorm])
+}
+
+export function useLobbyingFilingsForEntityName(entityNameNorm: string) {
+  return useAsync(fetchFilingsForEntityName, [entityNameNorm])
+}
+
+export function useLobbyingStats() {
+  return useAsync(fetchLobbyingStats, [])
+}
+
+export function useLobbyingFilingsForBill(court: number, billId: string) {
+  return useAsync(fetchFilingsForBill, [court, billId])
+}
+
+export function useLobbyingRegistrants(opts: {
+  regType?: "Lobbyist" | "Employer"
+  year?: number
+  pageSize?: number
+}) {
+  return useAsync(fetchRegistrants, [opts])
+}
+
+export function useLobbyingRegistrant(registrantId: string) {
+  return useAsync(fetchRegistrant, [registrantId])
+}
+
+export function useLobbyingFilingsForRegistrant(registrantId: string) {
+  return useAsync(fetchFilingsForRegistrant, [registrantId])
+}
+
+export function useLobbyingClients(
+  opts: { year?: number; pageSize?: number } = {}
+) {
+  return useAsync(fetchClients, [opts])
+}
+
+export function useLobbyingClient(clientSlug: string) {
+  return useAsync(fetchClient, [clientSlug])
+}
+
+export function useLobbyingFilingsForClient(clientNameNorm: string) {
+  return useAsync(fetchFilingsForClient, [clientNameNorm])
+}

components/featureFlags.ts

@@ -37,7 +37,7 @@ const defaults: Record<Env, FeatureFlags> = {
     notifications: true,
     billTracker: true,
     followOrg: true,
-    lobbyingTable: false,
+    lobbyingTable: true,
     hearingsAndTranscriptions: true,
     phoneVerificationUI: true,
     ballotQuestions: true,

components/lobbying/LobbyingAttribution.tsx

@@ -0,0 +1,29 @@
+import React from "react"
+import { useTranslation } from "next-i18next"
+import { MAPLE_COLORS } from "./chartTheme"
+
+const SOS_URL = "https://www.sec.state.ma.us/LobbyistPublicSearch/Default.aspx"
+
+export const LobbyingAttribution: React.FC<{ className?: string }> = ({
+  className
+}) => {
+  const { t } = useTranslation("lobbying")
+  return (
+    <p style={style} className={className}>
+      <a href={SOS_URL} target="_blank" rel="noreferrer" style={linkStyle}>
+        {t("attribution")}
+      </a>
+    </p>
+  )
+}
+
+const style: React.CSSProperties = {
+  fontSize: 12,
+  color: MAPLE_COLORS.textMuted,
+  marginTop: "1rem"
+}
+
+const linkStyle: React.CSSProperties = {
+  color: MAPLE_COLORS.textMuted,
+  textDecoration: "underline"
+}