Как перейти с экрана вкладок на экран стека в React Native

Я новичок в разработке мобильных приложений. Я запустил приложение с помощью команды — npx create-expo-app@latest myapp. Это создало такую ​​структуру папок:

Я думаю, что скобки в имени папки вкладок необходимы для соглашения. В основном _layout.tsx это содержимое –

<ThemeProvider value = {colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
      <Stack>
        <Stack.Screen name = "(tabs1)" options = {{ headerShown: false }} />
        <Stack.Screen name = "Eligibility" />
      </Stack>
    </ThemeProvider>

А во внутреннем файле _layout.tsx есть вкладки типа -

<Tabs screenOptions = {{headerShown: true}}>
        <Tabs.Screen name = "index" options = {{
          headerTitle: "MyApp",
          title: "Home",
          tabBarIcon: ({ color, focused }) => (
            <TabBarIcon name = {focused ? 'home' : 'home-outline'} color = {color} />
          ),
        }} />
      </Tabs>

КОГДА я запускаю приложение, в нижнем колонтитуле есть одна вкладка с именем «Домой» и содержимое, которое присутствует в файле index.tsx. Я хочу перейти к файлу «Право на участие», который находится за пределами папки вкладок. Я попробовал использовать этот внутренний файл index.tsx

const navigation = useNavigation();
navigation.navigate('Eligibility)

и изменил внешний _layout.tsx следующим образом:

<ThemeProvider value = {colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
        <NavigationContainer>
            <Stack.Navigator>
                <Stack.Screen name = "RootLayout1" options = {{ headerShown: false }} component = {RootLayout1} />
                <Stack.Screen name = "Eligibility" component = {Eligibility} />
            </Stack.Navigator>
        </NavigationContainer>
    </ThemeProvider>

RootLayout1 — это внутренний файл _layout.tsx со следующим содержимым:

export default function RootLayout1() {
  return (
      <Tabs screenOptions = {{headerShown: true}}>
        <Tabs.Screen name = "index" options = {{
          headerTitle: "Volt",
          title: "Home",
          tabBarIcon: ({ color, focused }) => (
            <TabBarIcon name = {focused ? 'home' : 'home-outline'} color = {color} />
          ),
        }} />
      </Tabs>
  );
}

но в моем методе Navigation.navigate выдавалась ошибка -

Argument of type '[string]' is not assignable to parameter of type 'never'.
  Overload 2 of 2, '(options: never): void', gave the following error.
    Argument of type 'string' is not assignable to parameter of type 'never'.

Что я делаю не так в этом?

Я также попробовал передать {navigation} в реквизитах компонента index.tsx, а затем выполнить Navigation.navigate('Eligibility), но получил ошибку - [TypeError: невозможно прочитать свойство 'navigate' из неопределенного]

Я хочу, чтобы в моем приложении было три вкладки: «Домой», «Профиль», «Scan&Pay». И на вкладке «Главная» я хочу, чтобы основные потоки были похожи на какую-то форму, а затем в случае успеха он должен отображать компонент «Право на участие» на той же вкладке «Главная». Кроме того, когда я снова нажимаю на этот компонент «Право на участие», форма должна снова открыться только на вкладке «Главная».

Есть ли способ справиться с моим вариантом использования?