From 7a3a55c6959b63aaf4ec60145004d10a0bffaab8 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 7 Aug 2025 16:51:22 -0400
Subject: [PATCH 01/74] initial commit

---
 components/hearing/HearingDetails.tsx |  5 +++++
 pages/hearing/1.tsx                   | 16 ++++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 components/hearing/HearingDetails.tsx
 create mode 100644 pages/hearing/1.tsx

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
new file mode 100644
index 000000000..2d4a777e8
--- /dev/null
+++ b/components/hearing/HearingDetails.tsx
@@ -0,0 +1,5 @@
+import { useTranslation } from "next-i18next"
+
+export const HearingDetails = () => {
+  return <>Hello Hearings World</>
+}
diff --git a/pages/hearing/1.tsx b/pages/hearing/1.tsx
new file mode 100644
index 000000000..19dcfd60f
--- /dev/null
+++ b/pages/hearing/1.tsx
@@ -0,0 +1,16 @@
+import { HearingDetails } from "components/hearing/HearingDetails"
+import { createPage } from "../../components/page"
+import { createGetStaticTranslationProps } from "components/translations"
+
+export default createPage({
+  title: "Hearing",
+  Page: () => {
+    return <HearingDetails />
+  }
+})
+
+export const getStaticProps = createGetStaticTranslationProps([
+  "auth",
+  "common",
+  "footer"
+])

From 1eedc9fe0916bcc47cd97a750a2875a5ccfd46b5 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sat, 9 Aug 2025 14:43:39 -0400
Subject: [PATCH 02/74] retrieve data

---
 components/hearing/HearingDetails.tsx | 28 ++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 2d4a777e8..89d3bac09 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -1,5 +1,31 @@
+import {
+  collection,
+  doc,
+  getDoc,
+  getDocs,
+  orderBy,
+  query
+} from "firebase/firestore"
 import { useTranslation } from "next-i18next"
+import { firestore } from "components/firebase"
+
+async function HearingData() {
+  const hearingId = "hearing-5180"
+  const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
+
+  // ignore errors related to: Property X does not exist on type 'DocumentSnapshot<DocumentData>'.
+
+  console.log("hearing", hearing._document.data.value.mapValue.fields)
+
+  const { videoTranscriptionId, videoURL } = hearing.data()
+
+  console.log("url", videoURL)
+
+  return hearing
+}
 
 export const HearingDetails = () => {
-  return <>Hello Hearings World</>
+  HearingData()
+
+  return <>Hello Hearing World</>
 }

From 949575bd147ea82ad4c4556f84e3f15610be8ce1 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 15:40:20 -0400
Subject: [PATCH 03/74] hearing title

---
 components/hearing/HearingDetails.tsx | 14 +++++++++++++-
 public/locales/en/common.json         |  1 +
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 89d3bac09..835512b3a 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -7,8 +7,14 @@ import {
   query
 } from "firebase/firestore"
 import { useTranslation } from "next-i18next"
+import styled from "styled-components"
+import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 
+const StyledContainer = styled(Container)`
+  font-family: "Nunito";
+`
+
 async function HearingData() {
   const hearingId = "hearing-5180"
   const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
@@ -25,7 +31,13 @@ async function HearingData() {
 }
 
 export const HearingDetails = () => {
+  const { t } = useTranslation("common")
   HearingData()
 
-  return <>Hello Hearing World</>
+  return (
+    <StyledContainer className="mt-3 mb-3">
+      <h1>{t("hearing_transcription")}</h1>
+      <>Hello Hearing World</>
+    </StyledContainer>
+  )
 }
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 84248a859..3903ab28e 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -41,6 +41,7 @@
     "followed": "Followed"
   },
   "calendar": "Our Calendar",
+  "hearing_transcription": "Hearing Transcription",
   "hideAns": "Hide Answer",
   "joinTraining": "and join an upcoming training session!",
   "learn": "Learn",

From 44ea7096f1204a76bfa95a471428788b5a436586 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 16:12:23 -0400
Subject: [PATCH 04/74] error handling

