Skip to content

Badge errors with Text strings must be rendered within a <Text> component #4492

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

Closed
amarjanica opened this issue Sep 10, 2024 · 1 comment · Fixed by #4693
Closed

Badge errors with Text strings must be rendered within a <Text> component #4492

amarjanica opened this issue Sep 10, 2024 · 1 comment · Fixed by #4693
Assignees
Milestone

Comments

@amarjanica
Copy link

amarjanica commented Sep 10, 2024

Current behaviour

Badge in Drawer.CollapsedItem throws Text strings must be rendered within a <Text> component but only when I input a zero.
For all other numbers it works.

How to reproduce?

<Drawer.CollapsedItem
          onPress={() => {}}
          focusedIcon="account-group"
          badge={0}
          unfocusedIcon="account-group-outline"
          label="Group"
        />

I ran this in expo dev client on a real device if it matters.

What have you tried so far?

I know how to handle this, just not set badge if count is zero. But maybe you want to handle it in code.

Your Environment

software version
ios x
android x
react-native x.x.x
react-native-paper 5.12.5
node x.x.x
npm or yarn x.x.x
expo sdk 51.0.31
@amarjanica amarjanica added the bug label Sep 10, 2024
@gedu
Copy link
Contributor

gedu commented Sep 12, 2024

Hey, that is something funny from JS, because we check if a badge is given and 0 && true -> it is 0, so It tries to render it. If you pass any other number 1 && true it is true so it renders the Badge component.
As a workaround I would suggest instead of passing 0, pass false.

Note: I think you will see the same issue is you pass an empty string ""

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants