|
|
@ -6,10 +6,17 @@ import { trpc } from '~/utils/trpc';
|
|
|
|
|
|
|
|
|
|
|
|
type Props = Readonly<{
|
|
|
|
type Props = Readonly<{
|
|
|
|
disabled?: boolean;
|
|
|
|
disabled?: boolean;
|
|
|
|
|
|
|
|
isLabelHidden?: boolean;
|
|
|
|
onSelect: (option: TypeaheadOption) => void;
|
|
|
|
onSelect: (option: TypeaheadOption) => void;
|
|
|
|
|
|
|
|
placeHolder?: string;
|
|
|
|
}>;
|
|
|
|
}>;
|
|
|
|
|
|
|
|
|
|
|
|
export default function CompaniesTypeahead({ disabled, onSelect }: Props) {
|
|
|
|
export default function CompaniesTypeahead({
|
|
|
|
|
|
|
|
disabled,
|
|
|
|
|
|
|
|
onSelect,
|
|
|
|
|
|
|
|
isLabelHidden,
|
|
|
|
|
|
|
|
placeHolder,
|
|
|
|
|
|
|
|
}: Props) {
|
|
|
|
const [query, setQuery] = useState('');
|
|
|
|
const [query, setQuery] = useState('');
|
|
|
|
const companies = trpc.useQuery([
|
|
|
|
const companies = trpc.useQuery([
|
|
|
|
'companies.list',
|
|
|
|
'companies.list',
|
|
|
@ -23,6 +30,7 @@ export default function CompaniesTypeahead({ disabled, onSelect }: Props) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Typeahead
|
|
|
|
<Typeahead
|
|
|
|
disabled={disabled}
|
|
|
|
disabled={disabled}
|
|
|
|
|
|
|
|
isLabelHidden={isLabelHidden}
|
|
|
|
label="Company"
|
|
|
|
label="Company"
|
|
|
|
noResultsMessage="No companies found"
|
|
|
|
noResultsMessage="No companies found"
|
|
|
|
nullable={true}
|
|
|
|
nullable={true}
|
|
|
@ -33,6 +41,7 @@ export default function CompaniesTypeahead({ disabled, onSelect }: Props) {
|
|
|
|
value: id,
|
|
|
|
value: id,
|
|
|
|
})) ?? []
|
|
|
|
})) ?? []
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
placeholder={placeHolder}
|
|
|
|
onQueryChange={setQuery}
|
|
|
|
onQueryChange={setQuery}
|
|
|
|
onSelect={onSelect}
|
|
|
|
onSelect={onSelect}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|