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

feat: add lazy userpreview for all profiles #3884

Merged
merged 8 commits into from Oct 6, 2023
Merged

feat: add lazy userpreview for all profiles #3884

merged 8 commits into from Oct 6, 2023

Conversation

Clueed
Copy link
Contributor

@Clueed Clueed commented Oct 5, 2023

What does this PR do?

🤖 Generated by Copilot and @Clueed at ac463fb

This pull request make UserPreview always fetch from network (f77ad07).
Instead, the passed in profile is used as fallback when there is a network error (ac463fb).

Related issues

Fixes #3723

Type of change

  • Enhancement (non-breaking small changes to existing functionality)

Explanation of the changes

🤖 Generated by Copilot at ac463fb

  • Refactor UserPreview component to use useProfileLazyQuery hook and lazyProfile state variable to fetch profile data on hover and improve performance (link)
  • Add optional chaining operators to isVerified and hasMisused functions to avoid errors when lazyProfile or lazyProfile.id is undefined (link)
  • Extract UserProfileContent component from UserPreview to simplify and reuse profile content rendering (link)
  • Replace lazyProfile prop with compositeProfile prop in SuperFollow, Follow, and bio rendering to ensure latest profile data is passed and shown (link, link, link, link)
  • Replace lazyProfile prop with compositeProfile prop in total following and followers count rendering to ensure count is updated with fetched profile data (link, link)
  • Simplify onPreviewStart function to use loadProfile hook without awaiting or setting loading state and move loading and profile content rendering logic to Preview component (link)

Preview

Screen.Recording.2023-10-05.at.12.34.08.mov
  • Video recoded on slow network to show loading state.
  • Only tested on profile as Who to follow only worked when logged-in. Looking at the code it should be no issues.

Emoji

🚀🧑‍💻🖼️

/claim #3723

@Clueed Clueed requested a review from bigint as a code owner October 5, 2023 10:44
@vercel
Copy link

vercel bot commented Oct 5, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
prerender ✅ Ready (Inspect) Visit Preview Oct 6, 2023 2:41pm
web ✅ Ready (Inspect) Visit Preview Oct 6, 2023 2:41pm

@Clueed

This comment was marked as abuse.

@Clueed Clueed marked this pull request as ready for review October 5, 2023 11:10
@Clueed

This comment was marked as abuse.

apps/web/src/components/Shared/UserPreview.tsx Outdated Show resolved Hide resolved
alt={formatHandle(lazyProfile?.handle)}
/>
);
const [fakeLoading, setFakeLoading] = useState<boolean>(loading);
Copy link
Member

Choose a reason for hiding this comment

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

we can use different name imo

This comment was marked as abuse.

Comment on lines 49 to 51
if (!handle && !profile) {
throw new Error('UserPreview needs to receive a profile or a handle');
}
Copy link
Member

Choose a reason for hiding this comment

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

We can just return null!

This comment was marked as abuse.

Copy link
Member

@bigint bigint left a comment

Choose a reason for hiding this comment

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

LGTM :shipit:

LGTM

@bigint bigint changed the title feat: fetch userpreview feat: add lazy userpreview for all profiles Oct 6, 2023
@bigint bigint merged commit 9f5b25f into heyxyz:main Oct 6, 2023
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants