import React from 'react';
import { Badge, Link, Stack, Td, Tr } from '@chakra-ui/react';

import MasterActionsMenu from '../MasterActionsMenu';
import { getTimeSlot } from '../../lib/date-helpers';

export type MasterProps = {
  id: string;
  name: string;
  phone: string;
};

const MasterItem = ({ name, phone, id }) => {
  return (
    <Tr>
      <Td>{name}</Td>
      <Td>
        <Stack direction='row'>
          {/*{schedule.map(({ startWashTime, endWashTime }, index) => (*/}
          {/*  <Badge colorScheme={'green'} key={index}>*/}
          {/*    {getTimeSlot(startWashTime, endWashTime)}*/}
          {/*  </Badge>*/}
          {/*))}*/}
        </Stack>
      </Td>
      <Td>
        <Link href='tel:'>{phone}</Link>
      </Td>
      <Td>
        <MasterActionsMenu id={id} />
      </Td>
    </Tr>
  );
};

export default MasterItem;