@@ -12,7 +12,7 @@ import {
1212 FeatureCalloutButton
1313} from "../shared/CommonComponents"
1414import { HearingSidebar } from "./HearingSidebar"
15- import { Paragraph , fetchTranscriptionData } from "./transcription "
15+ import { HearingData , Paragraph , fetchTranscriptionData } from "./hearing "
1616import { Transcriptions } from "./Transcriptions"
1717
1818const LegalContainer = styled ( Container ) `
@@ -36,12 +36,22 @@ const VideoParent = styled.div`
3636`
3737
3838export const HearingDetails = ( {
39- hearingId
39+ hearingData : {
40+ billsInAgenda,
41+ committeeCode,
42+ committeeName,
43+ description,
44+ generalCourtNumber,
45+ hearingDate,
46+ hearingId,
47+ videoTranscriptionId,
48+ videoURL
49+ }
4050} : {
41- hearingId : string | string [ ] | undefined
51+ hearingData : HearingData
4252} ) => {
4353 const { t } = useTranslation ( [ "common" , "hearing" ] )
44- const [ transcriptData , setTranscriptData ] = useState < Paragraph [ ] > ( [ ] )
54+ const [ transcriptData , setTranscriptData ] = useState < Paragraph [ ] | null > ( null )
4555
4656 const [ videoLoaded , setVideoLoaded ] = useState ( false )
4757 const handleVideoLoad = ( ) => {
@@ -53,43 +63,14 @@ export const HearingDetails = ({
5363 videoRef . current ? ( videoRef . current . currentTime = value ) : null
5464 }
5565
56- const eventId = `hearing-${ hearingId } `
57-
58- const [ billsInAgenda , setBillsInAgenda ] = useState ( [ ] )
59- const [ committeeCode , setCommitteeCode ] = useState ( "" )
60- const [ committeeName , setCommitteeName ] = useState ( "" )
61- const [ description , setDescription ] = useState ( "" )
62- const [ generalCourtNumber , setGeneralCourtNumber ] = useState ( "" )
63- const [ hearingDate , setHearingDate ] = useState ( "" )
64- const [ videoTranscriptionId , setVideoTranscriptionId ] = useState ( "" )
65- const [ videoURL , setVideoURL ] = useState ( "" )
66-
67- const hearingData = useCallback ( async ( ) => {
68- const hearing = await getDoc ( doc ( firestore , `events/${ eventId } ` ) )
69- const docData = hearing . data ( )
70-
71- setBillsInAgenda ( docData ?. content . HearingAgendas [ 0 ] ?. DocumentsInAgenda )
72- setCommitteeCode ( docData ?. content . HearingHost . CommitteeCode )
73- setCommitteeName ( docData ?. content . Name )
74- setDescription ( docData ?. content . Description )
75- setGeneralCourtNumber ( docData ?. content . HearingHost . GeneralCourtNumber )
76- setHearingDate ( docData ?. content . EventDate )
77- setVideoTranscriptionId ( docData ?. videoTranscriptionId )
78- setVideoURL ( docData ?. videoURL )
79- } , [ eventId ] )
80-
8166 useEffect ( ( ) => {
8267 ; ( async function ( ) {
83- if ( ! videoTranscriptionId || transcriptData . length !== 0 ) return
68+ if ( ! videoTranscriptionId || transcriptData !== null ) return
8469 const docList = await fetchTranscriptionData ( videoTranscriptionId )
8570 setTranscriptData ( docList )
8671 } ) ( )
8772 } , [ videoTranscriptionId ] )
8873
89- useEffect ( ( ) => {
90- hearingData ( )
91- } , [ hearingData ] )
92-
9374 return (
9475 < Container className = "mt-3 mb-3" >
9576 < Row className = { `mb-3` } >
@@ -115,11 +96,15 @@ export const HearingDetails = ({
11596 ) }
11697
11798 { committeeName ? (
118- < h1 >
119- < External href = { committeeURL ( committeeCode ) } >
120- { committeeName }
121- </ External >
122- </ h1 >
99+ committeeCode ? (
100+ < h1 >
101+ < External href = { committeeURL ( committeeCode ) } >
102+ { committeeName }
103+ </ External >
104+ </ h1 >
105+ ) : (
106+ < h1 > { committeeName } </ h1 >
107+ )
123108 ) : (
124109 < > </ >
125110 ) }
@@ -128,37 +113,41 @@ export const HearingDetails = ({
128113
129114 < Row >
130115 < Col className = { `col-md-8 mt-4` } >
131- < LegalContainer className = { `pb-2 rounded` } >
132- < Row
133- className = { `d-flex align-items-center justify-content-between` }
134- fontSize = { "12px" }
135- xs = "auto"
136- >
137- < Col >
138- < div className = { `fs-6 fw-bold mt-2` } >
139- < Image
140- src = "/images/smart-summary.svg"
141- alt = { t ( "bill.smart_tag" ) }
142- height = { `34` }
143- width = { `24` }
144- className = { `me-2 pb-1` }
116+ { transcriptData ? (
117+ < LegalContainer className = { `pb-2 rounded` } >
118+ < Row
119+ className = { `d-flex align-items-center justify-content-between` }
120+ fontSize = { "12px" }
121+ xs = "auto"
122+ >
123+ < Col >
124+ < div className = { `fs-6 fw-bold mt-2` } >
125+ < Image
126+ src = "/images/smart-summary.svg"
127+ alt = { t ( "bill.smart_tag" ) }
128+ height = { `34` }
129+ width = { `24` }
130+ className = { `me-2 pb-1` }
131+ />
132+ { t ( "bill.smart_disclaimer2" ) }
133+ </ div >
134+ </ Col >
135+
136+ < Col >
137+ < Trans
138+ t = { t }
139+ i18nKey = "bill.smart_disclaimer3"
140+ components = { [
141+ // eslint-disable-next-line react/jsx-key
142+ < links . Internal href = "/about/how-maple-uses-ai" />
143+ ] }
145144 />
146- { t ( "bill.smart_disclaimer2" ) }
147- </ div >
148- </ Col >
149-
150- < Col >
151- < Trans
152- t = { t }
153- i18nKey = "bill.smart_disclaimer3"
154- components = { [
155- // eslint-disable-next-line react/jsx-key
156- < links . Internal href = "/about/how-maple-uses-ai" />
157- ] }
158- />
159- </ Col >
160- </ Row >
161- </ LegalContainer >
145+ </ Col >
146+ </ Row >
147+ </ LegalContainer >
148+ ) : (
149+ < > </ >
150+ ) }
162151
163152 { videoURL ? (
164153 < VideoParent className = { `mt-3` } >
@@ -172,16 +161,24 @@ export const HearingDetails = ({
172161 </ VideoParent >
173162 ) : (
174163 < LegalContainer className = { `fs-6 fw-bold my-3 py-2 rounded` } >
175- { t ( "no_video_on_file" , { ns : "hearing" } ) }
164+ { transcriptData
165+ ? t ( "no_video_on_file" , { ns : "hearing" } )
166+ : t ( "no_video_or_transcript" , { ns : "hearing" } ) }
176167 </ LegalContainer >
177168 ) }
178169
179- < Transcriptions
180- transcriptData = { transcriptData }
181- setCurTimeVideo = { setCurTimeVideo }
182- videoLoaded = { videoLoaded }
183- videoRef = { videoRef }
184- />
170+ { transcriptData ? (
171+ < Transcriptions
172+ transcriptData = { transcriptData }
173+ setCurTimeVideo = { setCurTimeVideo }
174+ videoLoaded = { videoLoaded }
175+ videoRef = { videoRef }
176+ />
177+ ) : videoURL ? (
178+ < LegalContainer className = { `fs-6 fw-bold mb-2 py-2 rounded-bottom` } >
179+ < div > { t ( "no_transcript_on_file" , { ns : "hearing" } ) } </ div >
180+ </ LegalContainer >
181+ ) : null }
185182 </ Col >
186183
187184 < div className = { `col-md-4` } >
0 commit comments