import ChantierSummary from '@/components/chantierSummary';
import SelectChantier from '@/components/selectChantier';
import SetStatus from '@/components/setStatus';
import { ThemedView, } from '@/components/themed-view';
import Constants from 'expo-constants'; //pour connaître la taille de la barre menu de l'OS en haut
import React from 'react';
import { StyleSheet, View } from 'react-native';
import { useChantier } from '../ContextChantier';
import { useUser } from '../ContextUser';



export default function Home() {
  const { chantier, setChantier } = useChantier();
  const { role } = useUser();

  console.log("User", role);
  
  return(
    <ThemedView lvl={3} style={styles.back}>
      <View style={styles.container}>

        {role === "chef" && <SetStatus />}
        {role === "resp" && <SelectChantier />}
        {role === "ouvrier" && (
          <ChantierSummary style={styles.summary} data={{ chantier }} />
        )}

      </View>
    </ThemedView>
  )
}

const styles = StyleSheet.create({
  back:{
    height:"100%",
    width:"100%",
  },
  container: {
    flex: 1,
    marginTop: Constants.statusBarHeight, //pour la barre menu du haut
  },
  header: {
    flex: 1,
    width:"100%"
  },
  summary:{
    marginTop:60,
    padding:10,
  }
});