// components/LoadingBar.js

import React from 'react';
import { Box, Text } from 'ink';

export const LoadingBar = ({ percentage }) => {
  const width = 30;
  const filledWidth = Math.round((percentage / 100) * width);
  const emptyWidth = width - filledWidth;

  return (
    <Box>
      <Text color="green">[</Text>
      <Text color="green">{'='.repeat(filledWidth)}</Text>
      <Text>{' '.repeat(emptyWidth)}</Text>
      <Text color="green">]</Text>
      <Text> {percentage}%</Text>
    </Box>
  );
};