Deploy to PROD 3/24/26 Part 2

components/bill/Summary.tsx

@@ -104,11 +104,14 @@ export const ViewMessage = styled.div`
   }
 `
 
+const BALLOT_SUMMARY_CHAR_LIMIT = 1000
+
 export const Summary = ({
   bill,
   className
 }: BillProps & { className?: string }) => {
   const [showBillDetails, setShowBillDetails] = useState(false)
+  const [showFullSummary, setShowFullSummary] = useState(false)
   const handleShowBillDetails = () => setShowBillDetails(true)
   const handleHideBillDetails = () => setShowBillDetails(false)
   const billText = bill?.content?.DocumentText
@@ -221,7 +224,36 @@ export const Summary = ({
           )}
           {bill.summary !== undefined && isBallotMeasure ? (
             <BallotSummaryRow className={`mx-1 mb-3`}>
-              {bill.summary}
+              {bill.summary.length > BALLOT_SUMMARY_CHAR_LIMIT ? (
+                <>
+                  {bill.summary.slice(0, BALLOT_SUMMARY_CHAR_LIMIT)}…{" "}
+                  <StyledButton
+                    variant="link"
+                    onClick={() => setShowFullSummary(true)}
+                  >
+                    {t("bill.view_full_summary")}
+                  </StyledButton>
+                  <Modal
+                    show={showFullSummary}
+                    onHide={() => setShowFullSummary(false)}
+                    size="lg"
+                  >
+                    <Modal.Header
+                      closeButton
+                      onClick={() => setShowFullSummary(false)}
+                    >
+                      <Modal.Title>{bill?.id}</Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body className="bg-white">
+                      <FormattedBillDetails>
+                        {bill.summary}
+                      </FormattedBillDetails>
+                    </Modal.Body>
+                  </Modal>
+                </>
+              ) : (
+                bill.summary
+              )}
             </BallotSummaryRow>
           ) : (
             <Row className="mx-1 mb-3">{bill.summary}</Row>

components/db/index.ts

@@ -1,6 +1,7 @@
 export * from "./bills"
 export * from "./createTableHook"
 export * from "./members"
+export * from "./news"
 export * from "./profile"
 export * from "./testimony"
 export * from "./useUpcomingBills"

components/db/news.ts

@@ -0,0 +1,26 @@
+import { collection, getDocs, orderBy, Timestamp } from "firebase/firestore"
+import { useAsync } from "react-async-hook"
+import { firestore } from "../firebase"
+
+export type NewsType = "article" | "award" | "book"
+
+export type NewsItem = {
+  id: string
+  url: string
+  title: string
+  author: string
+  type: NewsType
+  description?: string
+  publishDate: string
+  createdAt: Timestamp
+}
+
+export async function listNews(): Promise<NewsItem[]> {
+  const newsRef = collection(firestore, "news")
+  const result = await getDocs(newsRef)
+  return result.docs.map(d => ({ id: d.id, ...d.data() } as NewsItem))
+}
+
+export function useNews() {
+  return useAsync(listNews, [])
+}

components/moderation/News.tsx

@@ -0,0 +1,91 @@
+import React, { useEffect } from "react"
+import { collection, getFirestore, onSnapshot } from "firebase/firestore"
+import {
+  Create,
+  Datagrid,
+  DateField,
+  DateInput,
+  Edit,
+  EditButton,
+  FunctionField,
+  List,
+  SelectInput,
+  SimpleForm,
+  TextField,
+  TextInput,
+  useRefresh
+} from "react-admin"
+
+const typeChoices = [
+  { id: "article", name: "Article" },
+  { id: "award", name: "Award" },
+  { id: "book", name: "Book" }
+]
+
+export function ListNews() {
+  const firestore = getFirestore()
+  const refresh = useRefresh()
+
+  useEffect(() => {
+    const newsRef = collection(firestore, "news")
+    const unsubscribe = onSnapshot(
+      newsRef,
+      () => refresh(),
+      (e: Error) => console.log(e)
+    )
+
+    return () => unsubscribe()
+  }, [firestore, refresh])
+
+  return (
+    <List>
+      <Datagrid rowClick="edit" bulkActionButtons={false}>
+        <TextField source="id" label="News ID" />
+        <TextField source="title" label="Title" />
+        <TextField source="author" label="Author" />
+        <TextField source="type" label="Type" />
+        <DateField source="publishDate" label="Publish Date" />
+        <DateField source="createdAt" showTime />
+        <EditButton label="Edit" />
+      </Datagrid>
+    </List>
+  )
+}
+
+export function EditNews() {
+  return (
+    <Edit>
+      <SimpleForm>
+        <TextInput source="url" fullWidth />
+        <SelectInput source="type" choices={typeChoices} />
+        <TextInput source="author" />
+        <TextInput source="title" fullWidth />
+        <TextInput source="description" multiline fullWidth />
+        <DateInput source="publishDate" />
+      </SimpleForm>
+    </Edit>
+  )
+}
+
+export function CreateNews() {
+  return (
+    <Create
+      redirect="list"
+      transform={(data: Record<string, unknown>) => ({
+        ...data,
+        createdAt: new Date()
+      })}
+    >
+      <SimpleForm>
+        <TextInput source="url" fullWidth />
+        <SelectInput source="type" choices={typeChoices} />
+        <TextInput source="author" />
+        <TextInput source="title" fullWidth />
+        <TextInput source="description" multiline fullWidth />
+        <DateInput source="publishDate" />
+      </SimpleForm>
+    </Create>
+  )
+}
+
+export default { ListNews, EditNews, CreateNews }

components/moderation/dataProviderDbCalls.ts

@@ -136,9 +136,13 @@ export async function createMyOne(
 ): Promise<CreateResult> {
   console.log("creating my one")
   const { data, meta } = params
-  const ref = doc(firestore, resource, data.id)
-  await setDoc(ref, data)
-  return { data: data }
+  const ref = data.id
+    ? doc(firestore, resource, data.id)
+    : doc(collection(firestore, resource))
+  const id = ref.id
+  const newData = { ...data, id }
+  await setDoc(ref, newData)
+  return { data: newData }
 }
 
 export const getMyListGroup = async (

components/moderation/index.ts

@@ -1,5 +1,6 @@
 export * from "./types"
 export * from "./ListPublishedTestimony"
+export * from "./News"
 export * from "./ListReports"
 export * from "./EditReports"
 export * from "./ListProfiles"

components/moderation/moderation.tsx

@@ -5,6 +5,7 @@ import { QueryClient, QueryClientProvider } from "react-query"
 import { EditReports, ListReports } from "./"
 import { ListProfiles } from "./ListProfiles"
 import { ScrapeHearingList } from "./ScrapeHearing"
+import { ListNews, EditNews, CreateNews } from "./"
 import {
   createMyOne,
   getMyListGroup,
@@ -54,6 +55,13 @@ const App = () => {
           list={ScrapeHearingList}
           options={{ label: "Scrape Hearing" }}
         />
+        <Resource
+          name="news"
+          list={ListNews}
+          edit={EditNews}
+          create={CreateNews}
+          options={{ label: "In the News" }}
+        />
       </Admin>
     </QueryClientProvider>
   )

firestore.rules

@@ -69,6 +69,12 @@ service cloud.firestore {
       // Only admins can do anything with it
       allow read, write: if request.auth.token.get("role", "user") == "admin"
     }
+
+    // Admin-managed news collection used by the admin UI and public news page
+    match /news/{nid} {
+      allow read: if true;
+      allow write: if request.auth.token.get("role", "user") == "admin";
+    }
     match /users/{uid} {
       allow read, write: if request.auth.token.get("role", "user") == "admin"
       match /draftTestimony/{id} {

public/locales/en/common.json

@@ -65,7 +65,8 @@
     "smart_tag": "AI Smart Tag",
     "status_and_history": "Status & History",
     "status_history": "Status History",
-    "view_bill": "View Bill Text" 
+    "view_bill": "View Bill Text",
+    "view_full_summary": "View Full Summary"
   },
   "bill_updates": "Bill Updates",
   "browse_bills": "browse bills",