import '../../global.css';
import HeaderDefault from '@/components/header/default';
import { Tabs } from 'expo-router';
import React from 'react';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { UINotificationToast } from '@/components/ui/notification/Toast';
import { View } from 'react-native';

export default function ContextLayout() {

  return (
    <SafeAreaProvider>
      <View
        style={{ flex: 1, backgroundColor: '#FF0000' /* Red background */ }}
      >
        <Tabs
          screenOptions={{
            header: ({ route }) => <HeaderDefault alignLeft={true} />,
            tabBarStyle: {
              backgroundColor: '#FBFFFE',
            },
          }}
        >
          <Tabs.Screen 
            name='dashboard' 
            options={{
              sceneStyle: {
                backgroundColor: 'red', // This what you want
              },
            }}
          />
        </Tabs>
      </View>
      <UINotificationToast />
    </SafeAreaProvider>
  );
}