---
 components/hearing/HearingDetails.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 835512b3a..514ce5be3 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -21,13 +21,15 @@ async function HearingData() {
 
   // ignore errors related to: Property X does not exist on type 'DocumentSnapshot<DocumentData>'.
 
-  console.log("hearing", hearing._document.data.value.mapValue.fields)
+  console.log("data:", hearing.data())
 
-  const { videoTranscriptionId, videoURL } = hearing.data()
+  const docData = hearing.data()
+  const content = docData?.content ?? "Default Content"
+  const videoTranscriptionId =
+    docData?.content ?? "Default Video Transcripton Id"
+  const videoURL = docData?.content ?? "Default URL"
 
-  console.log("url", videoURL)
-
-  return hearing
+  return { content, videoTranscriptionId, videoURL }
 }
 
 export const HearingDetails = () => {

From ae13ee567f42e509cb8ee296e2caaeee63b8e101 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 18:52:16 -0400
Subject: [PATCH 05/74] refactor async function

---
 components/hearing/HearingDetails.tsx | 34 ++++++++++++++-------------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 514ce5be3..2300d7494 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -7,39 +7,41 @@ import {
   query
 } from "firebase/firestore"
 import { useTranslation } from "next-i18next"
+import { useCallback, useEffect, useRef, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
+import { DatagridCell } from "react-admin"
 
 const StyledContainer = styled(Container)`
   font-family: "Nunito";
 `
 
-async function HearingData() {
+export const HearingDetails = () => {
+  const { t } = useTranslation("common")
   const hearingId = "hearing-5180"
-  const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
-
-  // ignore errors related to: Property X does not exist on type 'DocumentSnapshot<DocumentData>'.
+  const [videoURL, setVideoURL] = useState("")
 
-  console.log("data:", hearing.data())
+  const hearingData = useCallback(async () => {
+    const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
+    const docData = hearing.data()
+    const content = docData?.content ?? "Default Content"
+    const videoTranscriptionId =
+      docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
+    setVideoURL(docData?.videoURL ?? "Default URL")
 
-  const docData = hearing.data()
-  const content = docData?.content ?? "Default Content"
-  const videoTranscriptionId =
-    docData?.content ?? "Default Video Transcripton Id"
-  const videoURL = docData?.content ?? "Default URL"
+    console.log("data: ", docData)
+    console.log("content Name: ", content.Name)
+  }, [])
 
-  return { content, videoTranscriptionId, videoURL }
-}
+  hearingData()
 
-export const HearingDetails = () => {
-  const { t } = useTranslation("common")
-  HearingData()
+  console.log("url: ", videoURL)
 
   return (
     <StyledContainer className="mt-3 mb-3">
       <h1>{t("hearing_transcription")}</h1>
-      <>Hello Hearing World</>
+      <>Hello Hearing World, {videoURL}</>
     </StyledContainer>
   )
 }

From 671883212b4055b9c3eee2f38bec6c366da45c7f Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 19:06:12 -0400
Subject: [PATCH 06/74] added state variable

---
 components/hearing/HearingDetails.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 2300d7494..2a020d2cf 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -21,6 +21,7 @@ export const HearingDetails = () => {
   const { t } = useTranslation("common")
   const hearingId = "hearing-5180"
   const [videoURL, setVideoURL] = useState("")
+  const [videoTranscriptionId, setVideoTranscriptionId] = useState("")
 
   const hearingData = useCallback(async () => {
     const hearing = await getDoc(doc(firestore, `events/${hearingId}`))

From fc9fb895fe68ef2b1e108b28bee52a1d07824e6a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 19:07:55 -0400
Subject: [PATCH 07/74] resolved title error

---
 pages/hearing/1.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pages/hearing/1.tsx b/pages/hearing/1.tsx
index 19dcfd60f..b3579badc 100644
--- a/pages/hearing/1.tsx
+++ b/pages/hearing/1.tsx
@@ -3,7 +3,7 @@ import { createPage } from "../../components/page"
 import { createGetStaticTranslationProps } from "components/translations"
 
 export default createPage({
-  title: "Hearing",
+  titleI18nKey: "Hearing",
   Page: () => {
     return <HearingDetails />
   }

From c24b97e4cf0f03f8385a4aec3a92a2b8f9dac811 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 19:24:16 -0400
Subject: [PATCH 08/74] basic state vars

---
 components/hearing/HearingDetails.tsx | 14 ++++++++++----
 next-env.d.ts                         |  2 +-
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 2a020d2cf..cfe4c52a8 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -11,7 +11,6 @@ import { useCallback, useEffect, useRef, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
-import { DatagridCell } from "react-admin"
 
 const StyledContainer = styled(Container)`
   font-family: "Nunito";
@@ -20,23 +19,30 @@ const StyledContainer = styled(Container)`
 export const HearingDetails = () => {
   const { t } = useTranslation("common")
   const hearingId = "hearing-5180"
-  const [videoURL, setVideoURL] = useState("")
+
+  const [committeeName, setCommitteeName] = useState("")
   const [videoTranscriptionId, setVideoTranscriptionId] = useState("")
+  const [videoURL, setVideoURL] = useState("")
 
   const hearingData = useCallback(async () => {
     const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
     const docData = hearing.data()
     const content = docData?.content ?? "Default Content"
-    const videoTranscriptionId =
+
+    setCommitteeName(content.Name)
+    setVideoTranscriptionId(
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
+    )
     setVideoURL(docData?.videoURL ?? "Default URL")
 
     console.log("data: ", docData)
-    console.log("content Name: ", content.Name)
+    console.log("content: ", content)
   }, [])
 
   hearingData()
 
+  console.log("Committee: ", committeeName)
+  console.log("Id: ", videoTranscriptionId)
   console.log("url: ", videoURL)
 
   return (
diff --git a/next-env.d.ts b/next-env.d.ts
index a4a7b3f5c..4f11a03dc 100644
--- a/next-env.d.ts
+++ b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/basic-features/typescript for more information.

From 98280a2ca36735b3a30cd8e1821a4a1e1e007458 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Sun, 10 Aug 2025 19:54:23 -0400
Subject: [PATCH 09/74] useEffect

---
 components/hearing/HearingDetails.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index cfe4c52a8..f003237f8 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -39,7 +39,9 @@ export const HearingDetails = () => {
     console.log("content: ", content)
   }, [])
 
-  hearingData()
+  useEffect(() => {
+    hearingData()
+  }, [hearingData])
 
   console.log("Committee: ", committeeName)
   console.log("Id: ", videoTranscriptionId)

From 9256787313118159b389ca8bedd6592dc4e6cbc3 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 11 Aug 2025 12:22:43 -0400
Subject: [PATCH 10/74] committee tag

---
 components/hearing/HearingDetails.tsx | 33 ++++++++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index f003237f8..a59da6de4 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -12,15 +12,26 @@ import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 
+import * as links from "components/links"
+
 const StyledContainer = styled(Container)`
   font-family: "Nunito";
 `
 
+// same as SmartTagButton from bill/summary.tsx
+// consolidate as a shared component when there's time in future?
+const CommitteeButton = styled.button`
+  border-radius: 12px;
+  font-size: 12px;
+`
+
 export const HearingDetails = () => {
   const { t } = useTranslation("common")
   const hearingId = "hearing-5180"
 
+  const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
+  const [generalCourtNumber, setGeneralCourtNumber] = useState("")
   const [videoTranscriptionId, setVideoTranscriptionId] = useState("")
   const [videoURL, setVideoURL] = useState("")
 
@@ -29,7 +40,14 @@ export const HearingDetails = () => {
     const docData = hearing.data()
     const content = docData?.content ?? "Default Content"
 
-    setCommitteeName(content.Name)
+    setCommitteeCode(
+      docData?.content.HearingHost.CommitteeCode ?? "Default Committee Code"
+    )
+    setCommitteeName(docData?.content.Name ?? "Default Name")
+    setGeneralCourtNumber(
+      docData?.content.HearingHost.GeneralCourtNumber ??
+        "Default General Court Number"
+    )
     setVideoTranscriptionId(
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
@@ -44,12 +62,25 @@ export const HearingDetails = () => {
   }, [hearingData])
 
   console.log("Committee: ", committeeName)
+  console.log("Committee Code: ", committeeCode)
+  console.log("General Court Number", generalCourtNumber)
   console.log("Id: ", videoTranscriptionId)
   console.log("url: ", videoURL)
 
   return (
     <StyledContainer className="mt-3 mb-3">
       <h1>{t("hearing_transcription")}</h1>
+
+      <links.External
+        href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
+      >
+        <CommitteeButton
+          className={`btn btn-secondary d-flex text-nowrap mt-1 mx-1 p-1`}
+        >
+          &nbsp; {committeeName} &nbsp;
+        </CommitteeButton>
+      </links.External>
+
       <>Hello Hearing World, {videoURL}</>
     </StyledContainer>
   )

From 3779b978b17dae6a680541b840fc73301f20631a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 11 Aug 2025 16:31:52 -0400
Subject: [PATCH 11/74] dynamic routes

---
 components/hearing/HearingDetails.tsx | 17 ++++++++++------
 pages/hearing/1.tsx                   | 16 ---------------
 pages/hearing/[hearingId].tsx         | 28 +++++++++++++++++++++++++++
 3 files changed, 39 insertions(+), 22 deletions(-)
 delete mode 100644 pages/hearing/1.tsx
 create mode 100644 pages/hearing/[hearingId].tsx

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index a59da6de4..861091932 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -25,9 +25,17 @@ const CommitteeButton = styled.button`
   font-size: 12px;
 `
 
-export const HearingDetails = () => {
+export const HearingDetails = ({
+  hearingId
+}: {
+  hearingId: string | string[] | undefined
+}) => {
   const { t } = useTranslation("common")
-  const hearingId = "hearing-5180"
+  // const hearingId = "hearing-5180"
+  const hearingQuery = `hearing-${hearingId}`
+
+  console.log("hearing id: ", hearingId)
+  console.log("Q: ", hearingQuery)
 
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
@@ -36,7 +44,7 @@ export const HearingDetails = () => {
   const [videoURL, setVideoURL] = useState("")
 
   const hearingData = useCallback(async () => {
-    const hearing = await getDoc(doc(firestore, `events/${hearingId}`))
+    const hearing = await getDoc(doc(firestore, `events/${hearingQuery}`))
     const docData = hearing.data()
     const content = docData?.content ?? "Default Content"
 
@@ -61,9 +69,6 @@ export const HearingDetails = () => {
     hearingData()
   }, [hearingData])
 
-  console.log("Committee: ", committeeName)
-  console.log("Committee Code: ", committeeCode)
-  console.log("General Court Number", generalCourtNumber)
   console.log("Id: ", videoTranscriptionId)
   console.log("url: ", videoURL)
 
diff --git a/pages/hearing/1.tsx b/pages/hearing/1.tsx
deleted file mode 100644
index b3579badc..000000000
--- a/pages/hearing/1.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { HearingDetails } from "components/hearing/HearingDetails"
-import { createPage } from "../../components/page"
-import { createGetStaticTranslationProps } from "components/translations"
-
-export default createPage({
-  titleI18nKey: "Hearing",
-  Page: () => {
-    return <HearingDetails />
-  }
-})
-
-export const getStaticProps = createGetStaticTranslationProps([
-  "auth",
-  "common",
-  "footer"
-])
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
new file mode 100644
index 000000000..615fe0fd3
--- /dev/null
+++ b/pages/hearing/[hearingId].tsx
@@ -0,0 +1,28 @@
+import { GetServerSideProps } from "next"
+import { useRouter } from "next/router"
+import { serverSideTranslations } from "next-i18next/serverSideTranslations"
+import { HearingDetails } from "components/hearing/HearingDetails"
+import { createPage } from "../../components/page"
+
+export default createPage<{ hearingId: string }>({
+  titleI18nKey: "Hearing",
+  Page: () => {
+    const hearingId = useRouter().query.hearingId
+    return <HearingDetails hearingId={hearingId} />
+  }
+})
+
+export const getServerSideProps: GetServerSideProps = async ctx => {
+  ctx.res.setHeader(
+    "Cache-Control",
+    "public, s-maxage=10, stale-while-revalidate=59"
+  )
+
+  const locale = ctx.locale ?? ctx.defaultLocale ?? "en"
+
+  return {
+    props: {
+      ...(await serverSideTranslations(locale, ["auth", "common", "footer"]))
+    }
+  }
+}

From 2852fc713c75ddd2fd32f0faa2ade88718fe84d5 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 11 Aug 2025 16:47:25 -0400
Subject: [PATCH 12/74] cleanup

---
 components/hearing/HearingDetails.tsx | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 861091932..4aa6205fd 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -6,12 +6,12 @@ import {
   orderBy,
   query
 } from "firebase/firestore"
+import { useRouter } from "next/router"
 import { useTranslation } from "next-i18next"
 import { useCallback, useEffect, useRef, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
-
 import * as links from "components/links"
 
 const StyledContainer = styled(Container)`
@@ -31,7 +31,6 @@ export const HearingDetails = ({
   hearingId: string | string[] | undefined
 }) => {
   const { t } = useTranslation("common")
-  // const hearingId = "hearing-5180"
   const hearingQuery = `hearing-${hearingId}`
 
   console.log("hearing id: ", hearingId)
@@ -63,12 +62,24 @@ export const HearingDetails = ({
 
     console.log("data: ", docData)
     console.log("content: ", content)
-  }, [])
+  }, [hearingQuery])
 
   useEffect(() => {
     hearingData()
   }, [hearingData])
 
+  const router = useRouter()
+  useEffect(() => {
+    if (videoURL === "Default URL") {
+      router.push({ pathname: "/404" })
+    }
+  }, [router, videoURL])
+
+  // pathname: "/404" could possible replaced with a different
+  // page/sequence/message that's more specific to the problem
+  // i.e. "the hearing ID you're trying to reach is not on file,
+  // please choose another"
+
   console.log("Id: ", videoTranscriptionId)
   console.log("url: ", videoURL)
 

From 317f8b5e6537891f2598ffb8c5637238fa83d0d4 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 11 Aug 2025 17:05:42 -0400
Subject: [PATCH 13/74] columns

---
 components/hearing/HearingDetails.tsx | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 4aa6205fd..230279dc3 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -14,10 +14,6 @@ import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 
-const StyledContainer = styled(Container)`
-  font-family: "Nunito";
-`
-
 // same as SmartTagButton from bill/summary.tsx
 // consolidate as a shared component when there's time in future?
 const CommitteeButton = styled.button`
@@ -25,6 +21,16 @@ const CommitteeButton = styled.button`
   font-size: 12px;
 `
 
+const LegalContainer = styled(Container)`
+  background-color: white;
+  border-radius: 0.75rem;
+  padding: 1rem;
+`
+
+const StyledContainer = styled(Container)`
+  font-family: "Nunito";
+`
+
 export const HearingDetails = ({
   hearingId
 }: {
@@ -96,8 +102,14 @@ export const HearingDetails = ({
           &nbsp; {committeeName} &nbsp;
         </CommitteeButton>
       </links.External>
-
-      <>Hello Hearing World, {videoURL}</>
+      <div className={`row mt-4`}>
+        <div className={`col-md-8`}>
+          <LegalContainer />
+        </div>
+        <div className={`col-md-4`}>
+          <LegalContainer />
+        </div>
+      </div>
     </StyledContainer>
   )
 }

From 0536486b7c18040d05bf503c5f4e3b7c7d3fbd5a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 11 Aug 2025 17:46:13 -0400
Subject: [PATCH 14/74] disclaimer

---
 components/hearing/HearingDetails.tsx | 34 +++++++++++++++++++++++++--
 public/locales/en/common.json         |  6 +++--
 2 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 230279dc3..ffad987c7 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -7,7 +7,7 @@ import {
   query
 } from "firebase/firestore"
 import { useRouter } from "next/router"
-import { useTranslation } from "next-i18next"
+import { Trans, useTranslation } from "next-i18next"
 import { useCallback, useEffect, useRef, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
@@ -104,7 +104,37 @@ export const HearingDetails = ({
       </links.External>
       <div className={`row mt-4`}>
         <div className={`col-md-8`}>
-          <LegalContainer />
+          <LegalContainer>
+            <Row
+              className={`d-flex align-items-center justify-content-between`}
+              fontSize={"12px"}
+              xs="auto"
+            >
+              <Col>
+                <div className={`fs-6 fw-bold`}>
+                  <Image
+                    src="/images/smart-summary.svg"
+                    alt={t("bill.smart_tag")}
+                    height={`30`}
+                    width={`21`}
+                    className={`me-2`}
+                  />
+                  {t("bill.smart_disclaimer2")}
+                </div>
+              </Col>
+
+              <Col>
+                <Trans
+                  t={t}
+                  i18nKey="bill.smart_disclaimer3"
+                  components={[
+                    // eslint-disable-next-line react/jsx-key
+                    <links.Internal href="/about/how-maple-uses-ai" />
+                  ]}
+                />
+              </Col>
+            </Row>
+          </LegalContainer>
         </div>
         <div className={`col-md-4`}>
           <LegalContainer />
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index c6499ac43..d80df2ed5 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -29,9 +29,11 @@
       "technology_and_communications": "Technology and Communications",
       "transportation_and_public_works": "Transportation and Public Works"
     },
-    "smart_tag": "AI Smart Tag",
+    "smart_disclaimer": "This content has been generated using artificial intelligence and may not accurately reflect the details of the legislation. Learn more about <0>how MAPLE uses AI</0>. To report an inaccuracy or to suggest an improvement, please email admin@mapletestimony.org",
+    "smart_disclaimer2": "This transcription was made with generative AI.",
+    "smart_disclaimer3": "<0>how MAPLE uses AI</0>",
     "smart_summary": "Smart Summary & Tags",
-    "smart_disclaimer": "This content has been generated using artificial intelligence and may not accurately reflect the details of the legislation. Learn more about <0>how MAPLE uses AI</0>. To report an inaccuracy or to suggest an improvement, please email admin@mapletestimony.org"
+    "smart_tag": "AI Smart Tag"    
   },
   "bill_updates": "Bill Updates",
   "browse_bills": "browse bills",

From 5bb9eda3ae36479cc2494cc58e05d1ebed1c3d76 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 11:13:14 -0400
Subject: [PATCH 15/74] responsive iframes

---
 components/hearing/HearingDetails.tsx | 39 ++++++++++++++++++++-------
 1 file changed, 30 insertions(+), 9 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index ffad987c7..587efe1e4 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -24,13 +24,28 @@ const CommitteeButton = styled.button`
 const LegalContainer = styled(Container)`
   background-color: white;
   border-radius: 0.75rem;
-  padding: 1rem;
 `
 
 const StyledContainer = styled(Container)`
   font-family: "Nunito";
 `
 
+const IFrameChild = styled.iframe`
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border: none;
+`
+
+const IFrameParent = styled.div`
+  position: relative;
+  width: 100%;
+  padding-top: 56.25%; /* For 16:9 aspect ratio */
+  overflow: hidden;
+`
+
 export const HearingDetails = ({
   hearingId
 }: {
@@ -104,26 +119,26 @@ export const HearingDetails = ({
       </links.External>
       <div className={`row mt-4`}>
         <div className={`col-md-8`}>
-          <LegalContainer>
+          <LegalContainer className={`pb-2`}>
             <Row
               className={`d-flex align-items-center justify-content-between`}
               fontSize={"12px"}
               xs="auto"
             >
-              <Col>
-                <div className={`fs-6 fw-bold`}>
+              <Col className={`mt-1`}>
+                <div className={`fs-6 fw-bold mt-1`}>
                   <Image
                     src="/images/smart-summary.svg"
                     alt={t("bill.smart_tag")}
-                    height={`30`}
-                    width={`21`}
-                    className={`me-2`}
+                    height={`34`}
+                    width={`24`}
+                    className={`me-2 pb-1`}
                   />
                   {t("bill.smart_disclaimer2")}
                 </div>
               </Col>
 
-              <Col>
+              <Col className={`mt-1`}>
                 <Trans
                   t={t}
                   i18nKey="bill.smart_disclaimer3"
@@ -135,9 +150,15 @@ export const HearingDetails = ({
               </Col>
             </Row>
           </LegalContainer>
+          <IFrameParent className={`my-3`}>
+            <IFrameChild src={videoURL} />
+          </IFrameParent>
         </div>
         <div className={`col-md-4`}>
-          <LegalContainer />
+          <LegalContainer className={`py-4`}>
+            <p>2nd Column Placeholder</p>
+            <p>replace me with sidebar</p>
+          </LegalContainer>
         </div>
       </div>
     </StyledContainer>

From a60a9a881a18f2a7c6c5cc1479a8adc5c61b0308 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 11:23:11 -0400
Subject: [PATCH 16/74] replace iframes with video

---
 components/hearing/HearingDetails.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 587efe1e4..54917aea0 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -30,7 +30,7 @@ const StyledContainer = styled(Container)`
   font-family: "Nunito";
 `
 
-const IFrameChild = styled.iframe`
+const VideoChild = styled.video`
   position: absolute;
   top: 0;
   left: 0;
@@ -39,7 +39,7 @@ const IFrameChild = styled.iframe`
   border: none;
 `
 
-const IFrameParent = styled.div`
+const VideoParent = styled.div`
   position: relative;
   width: 100%;
   padding-top: 56.25%; /* For 16:9 aspect ratio */
@@ -118,7 +118,7 @@ export const HearingDetails = ({
         </CommitteeButton>
       </links.External>
       <div className={`row mt-4`}>
-        <div className={`col-md-8`}>
+        <Col className={`col-md-8`}>
           <LegalContainer className={`pb-2`}>
             <Row
               className={`d-flex align-items-center justify-content-between`}
@@ -150,10 +150,10 @@ export const HearingDetails = ({
               </Col>
             </Row>
           </LegalContainer>
-          <IFrameParent className={`my-3`}>
-            <IFrameChild src={videoURL} />
-          </IFrameParent>
-        </div>
+          <VideoParent className={`my-3`}>
+            <VideoChild src={videoURL} controls />
+          </VideoParent>
+        </Col>
         <div className={`col-md-4`}>
           <LegalContainer className={`py-4`}>
             <p>2nd Column Placeholder</p>

From 82308739d43fdf8121c2294f5a2f594d38976391 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 11:46:35 -0400
Subject: [PATCH 17/74] cleanup

---
 components/hearing/HearingDetails.tsx | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 54917aea0..afc1bdb7c 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -1,14 +1,7 @@
-import {
-  collection,
-  doc,
-  getDoc,
-  getDocs,
-  orderBy,
-  query
-} from "firebase/firestore"
+import { doc, getDoc } from "firebase/firestore"
 import { useRouter } from "next/router"
 import { Trans, useTranslation } from "next-i18next"
-import { useCallback, useEffect, useRef, useState } from "react"
+import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
@@ -54,9 +47,6 @@ export const HearingDetails = ({
   const { t } = useTranslation("common")
   const hearingQuery = `hearing-${hearingId}`
 
-  console.log("hearing id: ", hearingId)
-  console.log("Q: ", hearingQuery)
-
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
   const [generalCourtNumber, setGeneralCourtNumber] = useState("")
@@ -153,6 +143,9 @@ export const HearingDetails = ({
           <VideoParent className={`my-3`}>
             <VideoChild src={videoURL} controls />
           </VideoParent>
+          <LegalContainer className={`my-3`}>
+            Transcriptions go here
+          </LegalContainer>
         </Col>
         <div className={`col-md-4`}>
           <LegalContainer className={`py-4`}>

From 45f73730ebb057ba46c94ad7924a6ee4af4932ad Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 13:16:19 -0400
Subject: [PATCH 18/74] cleanup2

---
 components/hearing/HearingDetails.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index afc1bdb7c..48d1691e6 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -7,8 +7,6 @@ import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 
-// same as SmartTagButton from bill/summary.tsx
-// consolidate as a shared component when there's time in future?
 const CommitteeButton = styled.button`
   border-radius: 12px;
   font-size: 12px;
@@ -90,9 +88,11 @@ export const HearingDetails = ({
   // page/sequence/message that's more specific to the problem
   // i.e. "the hearing ID you're trying to reach is not on file,
   // please choose another"
+  //
+  // see pages/bills/[court]/[billId.tsx] ln 32 - 35 for possible
+  // improved method
 
   console.log("Id: ", videoTranscriptionId)
-  console.log("url: ", videoURL)
 
   return (
     <StyledContainer className="mt-3 mb-3">

From 866ac0121b564d0a53a29e011ffb825090218bc8 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 13:47:04 -0400
Subject: [PATCH 19/74] cleanup3

---
 components/hearing/HearingDetails.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 48d1691e6..59a2dbb0a 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -54,7 +54,6 @@ export const HearingDetails = ({
   const hearingData = useCallback(async () => {
     const hearing = await getDoc(doc(firestore, `events/${hearingQuery}`))
     const docData = hearing.data()
-    const content = docData?.content ?? "Default Content"
 
     setCommitteeCode(
       docData?.content.HearingHost.CommitteeCode ?? "Default Committee Code"
@@ -70,7 +69,7 @@ export const HearingDetails = ({
     setVideoURL(docData?.videoURL ?? "Default URL")
 
     console.log("data: ", docData)
-    console.log("content: ", content)
+    console.log("content: ", docData?.content)
   }, [hearingQuery])
 
   useEffect(() => {

From 1aba5b4b0edc7143f9d6ec78182af86c6bec41eb Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 16:14:43 -0400
Subject: [PATCH 20/74] updated h1

---
 components/hearing/HearingDetails.tsx | 4 +++-
 public/locales/en/common.json         | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 59a2dbb0a..ddbb9a70d 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -95,7 +95,9 @@ export const HearingDetails = ({
 
   return (
     <StyledContainer className="mt-3 mb-3">
-      <h1>{t("hearing_transcription")}</h1>
+      <h1>
+        {t("hearing")} {hearingId}
+      </h1>
 
       <links.External
         href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index d80df2ed5..5f3836098 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -43,7 +43,7 @@
     "followed": "Followed"
   },
   "calendar": "Our Calendar",
-  "hearing_transcription": "Hearing Transcription",
+  "hearing": "Hearing ",
   "hideAns": "Hide Answer",
   "joinTraining": "and join an upcoming training session!",
   "learn": "Learn",

From b8af3fd72e590eb38572cf9aa035a6138c534d3a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 12 Aug 2025 20:45:24 -0400
Subject: [PATCH 21/74] cleanup

---
 components/hearing/HearingDetails.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index ddbb9a70d..22f82f93f 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -108,6 +108,7 @@ export const HearingDetails = ({
           &nbsp; {committeeName} &nbsp;
         </CommitteeButton>
       </links.External>
+
       <div className={`row mt-4`}>
         <Col className={`col-md-8`}>
           <LegalContainer className={`pb-2`}>
@@ -141,13 +142,16 @@ export const HearingDetails = ({
               </Col>
             </Row>
           </LegalContainer>
+
           <VideoParent className={`my-3`}>
             <VideoChild src={videoURL} controls />
           </VideoParent>
+
           <LegalContainer className={`my-3`}>
             Transcriptions go here
           </LegalContainer>
         </Col>
+
         <div className={`col-md-4`}>
           <LegalContainer className={`py-4`}>
             <p>2nd Column Placeholder</p>

From e1a5ddbbf79a0cd7ed78ee92ec7ee2689c5a0b91 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 14:37:53 -0400
Subject: [PATCH 22/74] transcriptions query

---
 components/hearing/HearingDetails.tsx |  8 ++--
 components/hearing/Transcriptions.tsx | 58 +++++++++++++++++++++++++++
 2 files changed, 62 insertions(+), 4 deletions(-)
 create mode 100644 components/hearing/Transcriptions.tsx

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 22f82f93f..84706c192 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -4,6 +4,7 @@ import { Trans, useTranslation } from "next-i18next"
 import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
+import { Transcriptions } from "./Transcriptions"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 
@@ -91,8 +92,6 @@ export const HearingDetails = ({
   // see pages/bills/[court]/[billId.tsx] ln 32 - 35 for possible
   // improved method
 
-  console.log("Id: ", videoTranscriptionId)
-
   return (
     <StyledContainer className="mt-3 mb-3">
       <h1>
@@ -147,9 +146,10 @@ export const HearingDetails = ({
             <VideoChild src={videoURL} controls />
           </VideoParent>
 
-          <LegalContainer className={`my-3`}>
+          {/* <LegalContainer className={`my-3`}>
             Transcriptions go here
-          </LegalContainer>
+          </LegalContainer> */}
+          <Transcriptions videoTranscriptionId={videoTranscriptionId} />
         </Col>
 
         <div className={`col-md-4`}>
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
new file mode 100644
index 000000000..f0c38ac85
--- /dev/null
+++ b/components/hearing/Transcriptions.tsx
@@ -0,0 +1,58 @@
+import {
+  collection,
+  doc,
+  getDoc,
+  getDocs,
+  orderBy,
+  query
+} from "firebase/firestore"
+import { useRouter } from "next/router"
+import { Trans, useTranslation } from "next-i18next"
+import { useCallback, useEffect, useState } from "react"
+import styled from "styled-components"
+import { Col, Container, Image, Row } from "../bootstrap"
+import { firestore } from "components/firebase"
+import * as links from "components/links"
+
+const TranscriptionContainer = styled(Container)`
+  background-color: white;
+  border-radius: 0.75rem;
+`
+
+export const Transcriptions = ({
+  videoTranscriptionId
+}: {
+  videoTranscriptionId: string
+}) => {
+  if (videoTranscriptionId === "Default Video Transcripton Id") {
+    videoTranscriptionId = ""
+  }
+
+  console.log("Id: ", videoTranscriptionId)
+
+  const subscriptionRef = collection(
+    firestore,
+    `transcriptions/${videoTranscriptionId}/paragraghs`
+  )
+
+  const transcriptionData = useCallback(async () => {
+    const q = query(subscriptionRef, orderBy("startsAt", "asc"))
+    const querySnapshot = await getDocs(q)
+  }, [subscriptionRef])
+
+  useEffect(() => {
+    transcriptionData()
+  }, [transcriptionData])
+
+  return (
+    <>
+      {videoTranscriptionId ? (
+        <TranscriptionContainer>
+          Hello Transcription World
+        </TranscriptionContainer>
+      ) : (
+        <></>
+      )}
+    </>
+  )
+}

From d14e6e1b6ea02fd4bcd6555846153a8eed9bb46a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 15:40:01 -0400
Subject: [PATCH 23/74] transcription data firestore

---
 components/hearing/Transcriptions.tsx | 32 ++++++++++++++++++++++-----
 1 file changed, 27 insertions(+), 5 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index f0c38ac85..d2b5c4209 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -14,6 +14,13 @@ import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 
+type DocElement = {
+  confidence: number
+  end: number
+  start: number
+  text: string
+}
+
 const TranscriptionContainer = styled(Container)`
   background-color: white;
   border-radius: 0.75rem;
@@ -24,26 +31,41 @@ export const Transcriptions = ({
 }: {
   videoTranscriptionId: string
 }) => {
-  if (videoTranscriptionId === "Default Video Transcripton Id") {
-    videoTranscriptionId = ""
-  }
-
   console.log("Id: ", videoTranscriptionId)
 
+  let videoTranscriptionURL = videoTranscriptionId || "Default Value"
+
   const subscriptionRef = collection(
     firestore,
-    `transcriptions/${videoTranscriptionId}/paragraghs`
+    `transcriptions/${videoTranscriptionURL}/paragraphs`
   )
 
+  const [transData, setTransData] = useState<DocElement[]>([])
+
   const transcriptionData = useCallback(async () => {
+    let docList: DocElement[] = []
+
     const q = query(subscriptionRef, orderBy("startsAt", "asc"))
     const querySnapshot = await getDocs(q)
+
+    console.log("q: ", querySnapshot)
+
+    querySnapshot.forEach(doc => {
+      // doc.data() is never undefined for query doc snapshots
+      docList.push(doc.data().text)
+    })
+
+    if (docList.length != 0) {
+      setTransData(docList)
+    }
   }, [subscriptionRef])
 
   useEffect(() => {
     transcriptionData()
   }, [transcriptionData])
 
+  console.log("T Data: ", transData)
+
   return (
     <>
       {videoTranscriptionId ? (

From 77fd1bf5fe000e5586743cd23a144376d6343cb6 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 16:13:39 -0400
Subject: [PATCH 24/74] working on firestore

---
 components/hearing/Transcriptions.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index d2b5c4209..06a7df0fd 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -33,7 +33,10 @@ export const Transcriptions = ({
 }) => {
   console.log("Id: ", videoTranscriptionId)
 
-  let videoTranscriptionURL = videoTranscriptionId || "Default Value"
+  // let videoTranscriptionURL = videoTranscriptionId || "Default Value"
+  // temporarily set to a value that contains `paragraphs` as not all transcriptions do
+
+  let videoTranscriptionURL = "026df538-3a98-4c70-83e3-41e41d2507fd"
 
   const subscriptionRef = collection(
     firestore,

From 9bd74c09a4a3bf01859e8c05620954a2bd4ae8c8 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 16:15:00 -0400
Subject: [PATCH 25/74] cleanup

---
 components/hearing/HearingDetails.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 84706c192..01d303db1 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -146,9 +146,6 @@ export const HearingDetails = ({
             <VideoChild src={videoURL} controls />
           </VideoParent>
 
-          {/* <LegalContainer className={`my-3`}>
-            Transcriptions go here
-          </LegalContainer> */}
           <Transcriptions videoTranscriptionId={videoTranscriptionId} />
         </Col>
 

From aeb594a4f3a1367998a48796909597979b7815f2 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 16:27:56 -0400
Subject: [PATCH 26/74] cleanup

---
 components/hearing/Transcriptions.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 06a7df0fd..b07829ae5 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -46,7 +46,7 @@ export const Transcriptions = ({
   const [transData, setTransData] = useState<DocElement[]>([])
 
   const transcriptionData = useCallback(async () => {
-    let docList: DocElement[] = []
+    let docList = []
 
     const q = query(subscriptionRef, orderBy("startsAt", "asc"))
     const querySnapshot = await getDocs(q)
@@ -55,7 +55,7 @@ export const Transcriptions = ({
 
     querySnapshot.forEach(doc => {
       // doc.data() is never undefined for query doc snapshots
-      docList.push(doc.data().text)
+      docList.push(doc.data())
     })
 
     if (docList.length != 0) {

From af6d66f749a0f27b811693912f419f582782dcf7 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 17:56:29 -0400
Subject: [PATCH 27/74] alternate bad code filtering

---
 components/db/events.ts               |  2 +-
 components/hearing/HearingDetails.tsx | 12 ++++++------
 components/hearing/Transcriptions.tsx | 10 ++++------
 pages/hearing/[hearingId].tsx         |  7 +++++++
 4 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/components/db/events.ts b/components/db/events.ts
index 6af3881ab..277f89c8d 100644
--- a/components/db/events.ts
+++ b/components/db/events.ts
@@ -94,7 +94,7 @@ export async function listUpcomingEvents(types?: Event["type"][]) {
       eventsRef,
       types && where("type", "in", types),
       where("startsAt", ">=", midnight()),
-      orderBy("startsAt", "asc")
+      orderBy("starts", "asc")
     )
   )
 
diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 01d303db1..0459dae91 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -77,12 +77,12 @@ export const HearingDetails = ({
     hearingData()
   }, [hearingData])
 
-  const router = useRouter()
-  useEffect(() => {
-    if (videoURL === "Default URL") {
-      router.push({ pathname: "/404" })
-    }
-  }, [router, videoURL])
+  // const router = useRouter()
+  // useEffect(() => {
+  //   if (videoURL === "Default URL") {
+  //     router.push({ pathname: "/404" })
+  //   }
+  // }, [router, videoURL])
 
   // pathname: "/404" could possible replaced with a different
   // page/sequence/message that's more specific to the problem
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index b07829ae5..ecee0560d 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -46,22 +46,20 @@ export const Transcriptions = ({
   const [transData, setTransData] = useState<DocElement[]>([])
 
   const transcriptionData = useCallback(async () => {
-    let docList = []
+    let docList: any[] = []
 
-    const q = query(subscriptionRef, orderBy("startsAt", "asc"))
+    const q = query(subscriptionRef, orderBy("start"))
     const querySnapshot = await getDocs(q)
 
-    console.log("q: ", querySnapshot)
-
     querySnapshot.forEach(doc => {
       // doc.data() is never undefined for query doc snapshots
       docList.push(doc.data())
     })
 
-    if (docList.length != 0) {
+    if (transData.length === 0 && docList.length != 0) {
       setTransData(docList)
     }
-  }, [subscriptionRef])
+  }, [subscriptionRef, transData])
 
   useEffect(() => {
     transcriptionData()
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 615fe0fd3..723643505 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -1,9 +1,12 @@
 import { GetServerSideProps } from "next"
 import { useRouter } from "next/router"
 import { serverSideTranslations } from "next-i18next/serverSideTranslations"
+import { z } from "zod"
 import { HearingDetails } from "components/hearing/HearingDetails"
 import { createPage } from "../../components/page"
 
+const Query = z.object({ hearingId: z.string({}) })
+
 export default createPage<{ hearingId: string }>({
   titleI18nKey: "Hearing",
   Page: () => {
@@ -20,6 +23,10 @@ export const getServerSideProps: GetServerSideProps = async ctx => {
 
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"
 
+  const query = Query.safeParse(ctx.query)
+  console.log("Query: ", query)
+  if (!query.success) return { notFound: true }
+
   return {
     props: {
       ...(await serverSideTranslations(locale, ["auth", "common", "footer"]))

From 0b1553249882032164e9d5b15d27087294a85ef6 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 18:03:25 -0400
Subject: [PATCH 28/74] alt zod attempt

---
 pages/hearing/[hearingId].tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 723643505..4a43af6b8 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -5,7 +5,7 @@ import { z } from "zod"
 import { HearingDetails } from "components/hearing/HearingDetails"
 import { createPage } from "../../components/page"
 
-const Query = z.object({ hearingId: z.string({}) })
+const Query = z.object({ hearingId: z.coerce.number() })
 
 export default createPage<{ hearingId: string }>({
   titleI18nKey: "Hearing",

From f4904b80f9c2426b177d9ae123f8fd691c41b7aa Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 18:14:01 -0400
Subject: [PATCH 29/74] reinstated videoURL sanity check

---
 components/hearing/HearingDetails.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 0459dae91..01d303db1 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -77,12 +77,12 @@ export const HearingDetails = ({
     hearingData()
   }, [hearingData])
 
-  // const router = useRouter()
-  // useEffect(() => {
-  //   if (videoURL === "Default URL") {
-  //     router.push({ pathname: "/404" })
-  //   }
-  // }, [router, videoURL])
+  const router = useRouter()
+  useEffect(() => {
+    if (videoURL === "Default URL") {
+      router.push({ pathname: "/404" })
+    }
+  }, [router, videoURL])
 
   // pathname: "/404" could possible replaced with a different
   // page/sequence/message that's more specific to the problem

From 0f8edf3ea676eaf2e4eeebbc0f5f9f2068367c43 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 18:51:19 -0400
Subject: [PATCH 30/74] zod attempt 3

---
 components/db/api.ts          | 3 +++
 pages/hearing/[hearingId].tsx | 6 ++++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/components/db/api.ts b/components/db/api.ts
index 2c5305102..22999ef3a 100644
--- a/components/db/api.ts
+++ b/components/db/api.ts
@@ -101,6 +101,9 @@ export class DbService {
   getBill = ({ court, billId }: BillQuery): Promise<Bill | undefined> =>
     this.getDocData<Bill>("generalCourts", court.toString(), "bills", billId)
 
+  getHearing = (hearingId: number): Promise<number | undefined> =>
+    this.getDocData<number>("hearingId", hearingId.toString())
+
   getProfile = async ({
     uid
   }: ProfileQuery): Promise<UserProfile | undefined> => {
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 4a43af6b8..c015cd313 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -2,12 +2,13 @@ import { GetServerSideProps } from "next"
 import { useRouter } from "next/router"
 import { serverSideTranslations } from "next-i18next/serverSideTranslations"
 import { z } from "zod"
+import { dbService } from "components/db/api"
 import { HearingDetails } from "components/hearing/HearingDetails"
 import { createPage } from "../../components/page"
 
 const Query = z.object({ hearingId: z.coerce.number() })
 
-export default createPage<{ hearingId: string }>({
+export default createPage<{ hearingId: number }>({
   titleI18nKey: "Hearing",
   Page: () => {
     const hearingId = useRouter().query.hearingId
@@ -24,8 +25,9 @@ export const getServerSideProps: GetServerSideProps = async ctx => {
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"
 
   const query = Query.safeParse(ctx.query)
-  console.log("Query: ", query)
   if (!query.success) return { notFound: true }
+  // const hearing = await dbService().getHearing(query.data.hearingId)
+  // if (!hearing) return { notFound: true }
 
   return {
     props: {

From b05debf30ef115c270828beab422a8b5c574671a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 19:09:07 -0400
Subject: [PATCH 31/74] transcriptions feed initial wiring

---
 components/hearing/Transcriptions.tsx | 52 ++++++++++++++++++++++++---
 1 file changed, 47 insertions(+), 5 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index ecee0560d..941e627ce 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -43,7 +43,7 @@ export const Transcriptions = ({
     `transcriptions/${videoTranscriptionURL}/paragraphs`
   )
 
-  const [transData, setTransData] = useState<DocElement[]>([])
+  const [transcriptData, setTranscriptData] = useState<DocElement[]>([])
 
   const transcriptionData = useCallback(async () => {
     let docList: any[] = []
@@ -56,22 +56,25 @@ export const Transcriptions = ({
       docList.push(doc.data())
     })
 
-    if (transData.length === 0 && docList.length != 0) {
-      setTransData(docList)
+    if (transcriptData.length === 0 && docList.length != 0) {
+      setTranscriptData(docList)
     }
-  }, [subscriptionRef, transData])
+  }, [subscriptionRef, transcriptData])
 
   useEffect(() => {
     transcriptionData()
   }, [transcriptionData])
 
-  console.log("T Data: ", transData)
+  console.log("T Data: ", transcriptData)
 
   return (
     <>
       {videoTranscriptionId ? (
         <TranscriptionContainer>
           Hello Transcription World
+          {transcriptData.map((element: DocElement, index: number) => (
+            <TranscriptItem key={index} index={index} element={element} />
+          ))}
         </TranscriptionContainer>
       ) : (
         <></>
@@ -79,3 +82,42 @@ export const Transcriptions = ({
     </>
   )
 }
+
+function TranscriptItem({ element }: { index: number; element: DocElement }) {
+  return (
+    // <div className={`fs-3 lh-lg`}>
+    //   <Row className={`align-items-center flex-column flex-md-row`}>
+    //     {isBillElement(element) ? (
+    //       <>
+    //         <Internal href={`/bills/${element.court}/${element.billId}`}>
+    //           {formatBillId(element.billId)}
+    //         </Internal>
+    //         <Col xs={12} md={8} className={`d-flex`}>
+    //           <BillFollowingTitle court={element.court} id={element.billId} />
+    //         </Col>
+    //       </>
+    //     ) : (
+    //       <>
+    //         <Col className={"align-items-center d-flex"}>
+    //           <OrgIconSmall
+    //             className="mr-4 mt-0 mb-0 ms-0"
+    //             profileImage={profile?.profileImage}
+    //           />
+    //           <Internal href={`/profile?id=${element.profileId}`}>
+    //             {profile?.fullName}
+    //           </Internal>
+    //         </Col>
+    //       </>
+    //     )}
+    //     <UnfollowButton
+    //       fullName={profile?.fullName ?? "default"}
+    //       element={element}
+    //       setUnfollow={setUnfollow}
+    //       type={type}
+    //     />
+    //   </Row>
+    //   <hr className={`mt-3`} />
+    // </div>
+    <div>{element.text}</div>
+  )
+}

From a750f0f901c1054c5fc04bf3ba3bed05b18787a9 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 19:19:24 -0400
Subject: [PATCH 32/74] basic columns

---
 components/hearing/Transcriptions.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 941e627ce..ebe272788 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -118,6 +118,11 @@ function TranscriptItem({ element }: { index: number; element: DocElement }) {
     //   </Row>
     //   <hr className={`mt-3`} />
     // </div>
-    <div>{element.text}</div>
+    <Row>
+      <Col>
+        {element.start} - {element.end}
+      </Col>
+      <Col>{element.text}</Col>
+    </Row>
   )
 }

From adcbf39be9683005e2a5dbc4e8d2f756417728b9 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 19:20:03 -0400
Subject: [PATCH 33/74] cleanup

---
 components/hearing/Transcriptions.tsx | 33 ---------------------------
 1 file changed, 33 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index ebe272788..7d0a66b25 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -85,39 +85,6 @@ export const Transcriptions = ({
 
 function TranscriptItem({ element }: { index: number; element: DocElement }) {
   return (
-    // <div className={`fs-3 lh-lg`}>
-    //   <Row className={`align-items-center flex-column flex-md-row`}>
-    //     {isBillElement(element) ? (
-    //       <>
-    //         <Internal href={`/bills/${element.court}/${element.billId}`}>
-    //           {formatBillId(element.billId)}
-    //         </Internal>
-    //         <Col xs={12} md={8} className={`d-flex`}>
-    //           <BillFollowingTitle court={element.court} id={element.billId} />
-    //         </Col>
-    //       </>
-    //     ) : (
-    //       <>
-    //         <Col className={"align-items-center d-flex"}>
-    //           <OrgIconSmall
-    //             className="mr-4 mt-0 mb-0 ms-0"
-    //             profileImage={profile?.profileImage}
-    //           />
-    //           <Internal href={`/profile?id=${element.profileId}`}>
-    //             {profile?.fullName}
-    //           </Internal>
-    //         </Col>
-    //       </>
-    //     )}
-    //     <UnfollowButton
-    //       fullName={profile?.fullName ?? "default"}
-    //       element={element}
-    //       setUnfollow={setUnfollow}
-    //       type={type}
-    //     />
-    //   </Row>
-    //   <hr className={`mt-3`} />
-    // </div>
     <Row>
       <Col>
         {element.start} - {element.end}

From 8f95b464665beefae65e72c1f51ab00292799c16 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 14 Aug 2025 19:35:43 -0400
Subject: [PATCH 34/74] cleanup

---
 components/hearing/Transcriptions.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 7d0a66b25..25274b64e 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -70,8 +70,8 @@ export const Transcriptions = ({
   return (
     <>
       {videoTranscriptionId ? (
+        // rewire this to check for transcription with actual paragraphs
         <TranscriptionContainer>
-          Hello Transcription World
           {transcriptData.map((element: DocElement, index: number) => (
             <TranscriptItem key={index} index={index} element={element} />
           ))}

From aae9e4db3ec637a33d6f06d4e7e15c566caa8089 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 14:36:43 -0400
Subject: [PATCH 35/74] handle transcription not on file

---
 components/db/api.ts                  |  6 ++++--
 components/hearing/Transcriptions.tsx | 13 ++++++++-----
 public/locales/en/common.json         |  9 +++++----
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/components/db/api.ts b/components/db/api.ts
index 22999ef3a..812645d31 100644
--- a/components/db/api.ts
+++ b/components/db/api.ts
@@ -101,8 +101,10 @@ export class DbService {
   getBill = ({ court, billId }: BillQuery): Promise<Bill | undefined> =>
     this.getDocData<Bill>("generalCourts", court.toString(), "bills", billId)
 
-  getHearing = (hearingId: number): Promise<number | undefined> =>
-    this.getDocData<number>("hearingId", hearingId.toString())
+  getHearing = (hearingId: number): any => {
+    const hearingQuery = `hearing-${hearingId}`
+    this.getDocData<string>("events", hearingQuery)
+  }
 
   getProfile = async ({
     uid
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 25274b64e..606ac9eb2 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -31,12 +31,14 @@ export const Transcriptions = ({
 }: {
   videoTranscriptionId: string
 }) => {
+  const { t } = useTranslation("common")
+
   console.log("Id: ", videoTranscriptionId)
 
-  // let videoTranscriptionURL = videoTranscriptionId || "Default Value"
+  let videoTranscriptionURL = videoTranscriptionId || "Default Value"
   // temporarily set to a value that contains `paragraphs` as not all transcriptions do
 
-  let videoTranscriptionURL = "026df538-3a98-4c70-83e3-41e41d2507fd"
+  // let videoTranscriptionURL = "026df538-3a98-4c70-83e3-41e41d2507fd"
 
   const subscriptionRef = collection(
     firestore,
@@ -69,15 +71,16 @@ export const Transcriptions = ({
 
   return (
     <>
-      {videoTranscriptionId ? (
-        // rewire this to check for transcription with actual paragraphs
+      {transcriptData.length > 0 ? (
         <TranscriptionContainer>
           {transcriptData.map((element: DocElement, index: number) => (
             <TranscriptItem key={index} index={index} element={element} />
           ))}
         </TranscriptionContainer>
       ) : (
-        <></>
+        <TranscriptionContainer className={`fs-6 fw-bold mb-1`}>
+          <div>{t("transcription_not_on_file")}</div>
+        </TranscriptionContainer>
       )}
     </>
   )
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 93f3cc3ca..c4bc3c3b2 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -2,10 +2,7 @@
   "about": "About",
   "back_to_bills": "back to list of bills",
   "bill": {
-    "old_session": "this bill is from session {{billCourt}} - not the current session",
-    "read_more": "Read More",
     "download_pdf": "Download PDF",
-    "view_bill": "View Bill Text",
     "icon": {
       "commerce": "Commerce",
       "crime_and_law_enforcement": "Crime and Law Enforcement",
@@ -29,11 +26,14 @@
       "technology_and_communications": "Technology and Communications",
       "transportation_and_public_works": "Transportation and Public Works"
     },
+    "old_session": "this bill is from session {{billCourt}} - not the current session",
+    "read_more": "Read More",
     "smart_disclaimer": "This content has been generated using artificial intelligence and may not accurately reflect the details of the legislation. Learn more about <0>how MAPLE uses AI</0>. To report an inaccuracy or to suggest an improvement, please email admin@mapletestimony.org",
     "smart_disclaimer2": "This transcription was made with generative AI.",
     "smart_disclaimer3": "<0>how MAPLE uses AI</0>",
     "smart_summary": "Smart Summary & Tags",
-    "smart_tag": "AI Smart Tag"    
+    "smart_tag": "AI Smart Tag",
+    "view_bill": "View Bill Text" 
   },
   "bill_updates": "Bill Updates",
   "browse_bills": "browse bills",
@@ -121,6 +121,7 @@
   "table": {
     "page": "Page {{currentPage}}"
   },
+  "transcription_not_on_file": "This hearing does not yet have a transcription on file",
   "titles": {
     "admin": "Admin",
     "bill": "Bill",

From ac411b6a69b1d3eb130ee94a16569e2c1066d59c Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 17:36:11 -0400
Subject: [PATCH 36/74] click timestamp -> seek video currentTime

---
 components/hearing/HearingDetails.tsx | 13 +++++++--
 components/hearing/Transcriptions.tsx | 39 ++++++++++++++++++++++-----
 2 files changed, 43 insertions(+), 9 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 01d303db1..daddcff0c 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -44,6 +44,12 @@ export const HearingDetails = ({
   hearingId: string | string[] | undefined
 }) => {
   const { t } = useTranslation("common")
+
+  let mainVid = document.getElementById("mainVid") as HTMLVideoElement
+  function setCurTimeVideo(value: number) {
+    mainVid.currentTime = value
+  }
+
   const hearingQuery = `hearing-${hearingId}`
 
   const [committeeCode, setCommitteeCode] = useState("")
@@ -143,10 +149,13 @@ export const HearingDetails = ({
           </LegalContainer>
 
           <VideoParent className={`my-3`}>
-            <VideoChild src={videoURL} controls />
+            <VideoChild id={`mainVid`} src={videoURL} controls muted />
           </VideoParent>
 
-          <Transcriptions videoTranscriptionId={videoTranscriptionId} />
+          <Transcriptions
+            setCurTimeVideo={setCurTimeVideo}
+            videoTranscriptionId={videoTranscriptionId}
+          />
         </Col>
 
         <div className={`col-md-4`}>
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 606ac9eb2..9c65f0d29 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -8,7 +8,7 @@ import {
 } from "firebase/firestore"
 import { useRouter } from "next/router"
 import { Trans, useTranslation } from "next-i18next"
-import { useCallback, useEffect, useState } from "react"
+import React, { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
@@ -27,8 +27,10 @@ const TranscriptionContainer = styled(Container)`
 `
 
 export const Transcriptions = ({
+  setCurTimeVideo,
   videoTranscriptionId
 }: {
+  setCurTimeVideo: any
   videoTranscriptionId: string
 }) => {
   const { t } = useTranslation("common")
@@ -36,9 +38,6 @@ export const Transcriptions = ({
   console.log("Id: ", videoTranscriptionId)
 
   let videoTranscriptionURL = videoTranscriptionId || "Default Value"
-  // temporarily set to a value that contains `paragraphs` as not all transcriptions do
-
-  // let videoTranscriptionURL = "026df538-3a98-4c70-83e3-41e41d2507fd"
 
   const subscriptionRef = collection(
     firestore,
@@ -74,7 +73,12 @@ export const Transcriptions = ({
       {transcriptData.length > 0 ? (
         <TranscriptionContainer>
           {transcriptData.map((element: DocElement, index: number) => (
-            <TranscriptItem key={index} index={index} element={element} />
+            <TranscriptItem
+              key={index}
+              index={index}
+              element={element}
+              setCurTimeVideo={setCurTimeVideo}
+            />
           ))}
         </TranscriptionContainer>
       ) : (
@@ -86,11 +90,32 @@ export const Transcriptions = ({
   )
 }
 
-function TranscriptItem({ element }: { index: number; element: DocElement }) {
+function TranscriptItem({
+  element,
+  setCurTimeVideo
+}: {
+  index: number
+  element: DocElement
+  setCurTimeVideo: any
+}) {
+  const handleClick = (val: number) => {
+    const valSeconds = val / 1000
+    setCurTimeVideo(valSeconds)
+  }
+
   return (
     <Row>
       <Col>
-        {element.start} - {element.end}
+        <button
+          onClick={() => {
+            handleClick(element.start)
+          }}
+          type="button"
+          value={element.start}
+        >
+          {element.start}
+        </button>{" "}
+        - {element.end}
       </Col>
       <Col>{element.text}</Col>
     </Row>

From 489f8bff34456a31f63ed2ffec982e2b8169b83d Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 17:46:25 -0400
Subject: [PATCH 37/74] end stamp

---
 components/hearing/Transcriptions.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 9c65f0d29..f3aabbccd 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -100,6 +100,8 @@ function TranscriptItem({
 }) {
   const handleClick = (val: number) => {
     const valSeconds = val / 1000
+    // data from backend is in milliseconds
+    // needs to be converted to seconds for <video> element
     setCurTimeVideo(valSeconds)
   }
 
@@ -115,7 +117,16 @@ function TranscriptItem({
         >
           {element.start}
         </button>{" "}
-        - {element.end}
+        -{" "}
+        <button
+          onClick={() => {
+            handleClick(element.end)
+          }}
+          type="button"
+          value={element.end}
+        >
+          {element.end}
+        </button>
       </Col>
       <Col>{element.text}</Col>
     </Row>

From b5d40337a25fec72adf26e90ca6bf448c39651e0 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 19:10:42 -0400
Subject: [PATCH 38/74] timestamp button

---
 components/hearing/HearingDetails.tsx | 25 ++++++++----
 components/hearing/Transcriptions.tsx | 56 +++++++++++++++++----------
 2 files changed, 52 insertions(+), 29 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index daddcff0c..a7e92747b 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -83,6 +83,11 @@ export const HearingDetails = ({
     hearingData()
   }, [hearingData])
 
+  let committeeCheck = true
+  if (committeeName == "Default Name") {
+    committeeCheck = false
+  }
+
   const router = useRouter()
   useEffect(() => {
     if (videoURL === "Default URL") {
@@ -104,15 +109,19 @@ export const HearingDetails = ({
         {t("hearing")} {hearingId}
       </h1>
 
-      <links.External
-        href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
-      >
-        <CommitteeButton
-          className={`btn btn-secondary d-flex text-nowrap mt-1 mx-1 p-1`}
+      {committeeCheck ? (
+        <links.External
+          href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
         >
-          &nbsp; {committeeName} &nbsp;
-        </CommitteeButton>
-      </links.External>
+          <CommitteeButton
+            className={`btn btn-secondary d-flex text-nowrap mt-1 mx-1 p-1`}
+          >
+            &nbsp; {committeeName} &nbsp;
+          </CommitteeButton>
+        </links.External>
+      ) : (
+        <></>
+      )}
 
       <div className={`row mt-4`}>
         <Col className={`col-md-8`}>
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index f3aabbccd..bce030a01 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -21,6 +21,15 @@ type DocElement = {
   text: string
 }
 
+const TimestampButton = styled.button`
+  border-radius: 12px;
+  width: min-content;
+`
+
+const TimestampCol = styled.div`
+  width: 100px;
+`
+
 const TranscriptionContainer = styled(Container)`
   background-color: white;
   border-radius: 0.75rem;
@@ -107,27 +116,32 @@ function TranscriptItem({
 
   return (
     <Row>
-      <Col>
-        <button
-          onClick={() => {
-            handleClick(element.start)
-          }}
-          type="button"
-          value={element.start}
-        >
-          {element.start}
-        </button>{" "}
-        -{" "}
-        <button
-          onClick={() => {
-            handleClick(element.end)
-          }}
-          type="button"
-          value={element.end}
-        >
-          {element.end}
-        </button>
-      </Col>
+      <TimestampCol>
+        <Row className={`d-inline`}>
+          <TimestampButton
+            onClick={() => {
+              handleClick(element.start)
+            }}
+            className={`btn btn-secondary text-nowrap mt-1 mx-1 p-1`}
+            type="button"
+            value={element.start}
+          >
+            {element.start}
+          </TimestampButton>
+          {/* &nbsp; - &nbsp; */}
+        </Row>
+        {/* <Row>
+          <TimestampButton
+            onClick={() => {
+              handleClick(element.end)
+            }}
+            type="button"
+            value={element.end}
+          >
+            {element.end}
+          </TimestampButton>
+        </Row> */}
+      </TimestampCol>
       <Col>{element.text}</Col>
     </Row>
   )

From ccddcde86e373bd52c9bc48f7b2cc19a7a982b31 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 19:18:38 -0400
Subject: [PATCH 39/74] format milliseconds

---
 components/hearing/Transcriptions.tsx | 21 +++++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index bce030a01..4618680be 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -114,8 +114,25 @@ function TranscriptItem({
     setCurTimeVideo(valSeconds)
   }
 
+  const formatMilliseconds = (ms: number) => {
+    const totalSeconds = Math.floor(ms / 1000)
+    const hours = Math.floor(totalSeconds / 3600)
+    const minutes = Math.floor((totalSeconds % 3600) / 60)
+    const seconds = totalSeconds % 60
+
+    const formattedHours = String(hours).padStart(2, "0")
+    const formattedMinutes = String(minutes).padStart(2, "0")
+    const formattedSeconds = String(seconds).padStart(2, "0")
+
+    if (hours >= 1) {
+      return `${formattedHours}:${formattedMinutes}:${formattedSeconds}`
+    } else {
+      return `${formattedMinutes}:${formattedSeconds}`
+    }
+  }
+
   return (
-    <Row>
+    <Row className={`mb-2`}>
       <TimestampCol>
         <Row className={`d-inline`}>
           <TimestampButton
@@ -126,7 +143,7 @@ function TranscriptItem({
             type="button"
             value={element.start}
           >
-            {element.start}
+            {formatMilliseconds(element.start)}
           </TimestampButton>
           {/* &nbsp; - &nbsp; */}
         </Row>

From 8c1fe9230d8558ec3db511842eec2459db38a308 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 19:23:41 -0400
Subject: [PATCH 40/74] added element end to timestamp button

---
 components/hearing/Transcriptions.tsx | 17 +++--------------
 1 file changed, 3 insertions(+), 14 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 4618680be..12c7ebf34 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -27,7 +27,7 @@ const TimestampButton = styled.button`
 `
 
 const TimestampCol = styled.div`
-  width: 100px;
+  width: 200px;
 `
 
 const TranscriptionContainer = styled(Container)`
@@ -143,21 +143,10 @@ function TranscriptItem({
             type="button"
             value={element.start}
           >
-            {formatMilliseconds(element.start)}
+            {formatMilliseconds(element.start)}-{" "}
+            {formatMilliseconds(element.end)}
           </TimestampButton>
-          {/* &nbsp; - &nbsp; */}
         </Row>
-        {/* <Row>
-          <TimestampButton
-            onClick={() => {
-              handleClick(element.end)
-            }}
-            type="button"
-            value={element.end}
-          >
-            {element.end}
-          </TimestampButton>
-        </Row> */}
       </TimestampCol>
       <Col>{element.text}</Col>
     </Row>

From 7b513a30ec613d1160082f16ed9aa0db58771ea4 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 19:30:47 -0400
Subject: [PATCH 41/74] remove end timestamp

---
 components/hearing/Transcriptions.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 12c7ebf34..62653b51e 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -27,7 +27,7 @@ const TimestampButton = styled.button`
 `
 
 const TimestampCol = styled.div`
-  width: 200px;
+  width: 100px;
 `
 
 const TranscriptionContainer = styled(Container)`
@@ -143,8 +143,7 @@ function TranscriptItem({
             type="button"
             value={element.start}
           >
-            {formatMilliseconds(element.start)}-{" "}
-            {formatMilliseconds(element.end)}
+            {formatMilliseconds(element.start)}
           </TimestampButton>
         </Row>
       </TimestampCol>

From ad59af26752a81351c2b2e91153ea4d4145509e6 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 20:38:56 -0400
Subject: [PATCH 42/74] alternating background colors

---
 components/hearing/Transcriptions.tsx | 55 +++++++++++++++++----------
 1 file changed, 35 insertions(+), 20 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 62653b51e..0ed8aec7d 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -30,11 +30,6 @@ const TimestampCol = styled.div`
   width: 100px;
 `
 
-const TranscriptionContainer = styled(Container)`
-  background-color: white;
-  border-radius: 0.75rem;
-`
-
 export const Transcriptions = ({
   setCurTimeVideo,
   videoTranscriptionId
@@ -80,37 +75,48 @@ export const Transcriptions = ({
   return (
     <>
       {transcriptData.length > 0 ? (
-        <TranscriptionContainer>
-          {transcriptData.map((element: DocElement, index: number) => (
-            <TranscriptItem
-              key={index}
-              index={index}
-              element={element}
-              setCurTimeVideo={setCurTimeVideo}
-            />
-          ))}
-        </TranscriptionContainer>
+        <Container className={`mb-2`}>
+          {transcriptData.map(
+            (element: DocElement, index: number, array: DocElement[]) => (
+              <TranscriptItem
+                key={index}
+                index={index}
+                element={element}
+                array={array}
+                setCurTimeVideo={setCurTimeVideo}
+              />
+            )
+          )}
+        </Container>
       ) : (
-        <TranscriptionContainer className={`fs-6 fw-bold mb-1`}>
+        <Container className={`fs-6 fw-bold mb-2`}>
           <div>{t("transcription_not_on_file")}</div>
-        </TranscriptionContainer>
+        </Container>
       )}
     </>
   )
 }
 
 function TranscriptItem({
+  index,
+  array,
   element,
   setCurTimeVideo
 }: {
   index: number
+  array: DocElement[]
   element: DocElement
   setCurTimeVideo: any
 }) {
+  const isLastItem = index === array.length - 1
+
   const handleClick = (val: number) => {
     const valSeconds = val / 1000
-    // data from backend is in milliseconds
-    // needs to be converted to seconds for <video> element
+    /* data from backend is in milliseconds
+     
+       needs to be converted to seconds to 
+       set currentTime property of <video> element */
+
     setCurTimeVideo(valSeconds)
   }
 
@@ -132,7 +138,16 @@ function TranscriptItem({
   }
 
   return (
-    <Row className={`mb-2`}>
+    <Row
+      className={``}
+      style={{
+        backgroundColor: index % 2 === 0 ? "white" : "#c0c4dc",
+        borderTopLeftRadius: index === 0 ? "0.75rem" : "0",
+        borderTopRightRadius: index === 0 ? "0.75rem" : "0",
+        borderBottomLeftRadius: isLastItem ? "0.75rem" : "0",
+        borderBottomRightRadius: isLastItem ? "0.75rem" : "0"
+      }}
+    >
       <TimestampCol>
         <Row className={`d-inline`}>
           <TimestampButton

From d440ab4d3d0d9bcd730e414c363bed109afc1c9a Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Mon, 18 Aug 2025 20:44:32 -0400
Subject: [PATCH 43/74] cleanup

---
 components/hearing/Transcriptions.tsx | 21 ++++-----------------
 1 file changed, 4 insertions(+), 17 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 0ed8aec7d..8dfdbe57b 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -1,18 +1,9 @@
-import {
-  collection,
-  doc,
-  getDoc,
-  getDocs,
-  orderBy,
-  query
-} from "firebase/firestore"
-import { useRouter } from "next/router"
-import { Trans, useTranslation } from "next-i18next"
+import { collection, getDocs, orderBy, query } from "firebase/firestore"
+import { useTranslation } from "next-i18next"
 import React, { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
-import { Col, Container, Image, Row } from "../bootstrap"
+import { Col, Container, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
-import * as links from "components/links"
 
 type DocElement = {
   confidence: number
@@ -39,8 +30,6 @@ export const Transcriptions = ({
 }) => {
   const { t } = useTranslation("common")
 
-  console.log("Id: ", videoTranscriptionId)
-
   let videoTranscriptionURL = videoTranscriptionId || "Default Value"
 
   const subscriptionRef = collection(
@@ -70,8 +59,6 @@ export const Transcriptions = ({
     transcriptionData()
   }, [transcriptionData])
 
-  console.log("T Data: ", transcriptData)
-
   return (
     <>
       {transcriptData.length > 0 ? (
@@ -154,7 +141,7 @@ function TranscriptItem({
             onClick={() => {
               handleClick(element.start)
             }}
-            className={`btn btn-secondary text-nowrap mt-1 mx-1 p-1`}
+            className={`btn btn-secondary text-nowrap m-1 p-1`}
             type="button"
             value={element.start}
           >

From 7adc0b1f2f4d22f749368e577ef78c2b4bda2091 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 14:26:52 -0400
Subject: [PATCH 44/74] sidebar

---
 components/hearing/HearingDetails.tsx | 14 ++++----
 components/hearing/HearingSidebar.tsx | 52 +++++++++++++++++++++++++++
 public/locales/en/common.json         |  4 ++-
 3 files changed, 62 insertions(+), 8 deletions(-)
 create mode 100644 components/hearing/HearingSidebar.tsx

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index a7e92747b..bcbd0b14e 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -4,6 +4,7 @@ import { Trans, useTranslation } from "next-i18next"
 import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
+import { HearingSidebar } from "./HearingSidebar"
 import { Transcriptions } from "./Transcriptions"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
@@ -55,6 +56,7 @@ export const HearingDetails = ({
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
   const [generalCourtNumber, setGeneralCourtNumber] = useState("")
+  const [hearingDate, setHearingDate] = useState("")
   const [videoTranscriptionId, setVideoTranscriptionId] = useState("")
   const [videoURL, setVideoURL] = useState("")
 
@@ -70,6 +72,7 @@ export const HearingDetails = ({
       docData?.content.HearingHost.GeneralCourtNumber ??
         "Default General Court Number"
     )
+    setHearingDate(docData?.content.EventDate ?? "Default Date")
     setVideoTranscriptionId(
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
@@ -131,8 +134,8 @@ export const HearingDetails = ({
               fontSize={"12px"}
               xs="auto"
             >
-              <Col className={`mt-1`}>
-                <div className={`fs-6 fw-bold mt-1`}>
+              <Col>
+                <div className={`fs-6 fw-bold mt-2`}>
                   <Image
                     src="/images/smart-summary.svg"
                     alt={t("bill.smart_tag")}
@@ -144,7 +147,7 @@ export const HearingDetails = ({
                 </div>
               </Col>
 
-              <Col className={`mt-1`}>
+              <Col>
                 <Trans
                   t={t}
                   i18nKey="bill.smart_disclaimer3"
@@ -168,10 +171,7 @@ export const HearingDetails = ({
         </Col>
 
         <div className={`col-md-4`}>
-          <LegalContainer className={`py-4`}>
-            <p>2nd Column Placeholder</p>
-            <p>replace me with sidebar</p>
-          </LegalContainer>
+          <HearingSidebar hearingDate={hearingDate} />
         </div>
       </div>
     </StyledContainer>
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
new file mode 100644
index 000000000..6535c3309
--- /dev/null
+++ b/components/hearing/HearingSidebar.tsx
@@ -0,0 +1,52 @@
+import { parseISO, format } from "date-fns"
+import { doc, getDoc } from "firebase/firestore"
+import { useRouter } from "next/router"
+import { Trans, useTranslation } from "next-i18next"
+import { useCallback, useEffect, useState } from "react"
+import styled from "styled-components"
+import { Col, Container, Image, Row } from "../bootstrap"
+import { Transcriptions } from "./Transcriptions"
+import { firestore } from "components/firebase"
+import * as links from "components/links"
+
+const SidebarBody = styled.div`
+  background-color: white;
+`
+
+const SidebarSubbody = styled.div`
+  font-size: 0.85rem;
+`
+
+const SidebarHeader = styled.div`
+  background-color: #c0c4dc;
+  border-top-left-radius: 0.75rem;
+  border-top-right-radius: 0.75rem;
+  padding-top: 9px;
+`
+
+export const HearingSidebar = ({ hearingDate }: { hearingDate: string }) => {
+  const { t } = useTranslation("common")
+
+  const dateObject = new Date(hearingDate)
+  const formattedDate = dateObject.toLocaleDateString("en-US", {
+    month: "long",
+    day: "2-digit",
+    year: "numeric"
+  })
+
+  console.log("Start Time: ", formattedDate)
+
+  return (
+    <>
+      <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
+        {t("hearing_details")}
+      </SidebarHeader>
+      <SidebarBody className={`fs-6 fw-bold px-3 py-3`}>
+        <SidebarSubbody className={`mb-1`}>
+          {t("recording_date")}
+        </SidebarSubbody>
+        <div className={`fw-normal`}>{formattedDate}</div>
+      </SidebarBody>
+    </>
+  )
+}
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 657feecbb..22bce0e03 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -65,6 +65,7 @@
   },
   "calendar": "Our Calendar",
   "hearing": "Hearing ",
+  "hearing_details": "Hearing details",
   "hideAns": "Hide Answer",
   "date": "{{date, datetime(year: 'numeric'; month: 'long'; day: 'numeric')}}",
   "joinTraining": "and join an upcoming training session!",
@@ -130,8 +131,9 @@
     "header": "Organization Request In Progress",
     "content": "Your request to be upgraded to an organization is currently in progress. You will be notified by email when your request has been reviewed."
   },
-  "short_description": "MAPLE makes it easy for anyone to view and submit testimony to the Massachusetts Legislature about the bills that will shape our future.",
   "primarySponsor": "Primary Sponsor",
+  "recording_date": "Recording date",
+  "short_description": "MAPLE makes it easy for anyone to view and submit testimony to the Massachusetts Legislature about the bills that will shape our future.",
   "showAns": "Show Answer",
   "socials": {
     "instagram": "Instagram",

From 6a8d74d398c7a2b2620fd9caba321750b1ecb108 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 16:49:29 -0400
Subject: [PATCH 45/74] sidebar chairmembers

---
 components/hearing/HearingDetails.tsx |   7 +-
 components/hearing/HearingSidebar.tsx | 127 +++++++++++++++++++++++++-
 public/locales/en/common.json         |   2 +
 3 files changed, 132 insertions(+), 4 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index bcbd0b14e..1c7ebb553 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -171,7 +171,12 @@ export const HearingDetails = ({
         </Col>
 
         <div className={`col-md-4`}>
-          <HearingSidebar hearingDate={hearingDate} />
+          <HearingSidebar
+            committeeCheck={committeeCheck}
+            committeeCode={committeeCode}
+            generalCourtNumber={generalCourtNumber}
+            hearingDate={hearingDate}
+          />
         </div>
       </div>
     </StyledContainer>
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 6535c3309..8fa87b7cf 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -8,6 +8,7 @@ import { Col, Container, Image, Row } from "../bootstrap"
 import { Transcriptions } from "./Transcriptions"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
+import { LabeledIcon } from "components/shared"
 
 const SidebarBody = styled.div`
   background-color: white;
@@ -24,7 +25,17 @@ const SidebarHeader = styled.div`
   padding-top: 9px;
 `
 
-export const HearingSidebar = ({ hearingDate }: { hearingDate: string }) => {
+export const HearingSidebar = ({
+  committeeCheck,
+  committeeCode,
+  generalCourtNumber,
+  hearingDate
+}: {
+  committeeCheck: boolean
+  committeeCode: string
+  generalCourtNumber: string
+  hearingDate: string
+}) => {
   const { t } = useTranslation("common")
 
   const dateObject = new Date(hearingDate)
@@ -34,19 +45,129 @@ export const HearingSidebar = ({ hearingDate }: { hearingDate: string }) => {
     year: "numeric"
   })
 
-  console.log("Start Time: ", formattedDate)
+  console.log("C Code: ", committeeCode)
+
+  interface Members {
+    id: string
+    name: string
+  }
+
+  interface Legislator {
+    Details: string
+    GeneralCourtNumber: number
+    MemberCode: string
+  }
+
+  const [houseChairName, setHouseChairName] = useState<string>("")
+  const [houseChairperson, setHouseChairperson] = useState<Legislator>()
+  const [senateChairName, setSenateChairName] = useState<string>("")
+  const [senateChairperson, setSenateChairperson] = useState<Legislator>()
+
+  const CommitteeData = useCallback(async () => {
+    const committee = await getDoc(
+      doc(
+        firestore,
+        `generalCourts/${generalCourtNumber}/committees/${committeeCode}`
+      )
+    )
+    const docData = committee.data()
+
+    setHouseChairperson(docData?.content.HouseChairperson)
+    setSenateChairperson(docData?.content.SenateChairperson)
+
+    const members: Members[] = docData?.members ?? []
+
+    const houseMembers =
+      docData?.content?.HouseChairperson?.MemberCode ?? "Default Code"
+    const houseMember =
+      members.find(member => member.id === houseMembers) ?? "Default Member"
+    let houseName = "Default Name"
+    if (houseMember != "Default Member") {
+      houseName = houseMember.name
+    }
+
+    const senateMembers =
+      docData?.content?.SenateChairperson?.MemberCode ?? "Default Code"
+    const senateMember =
+      members.find(member => member.id === senateMembers) ?? "Default Member"
+    let senateName = "Default Name"
+    if (senateMember != "Default Member") {
+      senateName = senateMember.name
+    }
+
+    setHouseChairName(houseName)
+    setSenateChairName(senateName)
+
+    console.log("Comm data: ", docData)
+  }, [committeeCode, generalCourtNumber])
+
+  useEffect(() => {
+    committeeCode && generalCourtNumber ? CommitteeData() : null
+  }, [committeeCode, CommitteeData, generalCourtNumber])
+
+  console.log("H Chair: ", houseChairperson)
+  console.log("H Name: ", houseChairName)
+  console.log("S Chair: ", senateChairperson?.MemberCode)
+  console.log("S Name: ", senateChairName)
 
   return (
     <>
       <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
         {t("hearing_details")}
       </SidebarHeader>
-      <SidebarBody className={`fs-6 fw-bold px-3 py-3`}>
+      <SidebarBody className={`border-bottom fs-6 fw-bold px-3 py-3`}>
         <SidebarSubbody className={`mb-1`}>
           {t("recording_date")}
         </SidebarSubbody>
         <div className={`fw-normal`}>{formattedDate}</div>
       </SidebarBody>
+      {committeeCheck && (
+        <SidebarBody
+          className={`border-top fs-6 fw-bold px-3 py-3`}
+          style={{
+            borderBottomLeftRadius: "0.75rem",
+            borderBottomRightRadius: "0.75rem"
+          }}
+          // style is temporary until next section is complete
+        >
+          {t("committee_members")}
+          <SidebarSubbody className={`mb-1 mt-2`}>
+            {t("chairs")}
+            <div>
+              {houseChairperson && (
+                <LabeledIcon
+                  idImage={`https://malegislature.gov/Legislators/Profile/170/${houseChairperson.MemberCode}.jpg`}
+                  // mainText={t("leadSponsor")}
+                  mainText={``}
+                  subText={
+                    <links.External
+                      href={`https://malegislature.gov/Legislators/Profile/${houseChairperson.MemberCode}`}
+                    >
+                      {senateChairName}
+                    </links.External>
+                  }
+                />
+              )}
+            </div>
+            <div>
+              {senateChairperson && (
+                <LabeledIcon
+                  idImage={`https://malegislature.gov/Legislators/Profile/170/${senateChairperson.MemberCode}.jpg`}
+                  // mainText={t("leadSponsor")}
+                  mainText={``}
+                  subText={
+                    <links.External
+                      href={`https://malegislature.gov/Legislators/Profile/${senateChairperson.MemberCode}`}
+                    >
+                      {senateChairName}
+                    </links.External>
+                  }
+                />
+              )}
+            </div>
+          </SidebarSubbody>
+        </SidebarBody>
+      )}
     </>
   )
 }
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 22bce0e03..979944918 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -64,6 +64,8 @@
     "followed": "Followed"
   },
   "calendar": "Our Calendar",
+  "chairs": "Chairs",
+  "committee_members": "Committee members",
   "hearing": "Hearing ",
   "hearing_details": "Hearing details",
   "hideAns": "Hide Answer",

From 0ca12d0ab0f6f74aec0906dff993ac6ccfe3af05 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 16:59:57 -0400
Subject: [PATCH 46/74] error container

---
 components/hearing/HearingSidebar.tsx | 4 ++--
 components/hearing/Transcriptions.tsx | 8 ++++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 8fa87b7cf..83c0bd657 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -138,7 +138,7 @@ export const HearingSidebar = ({
                 <LabeledIcon
                   idImage={`https://malegislature.gov/Legislators/Profile/170/${houseChairperson.MemberCode}.jpg`}
                   // mainText={t("leadSponsor")}
-                  mainText={``}
+                  mainText={`House Chair`}
                   subText={
                     <links.External
                       href={`https://malegislature.gov/Legislators/Profile/${houseChairperson.MemberCode}`}
@@ -154,7 +154,7 @@ export const HearingSidebar = ({
                 <LabeledIcon
                   idImage={`https://malegislature.gov/Legislators/Profile/170/${senateChairperson.MemberCode}.jpg`}
                   // mainText={t("leadSponsor")}
-                  mainText={``}
+                  mainText={`Senate Chair`}
                   subText={
                     <links.External
                       href={`https://malegislature.gov/Legislators/Profile/${senateChairperson.MemberCode}`}
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 8dfdbe57b..b40197843 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -12,6 +12,10 @@ type DocElement = {
   text: string
 }
 
+const ErrorContainer = styled(Container)`
+  background-color: white;
+`
+
 const TimestampButton = styled.button`
   border-radius: 12px;
   width: min-content;
@@ -76,9 +80,9 @@ export const Transcriptions = ({
           )}
         </Container>
       ) : (
-        <Container className={`fs-6 fw-bold mb-2`}>
+        <ErrorContainer className={`fs-6 fw-bold mb-2 py-2 rounded`}>
           <div>{t("transcription_not_on_file")}</div>
-        </Container>
+        </ErrorContainer>
       )}
     </>
   )

From dd934355e6f71559edf68ff2bf572d323393dd2e Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 17:04:43 -0400
Subject: [PATCH 47/74] cleanup

---
 components/hearing/HearingSidebar.tsx | 15 ++-------------
 1 file changed, 2 insertions(+), 13 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 83c0bd657..86a78e78e 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -1,11 +1,7 @@
-import { parseISO, format } from "date-fns"
 import { doc, getDoc } from "firebase/firestore"
-import { useRouter } from "next/router"
-import { Trans, useTranslation } from "next-i18next"
+import { useTranslation } from "next-i18next"
 import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
-import { Col, Container, Image, Row } from "../bootstrap"
-import { Transcriptions } from "./Transcriptions"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 import { LabeledIcon } from "components/shared"
@@ -105,11 +101,6 @@ export const HearingSidebar = ({
     committeeCode && generalCourtNumber ? CommitteeData() : null
   }, [committeeCode, CommitteeData, generalCourtNumber])
 
-  console.log("H Chair: ", houseChairperson)
-  console.log("H Name: ", houseChairName)
-  console.log("S Chair: ", senateChairperson?.MemberCode)
-  console.log("S Name: ", senateChairName)
-
   return (
     <>
       <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
@@ -137,13 +128,12 @@ export const HearingSidebar = ({
               {houseChairperson && (
                 <LabeledIcon
                   idImage={`https://malegislature.gov/Legislators/Profile/170/${houseChairperson.MemberCode}.jpg`}
-                  // mainText={t("leadSponsor")}
                   mainText={`House Chair`}
                   subText={
                     <links.External
                       href={`https://malegislature.gov/Legislators/Profile/${houseChairperson.MemberCode}`}
                     >
-                      {senateChairName}
+                      {houseChairName}
                     </links.External>
                   }
                 />
@@ -153,7 +143,6 @@ export const HearingSidebar = ({
               {senateChairperson && (
                 <LabeledIcon
                   idImage={`https://malegislature.gov/Legislators/Profile/170/${senateChairperson.MemberCode}.jpg`}
-                  // mainText={t("leadSponsor")}
                   mainText={`Senate Chair`}
                   subText={
                     <links.External

From 0fa7d1403b81ecd4ec35bca5a124c18b79205e11 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 17:07:14 -0400
Subject: [PATCH 48/74] remove obsolete console logs

---
 components/hearing/HearingSidebar.tsx | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 86a78e78e..bf6857990 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -41,8 +41,6 @@ export const HearingSidebar = ({
     year: "numeric"
   })
 
-  console.log("C Code: ", committeeCode)
-
   interface Members {
     id: string
     name: string
@@ -93,8 +91,6 @@ export const HearingSidebar = ({
 
     setHouseChairName(houseName)
     setSenateChairName(senateName)
-
-    console.log("Comm data: ", docData)
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {

From d9f2b8f987eaa39e54dc8d1502f07fb62c01b395 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 20:38:41 -0400
Subject: [PATCH 49/74] replaced 404 redirect with messaging for scheduled
 hearings that don't have videos yet

---
 components/hearing/HearingDetails.tsx | 32 +++++++++------------------
 components/hearing/HearingSidebar.tsx | 24 +++++++++++---------
 public/locales/en/common.json         |  1 +
 3 files changed, 25 insertions(+), 32 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 1c7ebb553..35734d7c5 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -16,7 +16,6 @@ const CommitteeButton = styled.button`
 
 const LegalContainer = styled(Container)`
   background-color: white;
-  border-radius: 0.75rem;
 `
 
 const StyledContainer = styled(Container)`
@@ -76,7 +75,7 @@ export const HearingDetails = ({
     setVideoTranscriptionId(
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
-    setVideoURL(docData?.videoURL ?? "Default URL")
+    setVideoURL(docData?.videoURL)
 
     console.log("data: ", docData)
     console.log("content: ", docData?.content)
@@ -91,21 +90,6 @@ export const HearingDetails = ({
     committeeCheck = false
   }
 
-  const router = useRouter()
-  useEffect(() => {
-    if (videoURL === "Default URL") {
-      router.push({ pathname: "/404" })
-    }
-  }, [router, videoURL])
-
-  // pathname: "/404" could possible replaced with a different
-  // page/sequence/message that's more specific to the problem
-  // i.e. "the hearing ID you're trying to reach is not on file,
-  // please choose another"
-  //
-  // see pages/bills/[court]/[billId.tsx] ln 32 - 35 for possible
-  // improved method
-
   return (
     <StyledContainer className="mt-3 mb-3">
       <h1>
@@ -128,7 +112,7 @@ export const HearingDetails = ({
 
       <div className={`row mt-4`}>
         <Col className={`col-md-8`}>
-          <LegalContainer className={`pb-2`}>
+          <LegalContainer className={`pb-2 rounded`}>
             <Row
               className={`d-flex align-items-center justify-content-between`}
               fontSize={"12px"}
@@ -160,9 +144,15 @@ export const HearingDetails = ({
             </Row>
           </LegalContainer>
 
-          <VideoParent className={`my-3`}>
-            <VideoChild id={`mainVid`} src={videoURL} controls muted />
-          </VideoParent>
+          {videoURL ? (
+            <VideoParent className={`my-3`}>
+              <VideoChild id={`mainVid`} src={videoURL} controls muted />
+            </VideoParent>
+          ) : (
+            <LegalContainer className={`fs-6 fw-bold my-3 py-2 rounded`}>
+              {t("no_video_on_file")}
+            </LegalContainer>
+          )}
 
           <Transcriptions
             setCurTimeVideo={setCurTimeVideo}
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index bf6857990..3e81a4d73 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -6,6 +6,17 @@ import { firestore } from "components/firebase"
 import * as links from "components/links"
 import { LabeledIcon } from "components/shared"
 
+interface Legislator {
+  Details: string
+  GeneralCourtNumber: number
+  MemberCode: string
+}
+
+interface Members {
+  id: string
+  name: string
+}
+
 const SidebarBody = styled.div`
   background-color: white;
 `
@@ -41,17 +52,6 @@ export const HearingSidebar = ({
     year: "numeric"
   })
 
-  interface Members {
-    id: string
-    name: string
-  }
-
-  interface Legislator {
-    Details: string
-    GeneralCourtNumber: number
-    MemberCode: string
-  }
-
   const [houseChairName, setHouseChairName] = useState<string>("")
   const [houseChairperson, setHouseChairperson] = useState<Legislator>()
   const [senateChairName, setSenateChairName] = useState<string>("")
@@ -102,12 +102,14 @@ export const HearingSidebar = ({
       <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
         {t("hearing_details")}
       </SidebarHeader>
+
       <SidebarBody className={`border-bottom fs-6 fw-bold px-3 py-3`}>
         <SidebarSubbody className={`mb-1`}>
           {t("recording_date")}
         </SidebarSubbody>
         <div className={`fw-normal`}>{formattedDate}</div>
       </SidebarBody>
+
       {committeeCheck && (
         <SidebarBody
           className={`border-top fs-6 fw-bold px-3 py-3`}
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 979944918..ff29d8ced 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -128,6 +128,7 @@
   "notInCommittee": "Bill not currently in committee",
   "noResults": "No Results",
   "noNewsUpdates": "There are no news updates for your current followed topics",
+  "no_video_on_file": "This hearing does not yet have a video on file",
   "orgs": "Organizations",
   "pending_upgrade_warning": {
     "header": "Organization Request In Progress",

From 6b009244c3095e1700df92d617455a78710149ad Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 20:43:44 -0400
Subject: [PATCH 50/74] removed redirect code

---
 components/db/api.ts          | 5 -----
 pages/hearing/[hearingId].tsx | 2 --
 2 files changed, 7 deletions(-)

diff --git a/components/db/api.ts b/components/db/api.ts
index 812645d31..2c5305102 100644
--- a/components/db/api.ts
+++ b/components/db/api.ts
@@ -101,11 +101,6 @@ export class DbService {
   getBill = ({ court, billId }: BillQuery): Promise<Bill | undefined> =>
     this.getDocData<Bill>("generalCourts", court.toString(), "bills", billId)
 
-  getHearing = (hearingId: number): any => {
-    const hearingQuery = `hearing-${hearingId}`
-    this.getDocData<string>("events", hearingQuery)
-  }
-
   getProfile = async ({
     uid
   }: ProfileQuery): Promise<UserProfile | undefined> => {
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index c015cd313..bb2838513 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -26,8 +26,6 @@ export const getServerSideProps: GetServerSideProps = async ctx => {
 
   const query = Query.safeParse(ctx.query)
   if (!query.success) return { notFound: true }
-  // const hearing = await dbService().getHearing(query.data.hearingId)
-  // if (!hearing) return { notFound: true }
 
   return {
     props: {

From de77372986d104b6c60f1577d6b29f59ac2b2725 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Tue, 19 Aug 2025 21:17:52 -0400
Subject: [PATCH 51/74] added feature flagging

---
 components/featureFlags.ts            | 13 +++++++++----
 components/hearing/HearingDetails.tsx |  1 -
 pages/hearing/[hearingId].tsx         |  3 ++-
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/components/featureFlags.ts b/components/featureFlags.ts
index a7e011629..f6214a5ca 100644
--- a/components/featureFlags.ts
+++ b/components/featureFlags.ts
@@ -13,7 +13,9 @@ export const FeatureFlags = z.object({
   /** Lobbying Table */
   lobbyingTable: z.boolean().default(false),
   /** LLM Bill Summary and Tags **/
-  showLLMFeatures: z.boolean().default(false)
+  showLLMFeatures: z.boolean().default(false),
+  /** Hearings and Transcriptions **/
+  hearingsAndTranscriptions: z.boolean().default(false)
 })
 
 export type FeatureFlags = z.infer<typeof FeatureFlags>
@@ -32,7 +34,8 @@ const defaults: Record<Env, FeatureFlags> = {
     billTracker: true,
     followOrg: true,
     lobbyingTable: false,
-    showLLMFeatures: true
+    showLLMFeatures: true,
+    hearingsAndTranscriptions: true
   },
   production: {
     testimonyDiffing: false,
@@ -40,7 +43,8 @@ const defaults: Record<Env, FeatureFlags> = {
     billTracker: false,
     followOrg: true,
     lobbyingTable: false,
-    showLLMFeatures: true
+    showLLMFeatures: true,
+    hearingsAndTranscriptions: false
   },
   test: {
     testimonyDiffing: false,
@@ -48,7 +52,8 @@ const defaults: Record<Env, FeatureFlags> = {
     billTracker: false,
     followOrg: true,
     lobbyingTable: false,
-    showLLMFeatures: true
+    showLLMFeatures: true,
+    hearingsAndTranscriptions: true
   }
 }
 
diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 35734d7c5..fff9c442d 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -1,5 +1,4 @@
 import { doc, getDoc } from "firebase/firestore"
-import { useRouter } from "next/router"
 import { Trans, useTranslation } from "next-i18next"
 import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index bb2838513..29fff6bda 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -2,7 +2,7 @@ import { GetServerSideProps } from "next"
 import { useRouter } from "next/router"
 import { serverSideTranslations } from "next-i18next/serverSideTranslations"
 import { z } from "zod"
-import { dbService } from "components/db/api"
+import { flags } from "components/featureFlags"
 import { HearingDetails } from "components/hearing/HearingDetails"
 import { createPage } from "../../components/page"
 
@@ -26,6 +26,7 @@ export const getServerSideProps: GetServerSideProps = async ctx => {
 
   const query = Query.safeParse(ctx.query)
   if (!query.success) return { notFound: true }
+  if (!flags().hearingsAndTranscriptions) return { notFound: true }
 
   return {
     props: {

From e476506b6dc1833f66dea426d9409c1ff810602f Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Wed, 20 Aug 2025 14:39:41 -0400
Subject: [PATCH 52/74] members

---
 components/hearing/HearingSidebar.tsx | 57 +++++++++++++++++++++++++--
 public/locales/en/common.json         |  1 +
 2 files changed, 55 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 3e81a4d73..2a2861a1b 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -54,6 +54,7 @@ export const HearingSidebar = ({
 
   const [houseChairName, setHouseChairName] = useState<string>("")
   const [houseChairperson, setHouseChairperson] = useState<Legislator>()
+  const [members, setMembers] = useState<Members[]>()
   const [senateChairName, setSenateChairName] = useState<string>("")
   const [senateChairperson, setSenateChairperson] = useState<Legislator>()
 
@@ -69,12 +70,12 @@ export const HearingSidebar = ({
     setHouseChairperson(docData?.content.HouseChairperson)
     setSenateChairperson(docData?.content.SenateChairperson)
 
-    const members: Members[] = docData?.members ?? []
+    const memberData: Members[] = docData?.members ?? []
 
     const houseMembers =
       docData?.content?.HouseChairperson?.MemberCode ?? "Default Code"
     const houseMember =
-      members.find(member => member.id === houseMembers) ?? "Default Member"
+      memberData.find(member => member.id === houseMembers) ?? "Default Member"
     let houseName = "Default Name"
     if (houseMember != "Default Member") {
       houseName = houseMember.name
@@ -83,7 +84,7 @@ export const HearingSidebar = ({
     const senateMembers =
       docData?.content?.SenateChairperson?.MemberCode ?? "Default Code"
     const senateMember =
-      members.find(member => member.id === senateMembers) ?? "Default Member"
+      memberData.find(member => member.id === senateMembers) ?? "Default Member"
     let senateName = "Default Name"
     if (senateMember != "Default Member") {
       senateName = senateMember.name
@@ -91,12 +92,19 @@ export const HearingSidebar = ({
 
     setHouseChairName(houseName)
     setSenateChairName(senateName)
+    setMembers(memberData)
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {
     committeeCode && generalCourtNumber ? CommitteeData() : null
   }, [committeeCode, CommitteeData, generalCourtNumber])
 
+  const [showMembers, setShowMembers] = useState(false)
+
+  const toggleMembers = () => {
+    setShowMembers(!showMembers)
+  }
+
   return (
     <>
       <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
@@ -152,6 +160,49 @@ export const HearingSidebar = ({
                 />
               )}
             </div>
+
+            {members ? (
+              <>
+                <div className={`d-flex justify-content-end mb-2`}>
+                  <a href={`javascript:;`} onClick={toggleMembers}>
+                    {showMembers ? "Show less" : "Show more"}
+                  </a>
+                </div>
+
+                {showMembers ? (
+                  <>
+                    {t("members")}
+                    <div>
+                      {members.map((member: Members, index: number) => {
+                        if (
+                          member.name !== houseChairName &&
+                          member.name !== senateChairName
+                        ) {
+                          return (
+                            <LabeledIcon
+                              key={index}
+                              idImage={`https://malegislature.gov/Legislators/Profile/170/${member.id}.jpg`}
+                              mainText={`Member`}
+                              subText={
+                                <links.External
+                                  href={`https://malegislature.gov/Legislators/Profile/${member.id}`}
+                                >
+                                  {member.name}
+                                </links.External>
+                              }
+                            />
+                          )
+                        }
+                      })}
+                    </div>
+                  </>
+                ) : (
+                  <></>
+                )}
+              </>
+            ) : (
+              <></>
+            )}
           </SidebarSubbody>
         </SidebarBody>
       )}
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index ff29d8ced..d3217e856 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -84,6 +84,7 @@
   "logInSignUp": "Log in / Sign up",
   "maple_abbr": "MAPLE",
   "maple_fullName": "Massachusetts Platform for Legislative Engagement",
+  "members": "Members",
   "navigation": {
     "accountProfile": "Profile",
     "additionalResources": "Additional Resources",

From 4827dd6d14f35f76b6241846b685a2e863e04bfe Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Wed, 20 Aug 2025 15:10:55 -0400
Subject: [PATCH 53/74] reused committee button for show more clickable

---
 components/hearing/HearingDetails.tsx |  2 +-
 components/hearing/HearingSidebar.tsx | 21 ++++++++++++---------
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index fff9c442d..a48c1cfbb 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -8,7 +8,7 @@ import { Transcriptions } from "./Transcriptions"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 
-const CommitteeButton = styled.button`
+export const CommitteeButton = styled.button`
   border-radius: 12px;
   font-size: 12px;
 `
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 2a2861a1b..cb56bec1e 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -2,6 +2,7 @@ import { doc, getDoc } from "firebase/firestore"
 import { useTranslation } from "next-i18next"
 import { useCallback, useEffect, useState } from "react"
 import styled from "styled-components"
+import { CommitteeButton } from "./HearingDetails"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 import { LabeledIcon } from "components/shared"
@@ -57,6 +58,11 @@ export const HearingSidebar = ({
   const [members, setMembers] = useState<Members[]>()
   const [senateChairName, setSenateChairName] = useState<string>("")
   const [senateChairperson, setSenateChairperson] = useState<Legislator>()
+  const [showMembers, setShowMembers] = useState(false)
+
+  const toggleMembers = () => {
+    setShowMembers(!showMembers)
+  }
 
   const CommitteeData = useCallback(async () => {
     const committee = await getDoc(
@@ -99,12 +105,6 @@ export const HearingSidebar = ({
     committeeCode && generalCourtNumber ? CommitteeData() : null
   }, [committeeCode, CommitteeData, generalCourtNumber])
 
-  const [showMembers, setShowMembers] = useState(false)
-
-  const toggleMembers = () => {
-    setShowMembers(!showMembers)
-  }
-
   return (
     <>
       <SidebarHeader className={`fs-6 fw-bold px-3 pb-2`}>
@@ -164,9 +164,12 @@ export const HearingSidebar = ({
             {members ? (
               <>
                 <div className={`d-flex justify-content-end mb-2`}>
-                  <a href={`javascript:;`} onClick={toggleMembers}>
-                    {showMembers ? "Show less" : "Show more"}
-                  </a>
+                  <CommitteeButton
+                    className={`btn btn-secondary d-flex text-nowrap mt-1 mx-1 p-1`}
+                    onClick={toggleMembers}
+                  >
+                    &nbsp; {showMembers ? "Show less" : "Show more"} &nbsp;
+                  </CommitteeButton>
                 </div>
 
                 {showMembers ? (

From 4e9f3cf599460795961f8271b5a0e3cb7a1cd805 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Wed, 20 Aug 2025 17:39:23 -0400
Subject: [PATCH 54/74] sidebar bottom

---
 components/hearing/HearingDetails.tsx |  4 ++++
 components/hearing/HearingSidebar.tsx | 21 +++++++++++----------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index a48c1cfbb..d2e107ed7 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -53,6 +53,7 @@ export const HearingDetails = ({
 
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
+  const [description, setDescription] = useState("")
   const [generalCourtNumber, setGeneralCourtNumber] = useState("")
   const [hearingDate, setHearingDate] = useState("")
   const [videoTranscriptionId, setVideoTranscriptionId] = useState("")
@@ -66,6 +67,7 @@ export const HearingDetails = ({
       docData?.content.HearingHost.CommitteeCode ?? "Default Committee Code"
     )
     setCommitteeName(docData?.content.Name ?? "Default Name")
+    setDescription(docData?.content.Description)
     setGeneralCourtNumber(
       docData?.content.HearingHost.GeneralCourtNumber ??
         "Default General Court Number"
@@ -95,6 +97,8 @@ export const HearingDetails = ({
         {t("hearing")} {hearingId}
       </h1>
 
+      <h5 className={`mb-3`}>{description}</h5>
+
       {committeeCheck ? (
         <links.External
           href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index cb56bec1e..a913bf1e0 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -22,8 +22,11 @@ const SidebarBody = styled.div`
   background-color: white;
 `
 
-const SidebarSubbody = styled.div`
-  font-size: 0.85rem;
+const SidebarBottom = styled.div`
+  background-color: white;
+  border-bottom-left-radius: 0.75rem;
+  border-bottom-right-radius: 0.75rem;
+  height: 11px;
 `
 
 const SidebarHeader = styled.div`
@@ -33,6 +36,10 @@ const SidebarHeader = styled.div`
   padding-top: 9px;
 `
 
+const SidebarSubbody = styled.div`
+  font-size: 0.85rem;
+`
+
 export const HearingSidebar = ({
   committeeCheck,
   committeeCode,
@@ -119,14 +126,7 @@ export const HearingSidebar = ({
       </SidebarBody>
 
       {committeeCheck && (
-        <SidebarBody
-          className={`border-top fs-6 fw-bold px-3 py-3`}
-          style={{
-            borderBottomLeftRadius: "0.75rem",
-            borderBottomRightRadius: "0.75rem"
-          }}
-          // style is temporary until next section is complete
-        >
+        <SidebarBody className={`border-top fs-6 fw-bold px-3 py-3`}>
           {t("committee_members")}
           <SidebarSubbody className={`mb-1 mt-2`}>
             {t("chairs")}
@@ -209,6 +209,7 @@ export const HearingSidebar = ({
           </SidebarSubbody>
         </SidebarBody>
       )}
+      <SidebarBottom />
     </>
   )
 }

From 2cb1366afc466429a459cd254da36a7dbcd02415 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Wed, 20 Aug 2025 19:32:46 -0400
Subject: [PATCH 55/74] removed attempt at using agenda

---
 components/hearing/HearingDetails.tsx | 3 ---
 components/hearing/HearingSidebar.tsx | 6 ++++++
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index d2e107ed7..293c6fdb4 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -77,9 +77,6 @@ export const HearingDetails = ({
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
     setVideoURL(docData?.videoURL)
-
-    console.log("data: ", docData)
-    console.log("content: ", docData?.content)
   }, [hearingQuery])
 
   useEffect(() => {
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index a913bf1e0..a00091952 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -6,6 +6,12 @@ import { CommitteeButton } from "./HearingDetails"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 import { LabeledIcon } from "components/shared"
+import { bill } from "stories/organisms/billDetail/MockBillData"
+
+interface Doc {
+  BillNumber: string
+  Title: string
+}
 
 interface Legislator {
   Details: string

From aaa80788953ba9070703dbfa11251566c31f3c91 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Wed, 20 Aug 2025 19:38:51 -0400
Subject: [PATCH 56/74] cleanup

---
 components/hearing/HearingSidebar.tsx | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index a00091952..a913bf1e0 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -6,12 +6,6 @@ import { CommitteeButton } from "./HearingDetails"
 import { firestore } from "components/firebase"
 import * as links from "components/links"
 import { LabeledIcon } from "components/shared"
-import { bill } from "stories/organisms/billDetail/MockBillData"
-
-interface Doc {
-  BillNumber: string
-  Title: string
-}
 
 interface Legislator {
   Details: string

From ecec89acf068588f323f7428e55a054664e80bbc Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 10:13:56 -0400
Subject: [PATCH 57/74] remove event.ts change

---
 components/db/events.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/db/events.ts b/components/db/events.ts
index 277f89c8d..6af3881ab 100644
--- a/components/db/events.ts
+++ b/components/db/events.ts
@@ -94,7 +94,7 @@ export async function listUpcomingEvents(types?: Event["type"][]) {
       eventsRef,
       types && where("type", "in", types),
       where("startsAt", ">=", midnight()),
-      orderBy("starts", "asc")
+      orderBy("startsAt", "asc")
     )
   )
 

From e1fe02916ec20c65d98ec8dcfdef0cea0308d180 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 10:29:29 -0400
Subject: [PATCH 58/74] eventId

---
 components/hearing/HearingDetails.tsx | 6 +++---
 components/hearing/HearingSidebar.tsx | 6 ++++--
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 293c6fdb4..4ef6abbfc 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -49,7 +49,7 @@ export const HearingDetails = ({
     mainVid.currentTime = value
   }
 
-  const hearingQuery = `hearing-${hearingId}`
+  const eventId = `hearing-${hearingId}`
 
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
@@ -60,7 +60,7 @@ export const HearingDetails = ({
   const [videoURL, setVideoURL] = useState("")
 
   const hearingData = useCallback(async () => {
-    const hearing = await getDoc(doc(firestore, `events/${hearingQuery}`))
+    const hearing = await getDoc(doc(firestore, `events/${eventId}`))
     const docData = hearing.data()
 
     setCommitteeCode(
@@ -77,7 +77,7 @@ export const HearingDetails = ({
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
     setVideoURL(docData?.videoURL)
-  }, [hearingQuery])
+  }, [eventId])
 
   useEffect(() => {
     hearingData()
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index a913bf1e0..569c940bb 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -126,7 +126,9 @@ export const HearingSidebar = ({
       </SidebarBody>
 
       {committeeCheck && (
-        <SidebarBody className={`border-top fs-6 fw-bold px-3 py-3`}>
+        <SidebarBody
+          className={`border-bottom border-top fs-6 fw-bold px-3 py-3`}
+        >
           {t("committee_members")}
           <SidebarSubbody className={`mb-1 mt-2`}>
             {t("chairs")}
@@ -209,7 +211,7 @@ export const HearingSidebar = ({
           </SidebarSubbody>
         </SidebarBody>
       )}
-      <SidebarBottom />
+      <SidebarBottom className={`border-top`} />
     </>
   )
 }

From 45a4f967a5bcaf017c91579b6ec1a96cbd63037f Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 10:40:17 -0400
Subject: [PATCH 59/74] removed styledcontainer

---
 components/hearing/HearingDetails.tsx | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 4ef6abbfc..e4e7549d0 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -17,10 +17,6 @@ const LegalContainer = styled(Container)`
   background-color: white;
 `
 
-const StyledContainer = styled(Container)`
-  font-family: "Nunito";
-`
-
 const VideoChild = styled.video`
   position: absolute;
   top: 0;
@@ -89,7 +85,7 @@ export const HearingDetails = ({
   }
 
   return (
-    <StyledContainer className="mt-3 mb-3">
+    <Container className="mt-3 mb-3">
       <h1>
         {t("hearing")} {hearingId}
       </h1>
@@ -169,6 +165,6 @@ export const HearingDetails = ({
           />
         </div>
       </div>
-    </StyledContainer>
+    </Container>
   )
 }

From aac82fbfe328fc2c6807a18e3c7fa7808e2ebbda Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 12:15:51 -0400
Subject: [PATCH 60/74] refactored video with useRef

---
 components/hearing/HearingDetails.tsx | 22 +++++++++++++---------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index e4e7549d0..e4b96cfbb 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -1,6 +1,6 @@
 import { doc, getDoc } from "firebase/firestore"
 import { Trans, useTranslation } from "next-i18next"
-import { useCallback, useEffect, useState } from "react"
+import { useCallback, useEffect, useRef, useState } from "react"
 import styled from "styled-components"
 import { Col, Container, Image, Row } from "../bootstrap"
 import { HearingSidebar } from "./HearingSidebar"
@@ -17,6 +17,10 @@ const LegalContainer = styled(Container)`
   background-color: white;
 `
 
+const StyledContainer = styled(Container)`
+  font-family: "Nunito";
+`
+
 const VideoChild = styled.video`
   position: absolute;
   top: 0;
@@ -40,12 +44,12 @@ export const HearingDetails = ({
 }) => {
   const { t } = useTranslation("common")
 
-  let mainVid = document.getElementById("mainVid") as HTMLVideoElement
+  const videoRef = useRef<HTMLVideoElement>(null)
   function setCurTimeVideo(value: number) {
-    mainVid.currentTime = value
+    videoRef.current ? (videoRef.current.currentTime = value) : null
   }
 
-  const eventId = `hearing-${hearingId}`
+  const hearingQuery = `hearing-${hearingId}`
 
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
@@ -56,7 +60,7 @@ export const HearingDetails = ({
   const [videoURL, setVideoURL] = useState("")
 
   const hearingData = useCallback(async () => {
-    const hearing = await getDoc(doc(firestore, `events/${eventId}`))
+    const hearing = await getDoc(doc(firestore, `events/${hearingQuery}`))
     const docData = hearing.data()
 
     setCommitteeCode(
@@ -73,7 +77,7 @@ export const HearingDetails = ({
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
     setVideoURL(docData?.videoURL)
-  }, [eventId])
+  }, [hearingQuery])
 
   useEffect(() => {
     hearingData()
@@ -85,7 +89,7 @@ export const HearingDetails = ({
   }
 
   return (
-    <Container className="mt-3 mb-3">
+    <StyledContainer className="mt-3 mb-3">
       <h1>
         {t("hearing")} {hearingId}
       </h1>
@@ -142,7 +146,7 @@ export const HearingDetails = ({
 
           {videoURL ? (
             <VideoParent className={`my-3`}>
-              <VideoChild id={`mainVid`} src={videoURL} controls muted />
+              <VideoChild ref={videoRef} src={videoURL} controls muted />
             </VideoParent>
           ) : (
             <LegalContainer className={`fs-6 fw-bold my-3 py-2 rounded`}>
@@ -165,6 +169,6 @@ export const HearingDetails = ({
           />
         </div>
       </div>
-    </Container>
+    </StyledContainer>
   )
 }

From cc301f34273ddfb74bc9210003b2290280767ec5 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 13:05:44 -0400
Subject: [PATCH 61/74] removed inline style

---
 components/hearing/HearingDetails.tsx |  8 +---
 components/hearing/Transcriptions.tsx | 54 +++++++++++++--------------
 2 files changed, 28 insertions(+), 34 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index e4b96cfbb..8d7b1c8c0 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -17,10 +17,6 @@ const LegalContainer = styled(Container)`
   background-color: white;
 `
 
-const StyledContainer = styled(Container)`
-  font-family: "Nunito";
-`
-
 const VideoChild = styled.video`
   position: absolute;
   top: 0;
@@ -89,7 +85,7 @@ export const HearingDetails = ({
   }
 
   return (
-    <StyledContainer className="mt-3 mb-3">
+    <Container className="mt-3 mb-3">
       <h1>
         {t("hearing")} {hearingId}
       </h1>
@@ -169,6 +165,6 @@ export const HearingDetails = ({
           />
         </div>
       </div>
-    </StyledContainer>
+    </Container>
   )
 }
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index b40197843..0bbf67f62 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -25,6 +25,23 @@ const TimestampCol = styled.div`
   width: 100px;
 `
 
+const TranscriptionRow = styled(Row)`
+  &:first-child {
+    border-top-left-radius: 0.75rem;
+    border-top-right-radius: 0.75rem;
+  }
+  &:nth-child(even) {
+    background-color: #c0c4dc;
+  }
+  &:nth-child(odd) {
+    background-color: white;
+  }
+  &:last-child {
+    border-bottom-left-radius: 0.75rem;
+    border-bottom-right-radius: 0.75rem;
+  }
+`
+
 export const Transcriptions = ({
   setCurTimeVideo,
   videoTranscriptionId
@@ -67,17 +84,13 @@ export const Transcriptions = ({
     <>
       {transcriptData.length > 0 ? (
         <Container className={`mb-2`}>
-          {transcriptData.map(
-            (element: DocElement, index: number, array: DocElement[]) => (
-              <TranscriptItem
-                key={index}
-                index={index}
-                element={element}
-                array={array}
-                setCurTimeVideo={setCurTimeVideo}
-              />
-            )
-          )}
+          {transcriptData.map((element: DocElement, index: number) => (
+            <TranscriptItem
+              key={index}
+              element={element}
+              setCurTimeVideo={setCurTimeVideo}
+            />
+          ))}
         </Container>
       ) : (
         <ErrorContainer className={`fs-6 fw-bold mb-2 py-2 rounded`}>
@@ -89,18 +102,12 @@ export const Transcriptions = ({
 }
 
 function TranscriptItem({
-  index,
-  array,
   element,
   setCurTimeVideo
 }: {
-  index: number
-  array: DocElement[]
   element: DocElement
   setCurTimeVideo: any
 }) {
-  const isLastItem = index === array.length - 1
-
   const handleClick = (val: number) => {
     const valSeconds = val / 1000
     /* data from backend is in milliseconds
@@ -129,16 +136,7 @@ function TranscriptItem({
   }
 
   return (
-    <Row
-      className={``}
-      style={{
-        backgroundColor: index % 2 === 0 ? "white" : "#c0c4dc",
-        borderTopLeftRadius: index === 0 ? "0.75rem" : "0",
-        borderTopRightRadius: index === 0 ? "0.75rem" : "0",
-        borderBottomLeftRadius: isLastItem ? "0.75rem" : "0",
-        borderBottomRightRadius: isLastItem ? "0.75rem" : "0"
-      }}
-    >
+    <TranscriptionRow>
       <TimestampCol>
         <Row className={`d-inline`}>
           <TimestampButton
@@ -154,6 +152,6 @@ function TranscriptItem({
         </Row>
       </TimestampCol>
       <Col>{element.text}</Col>
-    </Row>
+    </TranscriptionRow>
   )
 }

From b150735f9be52d8f3ae9185d20498ab98441e7a6 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 13:08:28 -0400
Subject: [PATCH 62/74] reassert eventId fix

---
 components/hearing/HearingDetails.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 8d7b1c8c0..22554d130 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -45,7 +45,7 @@ export const HearingDetails = ({
     videoRef.current ? (videoRef.current.currentTime = value) : null
   }
 
-  const hearingQuery = `hearing-${hearingId}`
+  const eventId = `hearing-${hearingId}`
 
   const [committeeCode, setCommitteeCode] = useState("")
   const [committeeName, setCommitteeName] = useState("")
@@ -56,7 +56,7 @@ export const HearingDetails = ({
   const [videoURL, setVideoURL] = useState("")
 
   const hearingData = useCallback(async () => {
-    const hearing = await getDoc(doc(firestore, `events/${hearingQuery}`))
+    const hearing = await getDoc(doc(firestore, `events/${eventId}`))
     const docData = hearing.data()
 
     setCommitteeCode(
@@ -73,7 +73,7 @@ export const HearingDetails = ({
       docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
     )
     setVideoURL(docData?.videoURL)
-  }, [hearingQuery])
+  }, [eventId])
 
   useEffect(() => {
     hearingData()

From bd76247d86ea93f7dfa916994a2cb3929c727055 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 13:50:45 -0400
Subject: [PATCH 63/74] removed Default Values

---
 components/hearing/HearingDetails.tsx | 25 ++++++----------------
 components/hearing/HearingSidebar.tsx | 30 +++++++++------------------
 components/hearing/Transcriptions.tsx |  4 +---
 3 files changed, 17 insertions(+), 42 deletions(-)

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index 22554d130..fec6d9b2e 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -59,19 +59,12 @@ export const HearingDetails = ({
     const hearing = await getDoc(doc(firestore, `events/${eventId}`))
     const docData = hearing.data()
 
-    setCommitteeCode(
-      docData?.content.HearingHost.CommitteeCode ?? "Default Committee Code"
-    )
-    setCommitteeName(docData?.content.Name ?? "Default Name")
+    setCommitteeCode(docData?.content.HearingHost.CommitteeCode)
+    setCommitteeName(docData?.content.Name)
     setDescription(docData?.content.Description)
-    setGeneralCourtNumber(
-      docData?.content.HearingHost.GeneralCourtNumber ??
-        "Default General Court Number"
-    )
-    setHearingDate(docData?.content.EventDate ?? "Default Date")
-    setVideoTranscriptionId(
-      docData?.videoTranscriptionId ?? "Default Video Transcripton Id"
-    )
+    setGeneralCourtNumber(docData?.content.HearingHost.GeneralCourtNumber)
+    setHearingDate(docData?.content.EventDate)
+    setVideoTranscriptionId(docData?.videoTranscriptionId)
     setVideoURL(docData?.videoURL)
   }, [eventId])
 
@@ -79,11 +72,6 @@ export const HearingDetails = ({
     hearingData()
   }, [hearingData])
 
-  let committeeCheck = true
-  if (committeeName == "Default Name") {
-    committeeCheck = false
-  }
-
   return (
     <Container className="mt-3 mb-3">
       <h1>
@@ -92,7 +80,7 @@ export const HearingDetails = ({
 
       <h5 className={`mb-3`}>{description}</h5>
 
-      {committeeCheck ? (
+      {committeeName ? (
         <links.External
           href={`https://malegislature.gov/Committees/Detail/${committeeCode}/${generalCourtNumber}`}
         >
@@ -158,7 +146,6 @@ export const HearingDetails = ({
 
         <div className={`col-md-4`}>
           <HearingSidebar
-            committeeCheck={committeeCheck}
             committeeCode={committeeCode}
             generalCourtNumber={generalCourtNumber}
             hearingDate={hearingDate}
diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 569c940bb..f0f9fdb86 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -41,12 +41,10 @@ const SidebarSubbody = styled.div`
 `
 
 export const HearingSidebar = ({
-  committeeCheck,
   committeeCode,
   generalCourtNumber,
   hearingDate
 }: {
-  committeeCheck: boolean
   committeeCode: string
   generalCourtNumber: string
   hearingDate: string
@@ -85,23 +83,15 @@ export const HearingSidebar = ({
 
     const memberData: Members[] = docData?.members ?? []
 
-    const houseMembers =
-      docData?.content?.HouseChairperson?.MemberCode ?? "Default Code"
-    const houseMember =
-      memberData.find(member => member.id === houseMembers) ?? "Default Member"
-    let houseName = "Default Name"
-    if (houseMember != "Default Member") {
-      houseName = houseMember.name
-    }
-
-    const senateMembers =
-      docData?.content?.SenateChairperson?.MemberCode ?? "Default Code"
-    const senateMember =
-      memberData.find(member => member.id === senateMembers) ?? "Default Member"
-    let senateName = "Default Name"
-    if (senateMember != "Default Member") {
-      senateName = senateMember.name
-    }
+    const houseMembers = docData?.content?.HouseChairperson?.MemberCode
+    const houseMember = memberData.find(member => member.id === houseMembers)
+    let houseName = ""
+    houseMember && (houseName = houseMember.name)
+
+    const senateMembers = docData?.content?.SenateChairperson?.MemberCode
+    const senateMember = memberData.find(member => member.id === senateMembers)
+    let senateName = ""
+    senateMember && (senateName = senateMember.name)
 
     setHouseChairName(houseName)
     setSenateChairName(senateName)
@@ -125,7 +115,7 @@ export const HearingSidebar = ({
         <div className={`fw-normal`}>{formattedDate}</div>
       </SidebarBody>
 
-      {committeeCheck && (
+      {committeeCode && (
         <SidebarBody
           className={`border-bottom border-top fs-6 fw-bold px-3 py-3`}
         >
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 0bbf67f62..0346e3c33 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -51,11 +51,9 @@ export const Transcriptions = ({
 }) => {
   const { t } = useTranslation("common")
 
-  let videoTranscriptionURL = videoTranscriptionId || "Default Value"
-
   const subscriptionRef = collection(
     firestore,
-    `transcriptions/${videoTranscriptionURL}/paragraphs`
+    `transcriptions/${videoTranscriptionId}/paragraphs`
   )
 
   const [transcriptData, setTranscriptData] = useState<DocElement[]>([])

From 6060c34c55e7d6fcffbe6248f05aa374caa96608 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 14:29:08 -0400
Subject: [PATCH 64/74] prevent FirebaseError

---
 components/hearing/Transcriptions.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 0346e3c33..c01daca80 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -51,9 +51,11 @@ export const Transcriptions = ({
 }) => {
   const { t } = useTranslation("common")
 
+  const vid = videoTranscriptionId || "prevent FirebaseError"
+
   const subscriptionRef = collection(
     firestore,
-    `transcriptions/${videoTranscriptionId}/paragraphs`
+    `transcriptions/${vid}/paragraphs`
   )
 
   const [transcriptData, setTranscriptData] = useState<DocElement[]>([])

From 2938830a1e036642c8f14c9ec8d870e93ca5b4dd Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 14:35:54 -0400
Subject: [PATCH 65/74] cleanup

---
 components/hearing/HearingSidebar.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index f0f9fdb86..05029a257 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -69,7 +69,7 @@ export const HearingSidebar = ({
     setShowMembers(!showMembers)
   }
 
-  const CommitteeData = useCallback(async () => {
+  const committeeData = useCallback(async () => {
     const committee = await getDoc(
       doc(
         firestore,
@@ -99,8 +99,8 @@ export const HearingSidebar = ({
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {
-    committeeCode && generalCourtNumber ? CommitteeData() : null
-  }, [committeeCode, CommitteeData, generalCourtNumber])
+    committeeCode && generalCourtNumber ? committeeData() : null
+  }, [committeeCode, committeeData, generalCourtNumber])
 
   return (
     <>

From e9cba439c7a126646bbfe6422dfd989390a1ca6d Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 14:41:32 -0400
Subject: [PATCH 66/74] cleanup

---
 components/hearing/Transcriptions.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index c01daca80..bb669bfb0 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -5,7 +5,7 @@ import styled from "styled-components"
 import { Col, Container, Row } from "../bootstrap"
 import { firestore } from "components/firebase"
 
-type DocElement = {
+type Paragraph = {
   confidence: number
   end: number
   start: number
@@ -58,9 +58,9 @@ export const Transcriptions = ({
     `transcriptions/${vid}/paragraphs`
   )
 
-  const [transcriptData, setTranscriptData] = useState<DocElement[]>([])
+  const [transcriptData, setTranscriptData] = useState<Paragraph[]>([])
 
-  const transcriptionData = useCallback(async () => {
+  const fetchTranscriptionData = useCallback(async () => {
     let docList: any[] = []
 
     const q = query(subscriptionRef, orderBy("start"))
@@ -77,14 +77,14 @@ export const Transcriptions = ({
   }, [subscriptionRef, transcriptData])
 
   useEffect(() => {
-    transcriptionData()
-  }, [transcriptionData])
+    fetchTranscriptionData()
+  }, [fetchTranscriptionData])
 
   return (
     <>
       {transcriptData.length > 0 ? (
         <Container className={`mb-2`}>
-          {transcriptData.map((element: DocElement, index: number) => (
+          {transcriptData.map((element: Paragraph, index: number) => (
             <TranscriptItem
               key={index}
               element={element}
@@ -105,7 +105,7 @@ function TranscriptItem({
   element,
   setCurTimeVideo
 }: {
-  element: DocElement
+  element: Paragraph
   setCurTimeVideo: any
 }) {
   const handleClick = (val: number) => {

From 2e7d48114c8922dca0ef80f9f1492f8df4ddbb02 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 14:50:09 -0400
Subject: [PATCH 67/74] updated even rows

---
 components/hearing/Transcriptions.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index bb669bfb0..82f4789f9 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -31,7 +31,9 @@ const TranscriptionRow = styled(Row)`
     border-top-right-radius: 0.75rem;
   }
   &:nth-child(even) {
-    background-color: #c0c4dc;
+    /* background-color: #c0c4dc; */
+    /* use #c0c4dc for selected rows when Search is implemented*/
+    background-color: #e8ecf4;
   }
   &:nth-child(odd) {
     background-color: white;

From 0ba52e056b06afbd45ec5434b4cb7b5f370e601f Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 15:11:34 -0400
Subject: [PATCH 68/74] uped cache control values

---
 components/hearing/HearingSidebar.tsx | 2 ++
 pages/hearing/[hearingId].tsx         | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 05029a257..5b1cb9f1f 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -96,6 +96,8 @@ export const HearingSidebar = ({
     setHouseChairName(houseName)
     setSenateChairName(senateName)
     setMembers(memberData)
+
+    console.log(docData)
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 29fff6bda..ee14c6bc6 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -19,7 +19,7 @@ export default createPage<{ hearingId: number }>({
 export const getServerSideProps: GetServerSideProps = async ctx => {
   ctx.res.setHeader(
     "Cache-Control",
-    "public, s-maxage=10, stale-while-revalidate=59"
+    "public, s-maxage=604800, stale-while-revalidate=604800"
   )
 
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"

From b06f11e68c6147e8c277916b2abce4cf28e7d8cf Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 15:24:13 -0400
Subject: [PATCH 69/74] moved page specific translations to hearing.json

---
 components/hearing/HearingDetails.tsx |  2 +-
 pages/hearing/[hearingId].tsx         |  7 ++++++-
 public/locales/en/common.json         |  8 --------
 public/locales/en/hearing.json        | 10 ++++++++++
 4 files changed, 17 insertions(+), 10 deletions(-)
 create mode 100644 public/locales/en/hearing.json

diff --git a/components/hearing/HearingDetails.tsx b/components/hearing/HearingDetails.tsx
index fec6d9b2e..1249ebdf5 100644
--- a/components/hearing/HearingDetails.tsx
+++ b/components/hearing/HearingDetails.tsx
@@ -38,7 +38,7 @@ export const HearingDetails = ({
 }: {
   hearingId: string | string[] | undefined
 }) => {
-  const { t } = useTranslation("common")
+  const { t } = useTranslation(["common", "hearing"])
 
   const videoRef = useRef<HTMLVideoElement>(null)
   function setCurTimeVideo(value: number) {
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index ee14c6bc6..dbc7cc970 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -30,7 +30,12 @@ export const getServerSideProps: GetServerSideProps = async ctx => {
 
   return {
     props: {
-      ...(await serverSideTranslations(locale, ["auth", "common", "footer"]))
+      ...(await serverSideTranslations(locale, [
+        "auth",
+        "common",
+        "footer",
+        "hearing"
+      ]))
     }
   }
 }
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index d3217e856..d605fc52f 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -64,10 +64,6 @@
     "followed": "Followed"
   },
   "calendar": "Our Calendar",
-  "chairs": "Chairs",
-  "committee_members": "Committee members",
-  "hearing": "Hearing ",
-  "hearing_details": "Hearing details",
   "hideAns": "Hide Answer",
   "date": "{{date, datetime(year: 'numeric'; month: 'long'; day: 'numeric')}}",
   "joinTraining": "and join an upcoming training session!",
@@ -84,7 +80,6 @@
   "logInSignUp": "Log in / Sign up",
   "maple_abbr": "MAPLE",
   "maple_fullName": "Massachusetts Platform for Legislative Engagement",
-  "members": "Members",
   "navigation": {
     "accountProfile": "Profile",
     "additionalResources": "Additional Resources",
@@ -129,14 +124,12 @@
   "notInCommittee": "Bill not currently in committee",
   "noResults": "No Results",
   "noNewsUpdates": "There are no news updates for your current followed topics",
-  "no_video_on_file": "This hearing does not yet have a video on file",
   "orgs": "Organizations",
   "pending_upgrade_warning": {
     "header": "Organization Request In Progress",
     "content": "Your request to be upgraded to an organization is currently in progress. You will be notified by email when your request has been reviewed."
   },
   "primarySponsor": "Primary Sponsor",
-  "recording_date": "Recording date",
   "short_description": "MAPLE makes it easy for anyone to view and submit testimony to the Massachusetts Legislature about the bills that will shape our future.",
   "showAns": "Show Answer",
   "socials": {
@@ -152,7 +145,6 @@
   "table": {
     "page": "Page {{currentPage}}"
   },
-  "transcription_not_on_file": "This hearing does not yet have a transcription on file",
   "titles": {
     "admin": "Admin",
     "bill": "Bill",
diff --git a/public/locales/en/hearing.json b/public/locales/en/hearing.json
new file mode 100644
index 000000000..ef9dec0ac
--- /dev/null
+++ b/public/locales/en/hearing.json
@@ -0,0 +1,10 @@
+{
+  "chairs": "Chairs",
+  "committee_members": "Committee members",
+  "hearing": "Hearing ",
+  "hearing_details": "Hearing details",
+  "members": "Members",
+  "no_video_on_file": "This hearing does not yet have a video on file",
+  "recording_date": "Recording date",
+  "transcription_not_on_file": "This hearing does not yet have a transcription on file"
+}
\ No newline at end of file

From 9d1ee2f8bb17e68c0d672fd0dea3599513fcfe98 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 15:41:23 -0400
Subject: [PATCH 70/74] handle Invalid Date

---
 components/hearing/HearingSidebar.tsx | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 5b1cb9f1f..97595bc56 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -57,6 +57,10 @@ export const HearingSidebar = ({
     day: "2-digit",
     year: "numeric"
   })
+  let dateCheck = false
+  if (formattedDate !== `Invalid Date`) {
+    dateCheck = true
+  }
 
   const [houseChairName, setHouseChairName] = useState<string>("")
   const [houseChairperson, setHouseChairperson] = useState<Legislator>()
@@ -110,12 +114,16 @@ export const HearingSidebar = ({
         {t("hearing_details")}
       </SidebarHeader>
 
-      <SidebarBody className={`border-bottom fs-6 fw-bold px-3 py-3`}>
-        <SidebarSubbody className={`mb-1`}>
-          {t("recording_date")}
-        </SidebarSubbody>
-        <div className={`fw-normal`}>{formattedDate}</div>
-      </SidebarBody>
+      {dateCheck ? (
+        <SidebarBody className={`border-bottom fs-6 fw-bold px-3 py-3`}>
+          <SidebarSubbody className={`mb-1`}>
+            {t("recording_date")}
+          </SidebarSubbody>
+          <div className={`fw-normal`}>{formattedDate}</div>
+        </SidebarBody>
+      ) : (
+        <></>
+      )}
 
       {committeeCode && (
         <SidebarBody

From 55482853bc7a8f02d51feaba6a728688c1658cce Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 16:03:46 -0400
Subject: [PATCH 71/74] reduced cache control

---
 components/hearing/HearingSidebar.tsx | 2 +-
 pages/hearing/[hearingId].tsx         | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 97595bc56..c6d2c8508 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -101,7 +101,7 @@ export const HearingSidebar = ({
     setSenateChairName(senateName)
     setMembers(memberData)
 
-    console.log(docData)
+    console.log("data: ", docData)
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index dbc7cc970..d381744ed 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -19,7 +19,7 @@ export default createPage<{ hearingId: number }>({
 export const getServerSideProps: GetServerSideProps = async ctx => {
   ctx.res.setHeader(
     "Cache-Control",
-    "public, s-maxage=604800, stale-while-revalidate=604800"
+    "public, s-maxage=10, stale-while-revalidate=10"
   )
 
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"

From afb59d94a120fe74e3679aed5a553ceeaea57c13 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 16:10:47 -0400
Subject: [PATCH 72/74] update useTranslation(filenames)

---
 components/hearing/HearingSidebar.tsx | 2 +-
 components/hearing/Transcriptions.tsx | 2 +-
 pages/hearing/[hearingId].tsx         | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index c6d2c8508..44c9f2edc 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -49,7 +49,7 @@ export const HearingSidebar = ({
   generalCourtNumber: string
   hearingDate: string
 }) => {
-  const { t } = useTranslation("common")
+  const { t } = useTranslation(["common", "hearing"])
 
   const dateObject = new Date(hearingDate)
   const formattedDate = dateObject.toLocaleDateString("en-US", {
diff --git a/components/hearing/Transcriptions.tsx b/components/hearing/Transcriptions.tsx
index 82f4789f9..674e1ade5 100644
--- a/components/hearing/Transcriptions.tsx
+++ b/components/hearing/Transcriptions.tsx
@@ -51,7 +51,7 @@ export const Transcriptions = ({
   setCurTimeVideo: any
   videoTranscriptionId: string
 }) => {
-  const { t } = useTranslation("common")
+  const { t } = useTranslation(["common", "hearing"])
 
   const vid = videoTranscriptionId || "prevent FirebaseError"
 
diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index d381744ed..1104f6391 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -19,7 +19,7 @@ export default createPage<{ hearingId: number }>({
 export const getServerSideProps: GetServerSideProps = async ctx => {
   ctx.res.setHeader(
     "Cache-Control",
-    "public, s-maxage=10, stale-while-revalidate=10"
+    "public, s-maxage=10, stale-while-revalidate=10."
   )
 
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"

From 462b494594d880a663db096e75ecb740394d1d9e Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 16:23:02 -0400
Subject: [PATCH 73/74] reinstate week long cache control

---
 pages/hearing/[hearingId].tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pages/hearing/[hearingId].tsx b/pages/hearing/[hearingId].tsx
index 1104f6391..dbc7cc970 100644
--- a/pages/hearing/[hearingId].tsx
+++ b/pages/hearing/[hearingId].tsx
@@ -19,7 +19,7 @@ export default createPage<{ hearingId: number }>({
 export const getServerSideProps: GetServerSideProps = async ctx => {
   ctx.res.setHeader(
     "Cache-Control",
-    "public, s-maxage=10, stale-while-revalidate=10."
+    "public, s-maxage=604800, stale-while-revalidate=604800"
   )
 
   const locale = ctx.locale ?? ctx.defaultLocale ?? "en"

From 5402c6c864f4efd165655822c9cfee055ea22ed7 Mon Sep 17 00:00:00 2001
From: Merritt Baggett <mertbagt@gmail.com>
Date: Thu, 21 Aug 2025 16:25:15 -0400
Subject: [PATCH 74/74] remove console log

---
 components/hearing/HearingSidebar.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/components/hearing/HearingSidebar.tsx b/components/hearing/HearingSidebar.tsx
index 44c9f2edc..e8dfffe2f 100644
--- a/components/hearing/HearingSidebar.tsx
+++ b/components/hearing/HearingSidebar.tsx
@@ -100,8 +100,6 @@ export const HearingSidebar = ({
     setHouseChairName(houseName)
     setSenateChairName(senateName)
     setMembers(memberData)
-
-    console.log("data: ", docData)
   }, [committeeCode, generalCourtNumber])
 
   useEffect(() => {