algorithm/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2025-07-29 21:23:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ui][companies typeahead] Add isLabelHidden and placeHolder props (#361)

Browse Source 
* [ui][companies typeahead] add isLabelHidden and placeHolder props

* [ui][companies typeahead] add isLabelHidden and placeHolder props
This commit is contained in:
Ai Ling
2022-10-11 19:53:21 +08:00
committed by GitHub
parent 73e1f76570
commit 325a2d1f7c
2 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/portal/src/components/shared/CompaniesTypeahead.tsx
View File

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

3
packages/ui/src/Typeahead/Typeahead.tsx
View File

@ -22,6 +22,7 @@ type Props = Readonly<{
) => void;
onSelect: (option: TypeaheadOption) => void;
options: ReadonlyArray<TypeaheadOption>;
placeholder?: string;
value?: TypeaheadOption;
}>;
@ -35,6 +36,7 @@ export default function Typeahead({
onQueryChange,
value,
onSelect,
placeholder,
}: Props) {
const [query, setQuery] = useState('');
return (
@ -77,6 +79,7 @@ export default function Typeahead({
displayValue={(option) =>
(option as unknown as TypeaheadOption)?.label
}
placeholder={placeholder}
onChange={(event) => {
setQuery(event.target.value);
onQueryChange(event.target.value, event);