import React from 'react';
import { Box, Text } from 'ink';
import { useAuth } from '../../state/auth-context.js';

export function Header() {
  const { user } = useAuth();

  return (
    <Box
      borderStyle="double"
      borderColor="cyan"
      paddingX={2}
      justifyContent="space-between"
      width="100%"
    >
      <Text color="cyan" bold>
        Effigenix ERP
      </Text>
      {user && (
        <Text color="gray">
          »{' '}<Text color="white">{user.username}</Text>
        </Text>
      )}
    </Box>
  );
}
