How to use the react-native-paper.useTheme function in react-native-paper

export default function ExampleList({ navigation }: Props) {
  const renderItem = ({ item }: { item: Item }) => (
     navigation.navigate(item.id)}
    />
  );

  const keyExtractor = (item: { id: string }) => item.id;

  const { colors } = useTheme();
  const safeArea = useSafeArea();

  return (
    
  );
}

export default function AppbarExample({ navigation }: Props) {
  const { colors } = useTheme();

  const [showLeftIcon, setShowLeftIcon] = React.useState(true);
  const [showSubtitle, setShowSubtitle] = React.useState(true);
  const [showSearchIcon, setShowSearchIcon] = React.useState(true);
  const [showMoreIcon, setShowMoreIcon] = React.useState(true);
  const [showCustomColor, setShowCustomColor] = React.useState(false);
  const [showExactTheme, setShowExactTheme] = React.useState(false);

  navigation.setOptions({
    header: () => (