Skip to content

refactor(profile): split the 1927-line user page into header, tabs, form, hook and helpers - #384

Merged
PastaPastaPasta merged 2 commits into
stagingfrom
refactor/user-page-split
Sep 7, 2026
Merged

refactor(profile): split the 1927-line user page into header, tabs, form, hook and helpers#384
PastaPastaPasta merged 2 commits into
stagingfrom
refactor/user-page-split

Conversation

@PastaPastaPasta

Copy link
Copy Markdown
Owner

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 one ProfileDraft object in place of eight useStates.
  • 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=true and ?tip= deep links, identity-missing redirect, per-profile state resets, the Top tab reset on window change. The two clipboard buttons now go through useCopy, 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 build all green locally
  • CI
  • Manual: own profile edit/save/cancel incl. avatar and banner, ?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

…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.
@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Sep 7, 2026

Copy link
Copy Markdown

Deploying yappr-v2 with  Cloudflare Pages  Cloudflare Pages

Latest commit: 4d32502
Status:⚡️  Build in progress...

View logs

@coderabbitai

coderabbitai Bot commented Sep 7, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Team

Run ID: ef98709c-977c-4ab5-b779-e2c43d0a3545

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying yappr with  Cloudflare Pages  Cloudflare Pages

Latest commit: d846240
Status: ✅  Deploy successful!
Preview URL: https://fe806727.yappr.pages.dev
Branch Preview URL: https://refactor-user-page-split.yappr.pages.dev

View logs

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.
@PastaPastaPasta
PastaPastaPasta merged commit 4448acb into staging Sep 7, 2026
8 of 9 checks passed
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.

1 participant