Skip to content

fix(mobile): commenting fails on tracks with zero existing comments#14329

Merged
dylanjeffers merged 1 commit into
mainfrom
claude/fix-mobile-comment-zero-comments
May 15, 2026
Merged

fix(mobile): commenting fails on tracks with zero existing comments#14329
dylanjeffers merged 1 commit into
mainfrom
claude/fix-mobile-comment-zero-comments

Conversation

@dylanjeffers
Copy link
Copy Markdown
Contributor

Summary

  • Comment drawer was rendering a plain <Flex><NoComments /></Flex> for the empty state and only mounting a BottomSheetFlatList once at least one comment existed
  • Inside Gorhom's BottomSheetModal, scrollable content must live inside a BottomSheet* component for keyboard avoidance + touch propagation to the footer composer to work
  • On a 0-comment track, the send-button taps never reached the form's onSubmit handler — the comment couldn't be posted
  • Fix: always render BottomSheetFlatList, move NoComments into ListEmptyComponent so bottom-sheet plumbing stays mounted in both states

Root cause

packages/mobile/src/components/comments/CommentDrawer.tsx CommentDrawerContent had two return branches:

if (!commentIds || !commentIds.length) {
  return <Flex p='l'><NoComments /></Flex>   // no BottomSheet wrapper
}
return <BottomSheetFlatList ... />            // proper wrapper

The plain <Flex> doesn't participate in Gorhom's gesture/keyboard system, so taps in the footer's BottomSheetFooter (the form) get eaten by the gesture recognizer instead of reaching the send button. Swapping the empty-state branch into a ListEmptyComponent keeps the BottomSheetFlatList mounted in both states and the send-button tap reaches the composer.

Test plan

  • Mobile: open a track with zero comments → tap the comment input → drawer opens → type a comment → tap send → comment appears optimistically (this is what was previously broken)
  • Mobile: open a track with existing comments → post a new comment → comment appears optimistically (regression check)
  • Mobile: open a 0-comment track → drawer shows the "Be the first to leave a comment" empty state inside the scroll area (visual regression check)
  • Mobile: scroll behavior of the comment list with multiple comments still works

🤖 Generated with Claude Code

The comment drawer renders a plain `<Flex><NoComments /></Flex>` for the
empty state and only mounts a `BottomSheetFlatList` once at least one
comment exists. Inside Gorhom's BottomSheetModal, scrollable content has
to live inside a BottomSheet* component for keyboard avoidance and touch
propagation to the footer composer to work. Swapping to a plain Flex on
0-comment tracks breaks the send button — the user's tap never reaches
the form's onSubmit handler.

Always render the BottomSheetFlatList and move the NoComments view into
`ListEmptyComponent` so the bottom-sheet plumbing stays mounted in both
states.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented May 15, 2026

⚠️ No Changeset found

Latest commit: 5529ac6

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@dylanjeffers dylanjeffers merged commit 8c7fd58 into main May 15, 2026
3 checks passed
@dylanjeffers dylanjeffers deleted the claude/fix-mobile-comment-zero-comments branch May 15, 2026 19:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant