From ad6d2f27e26febfb6a896ee4f72b5aafca8baf79 Mon Sep 17 00:00:00 2001
From: Jeff Sieu <jeffsy00@gmail.com>
Date: Tue, 8 Nov 2022 21:30:15 +0800
Subject: [PATCH] [questions][ui] update default location, company

---
 .../forms/CreateQuestionEncounterForm.tsx     |  5 ++-
 .../questions/typeahead/LocationTypeahead.tsx | 31 ++-----------------
 .../src/utils/questions/useDefaultCompany.ts  | 20 ++----------
 .../src/utils/questions/useDefaultLocation.ts | 25 ++-------------
 .../src/utils/questions/useLocationOptions.ts | 30 ++++++++++++++++++
 5 files changed, 40 insertions(+), 71 deletions(-)
 create mode 100644 apps/portal/src/utils/questions/useLocationOptions.ts

diff --git a/apps/portal/src/components/questions/forms/CreateQuestionEncounterForm.tsx b/apps/portal/src/components/questions/forms/CreateQuestionEncounterForm.tsx
index 7519f06c..55e589a8 100644
--- a/apps/portal/src/components/questions/forms/CreateQuestionEncounterForm.tsx
+++ b/apps/portal/src/components/questions/forms/CreateQuestionEncounterForm.tsx
@@ -6,13 +6,12 @@ import { Button } from '@tih/ui';
 import type { Month } from '~/components/shared/MonthYearPicker';
 import MonthYearPicker from '~/components/shared/MonthYearPicker';
 
+import useLocationOptions from '~/utils/questions/useLocationOptions';
 import useCompanyOptions from '~/utils/shared/useCompanyOptions';
 import useJobTitleOptions from '~/utils/shared/useJobTitleOptions';
 
 import CompanyTypeahead from '../typeahead/CompanyTypeahead';
-import LocationTypeahead, {
-  useLocationOptions,
-} from '../typeahead/LocationTypeahead';
+import LocationTypeahead from '../typeahead/LocationTypeahead';
 import RoleTypeahead from '../typeahead/RoleTypeahead';
 
 import type { Location } from '~/types/questions';
diff --git a/apps/portal/src/components/questions/typeahead/LocationTypeahead.tsx b/apps/portal/src/components/questions/typeahead/LocationTypeahead.tsx
index 50f32037..a224b9a3 100644
--- a/apps/portal/src/components/questions/typeahead/LocationTypeahead.tsx
+++ b/apps/portal/src/components/questions/typeahead/LocationTypeahead.tsx
@@ -1,7 +1,7 @@
-import { useMemo, useState } from 'react';
+import { useState } from 'react';
 import type { TypeaheadOption } from '@tih/ui';
 
-import { trpc } from '~/utils/trpc';
+import useLocationOptions from '~/utils/questions/useLocationOptions';
 
 import type { ExpandedTypeaheadProps } from './ExpandedTypeahead';
 import ExpandedTypeahead from './ExpandedTypeahead';
@@ -16,33 +16,6 @@ export type LocationTypeaheadProps = Omit<
   onSuggestionClick?: (option: Location) => void;
 };
 
-export function useLocationOptions(query: string) {
-  const { data: locations, ...restQuery } = trpc.useQuery([
-    'locations.cities.list',
-    {
-      name: query,
-    },
-  ]);
-
-  const locationOptions = useMemo(() => {
-    return (
-      locations?.map(({ id, name, state }) => ({
-        cityId: id,
-        countryId: state.country.id,
-        id,
-        label: `${name}, ${state.name}, ${state.country.name}`,
-        stateId: state.id,
-        value: id,
-      })) ?? []
-    );
-  }, [locations]);
-
-  return {
-    data: locationOptions,
-    ...restQuery,
-  };
-}
-
 export default function LocationTypeahead({
   onSelect,
   onSuggestionClick,
diff --git a/apps/portal/src/utils/questions/useDefaultCompany.ts b/apps/portal/src/utils/questions/useDefaultCompany.ts
index b14367f1..5cb0a0e6 100644
--- a/apps/portal/src/utils/questions/useDefaultCompany.ts
+++ b/apps/portal/src/utils/questions/useDefaultCompany.ts
@@ -1,22 +1,8 @@
 import type { FilterChoice } from '~/components/questions/filter/FilterSection';
 
-import { trpc } from '../trpc';
+import useCompanyOptions from '../shared/useCompanyOptions';
 
 export default function useDefaultCompany(): FilterChoice | undefined {
-  const { data: companies } = trpc.useQuery([
-    'companies.list',
-    {
-      name: '',
-    },
-  ]);
-
-  const company = companies?.[0];
-  if (company === undefined) {
-    return company;
-  }
-  return {
-    id: company.id,
-    label: company.name,
-    value: company.id,
-  };
+  const { data: companyOptions } = useCompanyOptions('google');
+  return companyOptions[0];
 }
diff --git a/apps/portal/src/utils/questions/useDefaultLocation.ts b/apps/portal/src/utils/questions/useDefaultLocation.ts
index 6834410e..b6e40a1c 100644
--- a/apps/portal/src/utils/questions/useDefaultLocation.ts
+++ b/apps/portal/src/utils/questions/useDefaultLocation.ts
@@ -1,31 +1,12 @@
 import type { FilterChoice } from '~/components/questions/filter/FilterSection';
 
-import { trpc } from '../trpc';
+import useLocationOptions from './useLocationOptions';
 
 import type { Location } from '~/types/questions';
 
 export default function useDefaultLocation():
   | (FilterChoice & Location)
   | undefined {
-  const { data: locations } = trpc.useQuery([
-    'locations.cities.list',
-    {
-      name: 'singapore',
-    },
-  ]);
-
-  if (locations === undefined) {
-    return undefined;
-  }
-
-  const { id, name, state } = locations[0];
-
-  return {
-    cityId: id,
-    countryId: state.country.id,
-    id,
-    label: `${name}, ${state.name}, ${state.country.name}`,
-    stateId: state.id,
-    value: id,
-  };
+  const { data: locationOptions } = useLocationOptions('singapore');
+  return locationOptions[0];
 }
diff --git a/apps/portal/src/utils/questions/useLocationOptions.ts b/apps/portal/src/utils/questions/useLocationOptions.ts
new file mode 100644
index 00000000..32c62360
--- /dev/null
+++ b/apps/portal/src/utils/questions/useLocationOptions.ts
@@ -0,0 +1,30 @@
+import { useMemo } from 'react';
+
+import { trpc } from '../trpc';
+
+export default function useLocationOptions(query: string) {
+  const { data: locations, ...restQuery } = trpc.useQuery([
+    'locations.cities.list',
+    {
+      name: query,
+    },
+  ]);
+
+  const locationOptions = useMemo(() => {
+    return (
+      locations?.map(({ id, name, state }) => ({
+        cityId: id,
+        countryId: state.country.id,
+        id,
+        label: `${name}, ${state.name}, ${state.country.name}`,
+        stateId: state.id,
+        value: id,
+      })) ?? []
+    );
+  }, [locations]);
+
+  return {
+    data: locationOptions,
+    ...restQuery,
+  };
+}