Repository navigation
Conversation
| </Typography> | ||
| </Box> | ||
| <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}> | ||
| {!isPersonal && <PassageAssignee assign={cardInfo.assign} />} |
There was a problem hiding this comment.
Yeah, I would not show PassageAssignee at all, unless there's an assignee.
| > | ||
| {cardInfo.step} | ||
| </Button> | ||
| {playButton} |
There was a problem hiding this comment.
The Play button is centered with the card content and not the whole card. This makes the button look offcenter the smaller the card height is. It's minor, but noticeable
|
|
||
| export function PassagePlayButton({ | ||
| mediaId, | ||
| playing, |
There was a problem hiding this comment.
I wasn't able to determine why playing needs to be passed in, i.e. controlled externally. I didn't see a good reason from the parents where this was needed. Ideally, the Play button would be able to play/pause its own audio, since the media is loaded here, as well.
| flexShrink: 0, | ||
| }} | ||
| > | ||
| <CircularProgress |
There was a problem hiding this comment.
Good job getting this working and looking good
| <PassagePlayButton | ||
| mediaId={mediaId} | ||
| playing={isPlaying} | ||
| active={isPlayActive} |
There was a problem hiding this comment.
Can we say "Enabled" instead of "Active"?
There was a problem hiding this comment.
Actually, I may take this back. It's possible I don't fully understand this flag. Is it just resetting the UI when the play stops? It seems like there might be a way to do that without "needing to be told" externally

Major passage overview rework to match the design
Screenshots:
[Before]

[After]
