import { LinearGradient } from 'expo-linear-gradient';
import type { ViewProps } from 'react-native';

import { useColorScheme } from '@/hooks/use-color-scheme';

const GRADIENTS = {
  light: ['#FFFFFF', '#FDECEE', '#FAD8DB'] as const,
  dark: ['#050505', '#1A0709', '#000000'] as const,
};

export function ScreenBackground({ style, children, ...rest }: ViewProps) {
  const scheme = useColorScheme() === 'dark' ? 'dark' : 'light';

  return (
    <LinearGradient colors={GRADIENTS[scheme]} style={[{ flex: 1 }, style]} {...rest}>
      {children}
    </LinearGradient>
  );
}