Files
bodyshop/client/src/components/employee-team-search-select/employee-team-search-select.component.jsx

34 lines
859 B
JavaScript

import { useQuery } from "@apollo/client";
import { Select } from "antd";
import React, { forwardRef } from "react";
import { QUERY_TEAMS } from "../../graphql/employee_teams.queries";
import AlertComponent from "../alert/alert.component";
//To be used as a form element only.
const EmployeeTeamSearchSelect = ({ ...props }, ref) => {
const { loading, error, data } = useQuery(QUERY_TEAMS);
if (error) return <AlertComponent message={JSON.stringify(error)} />;
return (
<Select
showSearch
allowClear
loading={loading}
style={{
width: 400
}}
options={
data
? data.employee_teams.map((e) => ({
value: JSON.stringify(e),
label: e.name
}))
: []
}
{...props}
/>
);
};
export default forwardRef(EmployeeTeamSearchSelect);