Untitled

/* eslint-disable @typescript-eslint/no-unused-vars */
/* eslint-disable react-native/no-inline-styles */
import React from 'react';
import { TouchableOpacity } from 'react-native';
import { View, Text, Colors } from 'react-native-ui-lib';
import Icon from 'react-native-vector-icons/FontAwesome';

type Props = {
  report: any;
  company?: any;
};

const YourEmployee = ({ report }: Props) => {
  const employees = [
    { placeholder: 'John@reportback.ca' },
    { placeholder: 'Naci@eteration.com' },
    { placeholder: 'Allan@2115hope.com' },
  ];
  console.log(employees, 'lksdm');
  const handleEdit = (index: number) => {
    console.log(`Edit competitor at index ${index}`);
  };

  const renderCompetitorList = () => {
    if (!employees) {
      return <Text>No competitors found.</Text>;
    }

    return (
      <View>
        {employees.map((employee, index) => (
          <View
            padding-10
            margin-5
            key={index}
            row
            style={{
              borderBottomWidth: 1,
              borderColor: 'gray',
              justifyContent: 'space-between',
              alignItems: 'center',
              paddingVertical: 20,
            }}>
            <Text text70BO>{employee.placeholder}</Text>
            <TouchableOpacity onPress={() => handleEdit(index)}>
              <View
                center
                style={{
                  width: 40,
                  height: 40,
                  borderRadius: 20,
                  justifyContent: 'center',
                  alignItems: 'center',
                }}>
                <Icon name="pencil" size={25} color="grey" />
              </View>
            </TouchableOpacity>
          </View>
        ))}
        <View center margin-20>
          <TouchableOpacity>
            <View
              center
              style={{
                marginLeft: 320,
                width: 35,
                height: 35,
                borderRadius: 30,
                backgroundColor: Colors.orange40,
                justifyContent: 'center',
                alignItems: 'center',
              }}>
              <Icon name="plus" style={{justifyContent:'center',alignItems:'center'}} size={26} color="white" />
            </View>
          </TouchableOpacity>
          <Text style={{ color: Colors.grey30 }} text60BO center marginT-20>
            These people will have access to your reports
          </Text>
        </View>
      </View>
    );
  };

  return <View>{renderCompetitorList()}</View>;
};

export default YourEmployee;