I'm using Wix Navigation ^3.1.2 in my React Native ^0.60.5 app. I set a bottomTab in a stack screen where I manually add a badge number through Navigation.mergeOptions()
method. Whenever I read the messages in the chat, I want to remove this badge from the Message button. So what I currently do is passing badge to null.
It works on iOS without any problems, but on Android, it doesn't make it disappear.
I even attempted passing an empty object to bottomTab like bottomTab: {}
and still didn't work.
I have the following stack structure:
stack: {
id: 'MessageStack',
children: [
{
component: {
id: 'MessageScreen',
name: 'myapp.MessageScreen'
}
}],
options: {
bottomTab: {
text: i18n.t('messages'),
icon: iconsMap['message-light'],
selectedIcon: iconsMap['message-solid'],
badgeColor: 'red',
...navigatorStyle
}
}
}
And this is what I do when I want to remove it:
let badgeValue = null;
if (totalUnread > 0) {
badgeValue = (totalUnread > 9) ? '9+' : `${totalUnread}`;
}
Navigation.mergeOptions('MessageScreen', {
bottomTab: {
badge: badgeValue
}
});
Any ideas on how to achieve this on Android? Thanks.
If anyone is under the same problem, it was as easy as passing an empty string to remove it. I thought I tested and didn't work but after the recommendation on github I tested again and worked.