import { useRouter } from "next/router"; import useSWR from "swr"; // services import projectServices from "services/project.service"; // ui import { AssigneesList, Avatar, CustomSearchSelect } from "components/ui"; // icons import { UserGroupIcon } from "@heroicons/react/24/outline"; // fetch-keys import { PROJECT_MEMBERS } from "constants/fetch-keys"; export type Props = { projectId: string; value: string[]; onChange: (value: string[]) => void; }; export const IssueAssigneeSelect: React.FC = ({ projectId, value = [], onChange }) => { const router = useRouter(); const { workspaceSlug } = router.query; // fetching project members const { data: members } = useSWR( workspaceSlug && projectId ? PROJECT_MEMBERS(projectId as string) : null, workspaceSlug && projectId ? () => projectServices.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 } ${member.member.last_name ?? ""}`}
), })); return ( {value && value.length > 0 && Array.isArray(value) ? (
) : (
Assignee
)} } multiple noChevron /> ); };