import React from "react";
import { FaRegUser } from "react-icons/fa";

interface Props {
    name: string;
    profileImage: string;
}

export default function RequestedBy({ name, profileImage }: Props) {
    return (
        <div className="flex items-center space-x-3">
            <div className="flex items-center justify-center w-12 h-12 bg-gray-100 rounded-lg border border-gray-300">
                <FaRegUser className="text-mti-purple-dark size-5"/>
            </div>
            <div>
                <p className="text-sm font-medium text-gray-800">Requested by</p>
                <div className="flex items-center space-x-2">
                    <p className="text-xs font-medium text-gray-800">{name}</p>
                    <img
                        src={profileImage}
                        alt={name}
                        className="w-6 h-6 rounded-full"
                    />
                </div>
            </div>
        </div>
    );
};