如何将图标添加到顶部选项卡导航的右侧

Question

如何在我的 Top-tab Navigator 中添加这两个图标我已经尝试过但我不熟悉正确的道具

这里是更好理解的代码：

const MyTopTabs = () => {
  return (
    <Tab.Navigator
      initialRouteName="Community"
      screenOptions={{
        tabBarIndicatorStyle: {
          backgroundColor: "#D8315B",
          height: 5,
        },
        tabBarLabelStyle: {
          fontSize: 14,
          fontWeight: "bold",
        },
      }}
    >
      <Tab.Screen name="Latest" component={CommunityScreen} />
      <Tab.Screen name="Favourites" component={FavouritesScreen} />
    </Tab.Navigator>
  );
};

const Community = (props) => {
  return <MyTopTabs />;
};
export const screenOptions = (navData) => {
  return {
    headerTitle: "Community",
    headerShown: true,
    headerRight: () => (
      <View style={{ flexDirection: "row" }}>
        <MaterialIcons name="search" size={28} color="black" />
        <MaterialIcons name="filter" size={28} color="black" />
      </View>
    ),
  };
};