Site
/
schedule
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
src/Schedule/Schedule.jsx
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,57 +38,46 @@ 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> {header.map(hall => <th key={hall.id}>{hall.name}</th>)}
{header.map(hall => <th key={hall.id}>{hall.name}</th>)} </tr>
</tr> </thead>
</thead> <tbody>
<tbody> {rows.map(row => <tr key={row.id}>
{rows.map(row => <tr key={row.id}> {row.cells.map(cell => <td key={cell.id} {...cell.attributes}>
{row.cells.map(cell => <td key={cell.id} {...cell.attributes}> <Event {...cell.event} />
<Event {...cell.event} /> </td>)}
</td>)} </tr>)}
</tr>)} </tbody>
</tbody> <tfoot>
<tfoot> <tr>
<tr> {header.map(hall => <th key={hall.id}>{hall.name}</th>)}
{header.map(hall => <th key={hall.id}>{hall.name}</th>)} </tr>
</tr> </tfoot>
</tfoot> </table>
</table> <div className="separator"/>
<div className="separator"/> <table>
</>} <tbody>
{tracks && <> {Object.entries(tracks).filter(([, track]) =>
<table> !isTrackHidden(track)
<tbody> ).map(([trackId, track]) => <tr key={trackId}>
{Object.entries(tracks).filter(([, track]) => <td className={track.css_class}>{track.name[lang]}</td>
!isTrackHidden(track) </tr>)}
).map(([trackId, track]) => <tr key={trackId}> {Object.entries(langs).map(([code, name]) => <tr key={code}>
<td className={track.css_class}>{track.name[lang]}</td> <td className={'schedule-'.concat(code)}>{name}</td>
</tr>)} </tr>)}
{Object.entries(langs).map(([code, name]) => <tr key={code}> </tbody>
<td className={'schedule-'.concat(code)}>{name}</td> </table>
</tr>)} <div className="separator" />
</tbody> {Object.entries(events).map(([eventId, event]) => <section key={eventId} id={'lecture-'.concat(eventId)}>
</table>
<div className="separator" />
</>}
{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>}
</>); </>);
} }