Skip to content
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

📱 Fix in-app notification & improve loading UX #1045

Merged
merged 5 commits into from
Apr 23, 2023

Conversation

nwingt
Copy link
Member

@nwingt nwingt commented Apr 21, 2023

No description provided.

Comment on lines +95 to -102
<FollowerDialog
:is-open-followers-dialog="isOpenFollowersDialog"
:wallet-is-fetching-followers="walletIsFetchingFollowers"
:populated-followers="populatedFollowers"
@close="isOpenFollowersDialog = false"
@on-export-followers="handleClickExportFollowerList"
/>
</AuthRequiredView>

<FollowerDialog
:is-open-followers-dialog="isOpenFollowersDialog"
:wallet-is-fetching-followers="walletIsFetchingFollowers"
:populated-followers="populatedFollowers"
@close="isOpenFollowersDialog = false"
@on-export-followers="handleClickExportFollowerList"
/>
Copy link
Member Author

@nwingt nwingt Apr 21, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<FollowerDialog> must be inside the <AuthRequiredView/> to make <AuthRequiredView/> reactive...don't know why

Comment on lines +161 to -167
get progressContainerClasses() {
return [
'text-like-cyan-light',
{ 'text-shade-gray': this.preset === ProgressIndicatorPreset.Thin },
'fill-like-cyan-light',
];
}

get progressContainer() {
return {
class: [
'text-like-cyan-light',
{ 'text-shade-gray': this.preset === ProgressIndicatorPreset.Thin },
'fill-like-cyan-light',
],
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using an object with key class is not flattened with v-bind, so I move the class array to separated computed prop

<div class="flex justify-center mt-[24px]">
<ProgressIndicator v-if="walletIsLoggingIn" />
<div class="flex flex-col items-center mt-[24px]">
<template v-if="isLoadingAtStart || walletIsLoggingIn">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe isShowConnectButton = false is easier to read? isLoadingAtStart is confusing but I have no better suggestions

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmm, my purpose is not hiding connect button, this is solving the blinking UI before walletIsLoggingIn changes to true, how about isLoadingStartImmediately, like the immediate: true in watch?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sounds good to me

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated

@nwingt nwingt merged commit 0152dc1 into likecoin:master Apr 23, 2023
@nwingt nwingt deleted the feature/liker-land-app branch April 23, 2023 13:50
@nwingt nwingt restored the feature/liker-land-app branch April 23, 2023 13:50
@nwingt nwingt deleted the feature/liker-land-app branch April 23, 2023 13:50
@nwingt nwingt restored the feature/liker-land-app branch April 23, 2023 13:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants