Theme (creating the custom colored theme for the app), ResourceListingScreen (where the failure is) and Provider (where the theme and paper providers are being used)

Provider.tsx

import {Provider as PaperProvider} from 'react-native-paper';
import {type FC, type ReactNode} from 'react';
import {ThemeProvider} from '@react-navigation/native';
import {Provider as StoreProvider} from 'react-redux';
import {getAppTheme} from './Theme';
import {store} from './Store';

const appTheme = getAppTheme();

type Props = {
  children: ReactNode;
  onAuthFinish?: () => void;
};

export const AppProvider: FC<Props> = ({children, onAuthFinish}) => (
  <StoreProvider store={store}>
    <PaperProvider theme={appTheme.light.app}>
      <ThemeProvider value={appTheme.light.navigation}>
        {children}
      </ThemeProvider>
    </PaperProvider>
  </StoreProvider>
);

ResourceListingScreen.tsx

import {type ReactNode} from 'react';
import {View} from 'react-native';
import {Searchbar} from 'react-native-paper';

type Props<R, L> = {
  // ...
};

type GroupedResources<R> = Record<string, R[]> | {items: R[]};

export const ResourceListingScreen = <R extends UnknownRecord, L extends UnknownRecord>(props: Props<R, L>): ReactNode => {
  // logic here...

  return (
    <View style={styles.container}>
      {searchable && <Searchbar
        placeholder={`Buscar ${label}...`}
        onChangeText={onChangeSearch}
        value={searchQuery}
      />}

    // rest of components here...
    </View>
  )
}

Theme.ts

import {MD3LightTheme, MD3DarkTheme, adaptNavigationTheme, configureFonts} from 'react-native-paper';
import {DarkTheme, DefaultTheme} from '@react-navigation/native';
import {type MD3Theme, type NavigationTheme} from 'react-native-paper/lib/typescript/types';

export type AppTheme = {
  navigation: NavigationTheme;
  app: MD3Theme;
};

type AppThemeColorSchemes = {light: AppTheme; dark: AppTheme};

export const getAppTheme = (): AppThemeColorSchemes => {
  const {LightTheme: lightNavigationTheme, DarkTheme: darkNavigationTheme} = adaptNavigationTheme({
    reactNavigationLight: DefaultTheme,
    reactNavigationDark: DarkTheme,
  });

  return {
    light: {
      navigation: lightNavigationTheme,
      app: {
        ...MD3LightTheme,
        roundness: 3,
        colors: {
          ...MD3LightTheme.colors,
          primary: '#009933',
          secondary: '#f1c40f',
          tertiary: '#a1b2c3',
        },
        fonts: configureFonts({
          config: {fontFamily: 'Inter-Regular'},
        }),
      },
    },
    dark: {
      navigation: darkNavigationTheme,
      app: {
        ...MD3DarkTheme,
        roundness: 3,
        colors: {
          ...MD3DarkTheme.colors,
          primary: '#009933',
          secondary: '#f1c40f',
          tertiary: '#a1b2c3',
        },
      },
    },
  };
};