ERROR Warning: BottomTabNavigator: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.

[Koykoy200078]

ERROR Warning: BottomTabNavigator: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.

// package,json "react": "18.3.1", "react-native": "0.74.0", "react-native-animated-nav-tab-bar": "^3.1.10",

import { AnimatedTabBarNavigator } from 'react-native-animated-nav-tab-bar'

const Tab = AnimatedTabBarNavigator() const TabBar = () => { const { order_count: orderCount } = useSelector((state) => state.order)

return (
	<Tab.Navigator
		detachInactiveScreens={true}
		initialRouteName={Routes.HOME}
		backBehavior='initialRoute'
		appearance={{
			tabBarBackground: '#ffffff',
			activeColors: '#ffffff',
			activeTabBackgrounds: Colors.primaryColorDark,
			dotSize: 'large',
		}}
		screenOptions={({ route }) => ({
			headerShown: false,
			tabBarIcon: ({ focused, color = '#000', size }) => {
				let iconName
				let iconSize
				if (route.name === Routes.HOME) {
					iconName = focused ? 'view-dashboard' : 'view-dashboard-outline'
					return <Icons.MaterialCommunityIcons name={iconName} size={23} color={color} />
				} else if (route.name === Routes.POS) {
					iconSize = focused ? 23 : 23
					const iconNew = focused ? <Icons.MaterialIcons name={'shopping-cart'} size={iconSize} color={color} /> : <Icons.MaterialCommunityIcons name={'cart-outline'} size={iconSize} color={color} />
					return iconNew
				} else if (route.name === Routes.ORDERS) {
					iconName = focused ? 'basket' : 'basket-outline'
					iconSize = focused ? 23 : 23
					return <TabBadgeIcon name={iconName} size={iconSize} badgeCount={orderCount} color={color} focused={focused} />
				} else if (route.name === Routes.CASHFLOW) {
					iconName = focused ? 'cash-fast' : 'cash'
					return <Icons.MaterialCommunityIcons name={iconName} size={23} color={color} />
				} else if (route.name === Routes.SETTINGS) {
					iconName = focused ? 'settings' : 'settings-outline'
					return <Icons.Ionicons name={iconName} size={23} color={color} />
				}
			},
			tabBarHideOnKeyboard: true,
			keyboardHidesTabBar: true,
		})}>
		<Tab.Screen name={Routes.HOME} component={Home} />
		<Tab.Screen name={Routes.POS} component={POS} />
		<Tab.Screen name={Routes.ORDERS} component={Orders} />
		<Tab.Screen name={Routes.CASHFLOW} component={CashFlow} />
		<Tab.Screen name={Routes.SETTINGS} component={Settings} />
	</Tab.Navigator>
)

}