refactor(mobile): simplify TabBarRootWrapper props and update type definitions

apps/mobile/src/lib/navigation/bottom-tab/native.android.tsx

@@ -1,13 +1,10 @@
 import { requireNativeView } from "expo"
-import type { NativeSyntheticEvent, ViewProps } from "react-native"
+import type { ViewProps } from "react-native"
+
+import type { TabBarRootWrapperProps } from "./types"
 
 export const TabBarPortalWrapper = requireNativeView<ViewProps>("TabBarPortal")
 
 export const TabScreenWrapper = requireNativeView<ViewProps>("TabScreen")
 
-export const TabBarRootWrapper = requireNativeView<
-  {
-    onTabIndexChange: (e: NativeSyntheticEvent<{ index: number }>) => void
-    selectedIndex: number
-  } & ViewProps
->("TabBarRoot")
+export const TabBarRootWrapper = requireNativeView<TabBarRootWrapperProps>("TabBarRoot")

apps/mobile/src/lib/navigation/bottom-tab/native.ios.tsx

@@ -1,13 +1,10 @@
 import { requireNativeView } from "expo"
-import type { NativeSyntheticEvent, ViewProps } from "react-native"
+import type { ViewProps } from "react-native"
+
+import type { TabBarRootWrapperProps } from "./types"
 
 export const TabBarPortalWrapper = requireNativeView<ViewProps>("TabBarPortal")
 
 export const TabScreenWrapper = requireNativeView<ViewProps>("TabScreen")
 
-export const TabBarRootWrapper = requireNativeView<
-  {
-    onTabIndexChange: (e: NativeSyntheticEvent<{ index: number }>) => void
-    selectedIndex: number
-  } & ViewProps
->("TabBarRoot")
+export const TabBarRootWrapper = requireNativeView<TabBarRootWrapperProps>("TabBarRoot")

apps/mobile/src/lib/navigation/bottom-tab/native.tsx

@@ -1,14 +1,10 @@
-import type { NativeSyntheticEvent, ViewProps } from "react-native"
 import { View } from "react-native"
 
+import type { TabBarRootWrapperProps } from "./types"
+
 export { View as TabBarPortalWrapper } from "react-native"
 export { View as TabScreenWrapper } from "react-native"
 
-export const TabBarRootWrapper = (
-  props: {
-    onTabIndexChange: (e: NativeSyntheticEvent<{ index: number }>) => void
-    selectedIndex: number
-  } & ViewProps,
-) => {
+export const TabBarRootWrapper = (props: TabBarRootWrapperProps) => {
   return <View {...props} />
 }

apps/mobile/src/lib/navigation/bottom-tab/types.ts

@@ -1,4 +1,5 @@
 import type { FC } from "react"
+import type { NativeSyntheticEvent, ViewProps } from "react-native"
 
 export type TabbarIconProps = {
   focused: boolean
@@ -18,3 +19,8 @@ export interface TabScreenProps {
   lazy?: boolean
   identifier?: string
 }
+
+export type TabBarRootWrapperProps = {
+  onTabIndexChange: (e: NativeSyntheticEvent<{ index: number }>) => void
+  selectedIndex: number
+} & ViewProps