Skip to content

fix(profile+notifications): banner upload crop, notification bell All tab, read-state styling#451

Merged
spe1020 merged 5 commits into
zapcooking:mainfrom
dmnyc:fix/profile-banner-upload
Jun 17, 2026
Merged

fix(profile+notifications): banner upload crop, notification bell All tab, read-state styling#451
spe1020 merged 5 commits into
zapcooking:mainfrom
dmnyc:fix/profile-banner-upload

Conversation

@dmnyc

@dmnyc dmnyc commented Jun 17, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • Profile bannersProfileEditModal no longer forces a square crop when uploading a banner image; the full aspect ratio is preserved
  • Profile banner mobile layout — banner negative margin corrected from -mx-2 to -mx-4 to match the modal's px-4 mobile padding, so it fills edge-to-edge on small screens
  • Bio newlinesParsedBio now renders \n characters as actual line breaks (white-space: pre-wrap) instead of collapsing bios into a wall of text
  • Notification bell All tab — previously merged Nostr notifications and DMs, making the full Notifications page appear blank when the user only had DM activity; All tab now shows only Nostr notifications (reactions, zaps, replies, reposts, mentions), matching what /notifications displays — DMs remain in the dedicated DMs tab
  • Notification read-state — replaced the aggressive 55% opacity dim on read rows with a subtle orange tint on unread rows, consistent with the bell dropdown's existing treatment
  • Mentions tab — previously only showed standalone notes with no thread context (almost always empty); now shows all notes that p-tagged you, matching how other Nostr clients define a mention

Test plan

  • Upload a wide/landscape banner image on the profile edit modal — confirm it is not cropped to a square
  • On mobile, open the profile edit modal — confirm the banner fills the full width with no side gaps
  • View a profile with a multi-line bio — confirm line breaks render correctly
  • With only DM activity (no recent reactions/zaps/replies), open the bell: All tab should be empty; DMs tab should show conversations — /notifications should also be empty (no false "broken" impression)
  • With Nostr notifications present, open the bell All tab — confirm reactions/zaps/replies appear; DMs do not appear in All tab
  • On /notifications, unread rows should have a faint orange background tint; read rows should display at full opacity with no tint
  • Switch to the Mentions tab — confirm it shows notes where you were p-tagged, including those inside reply threads

🤖 Generated with Claude Code

dmnyc and others added 5 commits June 17, 2026 00:35
The profile editor sent both avatar and banner images to nostr.build's
/api/v2/upload/profile endpoint, which crops to a square profile picture.
The NIP-96 media_type='banner' hint isn't honored there (the endpoint's
advertised transformations don't include avatar/banner cropping), so
banners came out pfp-shaped.

Route banner uploads through the general /api/v2/upload/files endpoint
(the same one the composer uses), which preserves the uploaded aspect
ratio. Avatars stay on /upload/profile where a square crop is correct.
The NIP-98 auth 'u' tag and response parsing already key off the same
url variable, so both paths stay consistent.
…h unread highlight

DMs were merged into the bell's All tab, making the notifications page
appear blank when the only activity was DMs. All tab now shows only
Nostr notifications (matching the full page scope); DMs remain in the
DMs tab.

Replaces the 55% opacity dim on read rows with a subtle orange tint on
unread rows — same treatment as the bell dropdown — so the full
notifications list renders at full legibility.
…tandalone ones

The parser classifies kind 1 events with e-tags as 'comment' (threaded
reply) and those without as 'mention' (standalone note). Most real-world
mentions happen inside reply threads, so the Mentions tab was always
empty despite activity. Mentions tab now shows both types — any note
that p-tagged you — matching how other Nostr clients define a mention.
ParsedBio: add white-space: pre-wrap so \n in bio text renders as line
breaks instead of collapsing to a wall of text.

ProfileEditModal: bump banner negative margin from -mx-2 to -mx-4 to
match the modal's px-4 mobile padding, so the banner fills the full
width instead of leaving gaps on each side.
@spe1020 spe1020 merged commit 2d76ca7 into zapcooking:main Jun 17, 2026
4 checks passed
@dmnyc dmnyc deleted the fix/profile-banner-upload branch June 17, 2026 12:55
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