[questions][ui] update default location, company

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, {
+import LocationTypeahead from '../typeahead/LocationTypeahead';
-  useLocationOptions,
-} from '../typeahead/LocationTypeahead';
 import RoleTypeahead from '../typeahead/RoleTypeahead';
 
 import type { Location } from '~/types/questions';

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,

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([
+  const { data: companyOptions } = useCompanyOptions('google');
-    'companies.list',
+  return companyOptions[0];
-    {
-      name: '',
-    },
-  ]);
-
-  const company = companies?.[0];
-  if (company === undefined) {
-    return company;
-  }
-  return {
-    id: company.id,
-    label: company.name,
-    value: company.id,
-  };
 }

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([
+  const { data: locationOptions } = useLocationOptions('singapore');
-    'locations.cities.list',
+  return locationOptions[0];
-    {
-      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,
-  };
 }

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,
+  };
+}