From 6746f5479204c84f29988d824c2c0a3a2fa21284 Mon Sep 17 00:00:00 2001
From: Yangshun Tay <tay.yang.shun@gmail.com>
Date: Sun, 30 Oct 2022 10:07:38 +0800
Subject: [PATCH] [portal][ui] allow value to be specified for comapnies and
job titles typeahead
---
apps/portal/src/components/shared/CompaniesTypeahead.tsx | 3 +++
apps/portal/src/components/shared/JobTitlesTypahead.tsx | 3 +++
packages/ui/src/Typeahead/Typeahead.tsx | 6 ++++--
3 files changed, 10 insertions(+), 2 deletions(-)
diff --git a/apps/portal/src/components/shared/CompaniesTypeahead.tsx b/apps/portal/src/components/shared/CompaniesTypeahead.tsx
index cd54f4e5..619d9a55 100644
--- a/apps/portal/src/components/shared/CompaniesTypeahead.tsx
+++ b/apps/portal/src/components/shared/CompaniesTypeahead.tsx
@@ -11,6 +11,7 @@ type Props = Readonly<{
onSelect: (option: TypeaheadOption | null) => void;
placeholder?: string;
required?: boolean;
+ value?: TypeaheadOption | null;
}>;
export default function CompaniesTypeahead({
@@ -19,6 +20,7 @@ export default function CompaniesTypeahead({
isLabelHidden,
placeholder,
required,
+ value,
}: Props) {
const [query, setQuery] = useState('');
const companies = trpc.useQuery([
@@ -47,6 +49,7 @@ export default function CompaniesTypeahead({
placeholder={placeholder}
required={required}
textSize="inherit"
+ value={value}
onQueryChange={setQuery}
onSelect={onSelect}
/>
diff --git a/apps/portal/src/components/shared/JobTitlesTypahead.tsx b/apps/portal/src/components/shared/JobTitlesTypahead.tsx
index d266deb4..b5221262 100644
--- a/apps/portal/src/components/shared/JobTitlesTypahead.tsx
+++ b/apps/portal/src/components/shared/JobTitlesTypahead.tsx
@@ -10,6 +10,7 @@ type Props = Readonly<{
onSelect: (option: TypeaheadOption | null) => void;
placeholder?: string;
required?: boolean;
+ value?: TypeaheadOption | null;
}>;
export default function JobTitlesTypeahead({
@@ -18,6 +19,7 @@ export default function JobTitlesTypeahead({
isLabelHidden,
placeholder,
required,
+ value,
}: Props) {
const [query, setQuery] = useState('');
const options = Object.entries(JobTitleLabels)
@@ -42,6 +44,7 @@ export default function JobTitlesTypeahead({
placeholder={placeholder}
required={required}
textSize="inherit"
+ value={value}
onQueryChange={setQuery}
onSelect={onSelect}
/>
diff --git a/packages/ui/src/Typeahead/Typeahead.tsx b/packages/ui/src/Typeahead/Typeahead.tsx
index bf16f07c..bce6fb32 100644
--- a/packages/ui/src/Typeahead/Typeahead.tsx
+++ b/packages/ui/src/Typeahead/Typeahead.tsx
@@ -37,7 +37,7 @@ type Props = Readonly<{
onSelect: (option: TypeaheadOption | null) => void;
options: ReadonlyArray<TypeaheadOption>;
textSize?: TypeaheadTextSize;
- value?: TypeaheadOption;
+ value?: TypeaheadOption | null;
}> &
Readonly<Attributes>;
@@ -90,6 +90,8 @@ export default function Typeahead({
return (
<div>
<Combobox
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-ignore
by="id"
disabled={disabled}
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -104,7 +106,7 @@ export default function Typeahead({
onChange={(newValue) => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
- onSelect(newValue as TypeaheadOption);
+ onSelect(newValue as TypeaheadOption | null);
}}>
<Combobox.Label
className={clsx(