import { StyleSheet, Text, View } from 'react-native';
import { handleLogout, SORT } from '../helpers'

const Menu = ({ session, setSession, setEdit, showError, saveNote, sort, setSort }) => {
  const changeSort = () => sort < SORT.length-1 ? setSort(sort+1) : setSort(0)

  return (
    <View style={styles.menu}>
      {
        saveNote
          ? (
            <>
              <Text
                style={styles.menuText}
                onPress={() => setEdit(null)}
              >
                Back
              </Text>
              <Text
                style={styles.menuText}
                onPress={saveNote}
              >
                Save
              </Text>
            </>
          ) : (
            <>
              <Text
                style={styles.menuText}
                onPress={() => setEdit({})}
              >
                New Note
              </Text>
              <Text
                style={styles.menuText}
                onPress={changeSort}
              >
                {SORT[sort]}
              </Text>
              <Text
                style={styles.menuText}
                onPress={() => handleLogout({ session, setSession, showError })}
              >
                {session.email}
              </Text>
            </>
          )
      }
    </View>
  )
}

const styles = StyleSheet.create({
  menu: {
    backgroundColor: '#333',
    height: 60,
    width: '100%',
    flexDirection: 'row',
    alignItems: 'flex-end',
    justifyContent: 'space-between',
    padding: 10,
  },
  menuText: {
    fontWeight: 'bold',
    paddingHorizontal: 15,
    color: 'white',
  },
});

export default Menu