Fix progress tracking of schedule, render participant users and feedback link using the newly created components

This commit is contained in:
Vencislav Atanasov 2024-09-22 04:04:32 +03:00
parent 316e75c3f7
commit f6c71b9897
1 changed files with 44 additions and 51 deletions

View File

@ -7,6 +7,8 @@ import Event from './Event.jsx';
import defaultSpeaker from '../assets/default-speaker.png'; import defaultSpeaker from '../assets/default-speaker.png';
import './Schedule.scss'; import './Schedule.scss';
import { langs } from './constants.js'; import { langs } from './constants.js';
import Speaker from './Speaker.jsx';
import FeedbackLink from './FeedbackLink.jsx';
export default function Schedule({ export default function Schedule({
conferenceId, conferenceId,
@ -20,6 +22,7 @@ export default function Schedule({
slots, slots,
isLoading, isLoading,
loadingProgress, loadingProgress,
isComplete,
} = useSchedule(conferenceId); } = useSchedule(conferenceId);
const { const {
@ -27,6 +30,7 @@ export default function Schedule({
rows, rows,
} = useScheduleTable({ } = useScheduleTable({
events, events,
tracks,
halls, halls,
slots, slots,
lang, lang,
@ -34,9 +38,8 @@ export default function Schedule({
return (<> return (<>
{isLoading && <progress value={loadingProgress}/>} {isLoading && <progress value={loadingProgress}/>}
<div className="schedule"> {isComplete && <div className="schedule">
<hr /> <hr />
{header && rows && <>
<table> <table>
<thead> <thead>
<tr> <tr>
@ -57,8 +60,6 @@ export default function Schedule({
</tfoot> </tfoot>
</table> </table>
<div className="separator"/> <div className="separator"/>
</>}
{tracks && <>
<table> <table>
<tbody> <tbody>
{Object.entries(tracks).filter(([, track]) => {Object.entries(tracks).filter(([, track]) =>
@ -72,19 +73,11 @@ export default function Schedule({
</tbody> </tbody>
</table> </table>
<div className="separator" /> <div className="separator" />
</>} {Object.entries(events).map(([eventId, event]) => <section key={eventId} id={'lecture-'.concat(eventId)}>
{events && tracks && Object.entries(events).map(([eventId, event]) => <section key={eventId} id={'lecture-'.concat(eventId)}>
<p> <p>
<strong>{event.title}</strong> <strong>{event.title}</strong>
{event.participant_user_ids && !isTrackHidden(tracks[event.track_id]) && speakers && <> {event.participant_users && !isTrackHidden(event.track) && <>
({event.participant_user_ids.map(speakerId => speakers[speakerId] && <Fragment key={speakerId}> ({event.participant_users.map(speaker => speaker && <Speaker key={speaker.id} {...speaker} />)})
<a key={speakerId} href={'#'.concat(getSpeakerName(speakers[speakerId]))}>
{getSpeakerName(speakers[speakerId])}
</a>
{speakers[speakerId].organisation && <>
/&#8288;{speakers[speakerId].organisation}&#8288;/
</>}
</Fragment>).filter(item => !!item)})
</>} </>}
</p> </p>
{event.abstract && <p> {event.abstract && <p>
@ -92,12 +85,12 @@ export default function Schedule({
</p>} </p>}
<p className="feedback"> <p className="feedback">
<strong> <strong>
<a href={event.feedback_url}>Submit feedback</a> <FeedbackLink {...event} />
</strong> </strong>
</p> </p>
<div className="separator" /> <div className="separator" />
</section>)} </section>)}
{speakers && <> {<>
<div className="grid members"> <div className="grid members">
{Object.entries(speakers).map(([speakerId, speaker]) => <div key={speakerId} className="col4 wmember"> {Object.entries(speakers).map(([speakerId, speaker]) => <div key={speakerId} className="col4 wmember">
<a href={'#'.concat(getSpeakerName(speaker))}> <a href={'#'.concat(getSpeakerName(speaker))}>
@ -122,7 +115,7 @@ export default function Schedule({
<div className="separator" /> <div className="separator" />
</Fragment>)} </Fragment>)}
</>} </>}
</div> </div>}
</>); </>);
} }