refactor(profile): split the 1927-line user page into header, tabs, form, hook and helpers - #384
Merged
Merged
Conversation
…orm, hook and helpers app/user/page.tsx held the profile card, its edit form, the tab strip with four lazily loaded lists, two hand-rolled modals, the social-link URL builder and the repost merge. It is now 665 lines that own the data and compose: components/profile/profile-header.tsx (banner, avatar, action row, card or ProfileEditForm), profile-tabs.tsx (strip + lists), profile-edit-form.tsx (one ProfileDraft object instead of eight useStates), image-customization-modal.tsx, hooks/use-profile-tabs.ts (replies, top, mentions loaders and their reset), lib/profile-links.ts (with a spec), lib/feed/resolve-user-reposts.ts (the repost stamping that initial load and load-more each copied), and components/ui/tooltip-button.tsx for the round icon buttons and badges. Behaviour kept: page size, cursor handling, NSFW interstitial, edit and tip deep links, identity-missing redirect, per-profile resets. The profile-link copy buttons go through useCopy, so they only report success on success.
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Team Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Deploying yappr with
|
| Latest commit: |
d846240
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://fe806727.yappr.pages.dev |
| Branch Preview URL: | https://refactor-user-page-split.yappr.pages.dev |
TooltipBadge no longer imposes pill classes, which had leaked font-medium onto the identity-id copy button; the two real badges carry their own. hasDpns and isOwnProfile are derived rather than stored and passed. One replaceQueryParam and one withAuthor helper replace their duplicates; the tab hook uses one activation effect and a static postService import; the tab list picks its copy from a per-tab record; the repost merge looks up originals by id.
2 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
app/user/page.tsx(1927 lines) is now 665 lines that own the data and compose:components/profile/profile-header.tsx: banner, avatar, action row, and the profile card or its edit form.components/profile/profile-edit-form.tsx: the editor, driven by oneProfileDraftobject in place of eightuseStates.components/profile/profile-tabs.tsx: the tab strip and the posts / replies / top / mentions / blog lists.hooks/use-profile-tabs.ts: the lazy loaders for replies, top and mentions, plus the per-profile reset.components/profile/image-customization-modal.tsx: the overlay the avatar and banner editors share.components/ui/tooltip-button.tsx: the round icon button and inline badge with a tooltip (six copies of the Radix boilerplate collapse into two components).lib/profile-links.ts(+ spec, 13 cases): social-link URL builder and http check.lib/feed/resolve-user-reposts.ts: the repost stamping and newest-activity sort that the initial load and load-more each copied.Behaviour preserved: page size and the two pagination cursors, NSFW interstitial,
?edit=trueand?tip=deep links, identity-missing redirect, per-profile state resets, the Top tab reset on window change. The two clipboard buttons now go throughuseCopy, so they only toast success on success.Part of the anti-slop cleanup series (after #370–#383).
Test plan
npm run lint(zero warnings),tsc --noEmit,npm run test(123 specs incl. 13 new),npx knip,npm run buildall green locally?edit=true; another profile follow/unfollow, tip, message, block notice; each tab incl. Top window toggle and posts infinite scroll; NSFW interstitial; payment address → QR dialog and?tip=deep link; username registration modal🤖 Generated with Claude Code