notifications: refactor inbox to match spec

This commit is contained in:
Liam Fitzgerald 2021-04-16 16:02:05 +10:00
parent 801ccdad6f
commit 3bd1e06f0f
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB

View File

@ -121,7 +121,7 @@ export default function Inbox(props: {
);
return (
<Col ref={scrollRef} position="relative" height="100%" overflowY="auto">
<Col p="1" ref={scrollRef} position="relative" height="100%" overflowY="auto">
<Invites pendingJoin={props.pendingJoin} api={api} />
{[...notificationsByDayMap.keys()].sort().reverse().map((day, index) => {
const timeboxes = notificationsByDayMap.get(day)!;
@ -175,26 +175,15 @@ function DaySection({
return (
<>
<Box position="sticky" zIndex={3} top="-1px" bg="white">
<Box p="2" bg="scales.black05">
<Text>
{label}
</Text>
</Box>
</Box>
{_.map(timeboxes.sort(sortTimeboxes), ([date, nots], i: number) =>
_.map(nots.sort(sortIndexedNotification), (not, j: number) => (
<React.Fragment key={j}>
{(i !== 0 || j !== 0) && (
<Box flexShrink={0} height="4px" bg="scales.black05" />
)}
<Notification
api={api}
notification={not}
archived={archive}
time={date}
/>
</React.Fragment>
<Notification
key={j}
api={api}
notification={not}
archived={archive}
time={date}
/>
))
)}
</>