-
Notifications
You must be signed in to change notification settings - Fork 50
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Refactor and fix types in events redux code #4977
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 1 Skipped Deployment
|
95a02a4
to
c00ec5c
Compare
usePreparedEffect( | ||
'fetchEventAbacard', | ||
() => { | ||
if (query && typeof query === 'string') { | ||
return dispatch(autocomplete(query, ['users.user'])); | ||
} | ||
}, | ||
[query], | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't know what this was supposed to do. typeof query
is never a string
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you never know with this webapp! 😆
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is all moved out of EventDetail
with very minor changes
Also fix issues in createLegoAdapter causing type errors
It looks a bit weird when it shows 0 seconds left
5d27c22
to
a0f7908
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Whop didn't get to review everything, but I'll submit my one comment
initialState: legoAdapter.getInitialState(), | ||
initialState: legoAdapter.getInitialState({ | ||
test: 1, | ||
}), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What's the purpose of this test: 1
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
well, heh, it was for testing the typescript types...
Fixed in #5002
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks much cleaner! 😍 You've done an awesome job here! I love the custom hooks
@@ -402,7 +415,7 @@ const JoinEventForm = ({ | |||
|
|||
{event.activationTime && registrationOpensIn && ( | |||
<Button disabled={disabledButton}> | |||
{`Åpner om ${moment(registrationOpensIn.asMilliseconds()).format('mm:ss')}`} | |||
{`Åpner om ${moment(registrationOpensIn.add(1, 'second').asMilliseconds()).format('mm:ss')}`} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Isn't the add
supposed to be on the moment object instead of registrationOpensIn
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's ugly but it works correctly now. We add one second to the displayed time left until it opens, so that the countdown will end after showing 00:01 instead of showing 00:00 for one second. Normally it rounds down the number of seconds left.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I get that, but I was wondering if it was more "right" to do
{`Åpner om ${moment(registrationOpensIn.add(1, 'second').asMilliseconds()).format('mm:ss')}`} | |
{`Åpner om ${moment(registrationOpensIn).add(1, 'second').asMilliseconds().format('mm:ss')}`} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oh, right of course. No, I don't think so, this does something weird to get the formatting we want. registrationOpensIn
is a duration, we add one second to this duration, and then we change it into a moment which is more of a timestamp (I think?). And then we format this as "mm:ss" to get the countdown.
I'm not sure how it works, but I think it is correct now. The duration (registrationOpensIn
) doesn't have .format
, so we need to do moment()
and I'm not sure if .add
would work the same after doing moment()
@@ -385,6 +397,7 @@ const JoinEventForm = ({ | |||
!registrationPending && | |||
!registration && | |||
captchaOpen && | |||
config.environment !== 'ci' && |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This could probably just be on the Captcha Field itself
|
||
unansweredSurveys: EntityId[]; | ||
|
||
actionGrant: ActionGrant; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What's up with the spacings
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
idk, sometimes I've put some spacing to separate admin-stuff from normal stuff f.ex. But this one seems unnecessary
selectAllEvents<ListEventWithUserRegistration>(state, { | ||
pagination: previousEventsPagination, | ||
}), | ||
).filter((e) => e.userReg); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why is this filter only done on previous events?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think it filters out any events weher you were on the waiting list. For upcoming events we want to show these too.
).filter((e) => e.userReg); | ||
|
||
const sortedPreviousEvents = previousEvents | ||
?.filter((e) => !!e.userReg?.pool) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I suppose e.userReg
will never be undefined
since you've already filtered it out above
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Agree, but typescript is dumb
For arrangement{' '} | ||
<Link to={`/events/${event.id}`}>{event.title}</Link> | ||
<Link to={`/events/${event?.id}`}>{event?.title}</Link> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Kinda useless to only show "For arrangement" if event is undefined
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I think all surveys have an event. But it will probably look a bit weird while loading:/
const params = useParams<{ | ||
eventIdOrSlug: string; | ||
}>(); | ||
}>() as { | ||
eventIdOrSlug: string; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this really how we have to do this now 💀
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Argh, yes... I don't know why they changed this to make all params optional, it worked fine in react-router-v5
. And the params are required, there is no way to reach this path without specifying an event id...
I have a plan to make a custom hook like useRequiredParams
or something, that just typecasts this a bit prettier.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
haha oh well 🤷🏼♂️
usePreparedEffect( | ||
'fetchEventAbacard', | ||
() => { | ||
if (query && typeof query === 'string') { | ||
return dispatch(autocomplete(query, ['users.user'])); | ||
} | ||
}, | ||
[query], | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you never know with this webapp! 😆
Description
Improves types and simplifies redux code related to events. Fixes most of the typescript errors in events code.
Number of typescript errors: 474 -> 371
Result
No visual changes.
Except that I fixed two small bugs:
Testing
The redux code is fairly well tested using unit tests, these still pass of course. I have also manually tested by opening pages and testing some core functionality.