import React from "react"; import Image from "next/image"; import { useRouter } from "next/router"; import useSWR from "swr"; // services import projectService from "services/project.service"; // ui import { Avatar, CustomSearchSelect } from "components/ui"; // icons import { UserCircleIcon, UserIcon } from "@heroicons/react/24/outline"; import User from "public/user.png"; // fetch-keys import { PROJECT_MEMBERS } from "constants/fetch-keys"; type Props = { value: string | null | undefined; onChange: (val: string) => void; }; export const SidebarLeadSelect: React.FC = ({ value, onChange }) => { const router = useRouter(); const { workspaceSlug, projectId } = router.query; const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId ? () => projectService.projectMembers(workspaceSlug as string, projectId as string) : null ); const options = members?.map((member) => ({ value: member.member.id, query: (member.member.first_name && member.member.first_name !== "" ? member.member.first_name : member.member.email) + " " + member.member.last_name ?? "", content: (
{member.member.first_name && member.member.first_name !== "" ? member.member.first_name : member.member.email}
), })) ?? []; const selectedOption = members?.find((m) => m.member.id === value)?.member; return (
Lead
{selectedOption ? ( ) : (
No user
)} {selectedOption ? selectedOption?.first_name && selectedOption.first_name !== "" ? selectedOption?.first_name : selectedOption?.email : "N/A"}
} options={options} onChange={onChange} />
); };