import type { ReactNode } from 'react';
import { RefreshControl, ScrollView, View } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';

export const AppScreen = ({
  children,
  onRefresh,
  refreshing = false,
  scroll = true,
}: {
  children: ReactNode;
  onRefresh?: () => void;
  refreshing?: boolean;
  scroll?: boolean;
}) => {
  if (!scroll) {
    return (
      <SafeAreaView className='bg-background flex-1'>
        <View className='flex-1 p-4'>{children}</View>
      </SafeAreaView>
    );
  }

  return (
    <SafeAreaView className='bg-background flex-1'>
      <ScrollView
        className='flex-1'
        contentContainerClassName='gap-4 p-4 pb-10'
        keyboardShouldPersistTaps='handled'
        refreshControl={
          onRefresh ? (
            <RefreshControl onRefresh={onRefresh} refreshing={refreshing} />
          ) : undefined
        }
      >
        {children}
      </ScrollView>
    </SafeAreaView>
  );
};
