Squashed the rest of the bugs

Enterprise-CMCS · Mar 15, 2024 · e866b79 · e866b79
1 parent ded0852
commit e866b79
Show file tree

Hide file tree

Showing 9 changed files with 32 additions and 34 deletions.
diff --git a/src/services/ui/src/features/submission/shared-components/SubTypeSelect.tsx b/src/services/ui/src/features/submission/shared-components/SubTypeSelect.tsx
@@ -1,29 +1,28 @@
 import { useEffect, useMemo } from "react";
 import { useGetSubTypes } from "@/api";
 import * as Inputs from "@/components/Inputs";
-import { FieldValues, Path, useFormContext } from "react-hook-form";
+import { useFormContext, useWatch } from "react-hook-form";
 import Select from "react-select";
 import { uniqBy } from "lodash";
 
-type SubTypeSelectFormFieldProps<TFieldValues extends FieldValues> = {
-  name: Path<TFieldValues>;
+type SubTypeSelectFormFieldProps = {
   authorityId: number;
 };
 type SelectOption = {
   value: number;
   label: string;
 };
 
-export function SubTypeSelect<TFieldValues extends FieldValues>({
-  name,
-  authorityId,
-}: SubTypeSelectFormFieldProps<TFieldValues>) {
-  const { control, setValue, watch } = useFormContext();
-  const currentValue = watch("typeIds", []);
-  const { data } = useGetSubTypes(authorityId, currentValue, {
-    enabled: currentValue.length > 0,
+export function SubTypeSelect({ authorityId }: SubTypeSelectFormFieldProps) {
+  const { control, setValue } = useFormContext();
+  const typeIds = useWatch({ name: "typeIds", defaultValue: [] });
+  const subTypeIds = useWatch({
+    name: "subTypeIds",
+    defaultValue: [],
   });
 
+  const { data } = useGetSubTypes(authorityId, typeIds);
+
   const options = useMemo(
     () =>
       uniqBy(data, "name").map((item) => ({
@@ -34,19 +33,23 @@ export function SubTypeSelect<TFieldValues extends FieldValues>({
   );
 
   useEffect(() => {
-    const validValues = currentValue?.filter((val: number) =>
+    const validValues = typeIds?.filter((val: number) =>
       options.find((option) => option.value === val),
     );
+
     if (validValues.length > 0) {
-      setValue(name, validValues, { shouldValidate: true });
+      setValue("subTypeIds", validValues, { shouldValidate: true });
+    }
+    if (typeIds.length === 0) {
+      setValue("subTypeIds", []);
     }
-  }, [data, currentValue, setValue]);
+  }, [options, typeIds, data]);
 
   return (
     <Inputs.FormField
       control={control}
-      name={name}
-      render={({ field }) => (
+      name={"subTypeIds"}
+      render={() => (
         <Inputs.FormItem className="max-w-lg">
           <Inputs.FormLabel className="font-semibold block">
             Subtype <Inputs.RequiredIndicator />
@@ -56,13 +59,18 @@ export function SubTypeSelect<TFieldValues extends FieldValues>({
           </p>
           <Select
             isMulti
-            isDisabled={!currentValue.length}
+            isDisabled={!typeIds.length}
             value={options.filter((option) =>
-              field.value?.includes(option.value),
+              subTypeIds?.includes(option.value),
             )}
-            onChange={(val) =>
-              field.onChange(val.map((v: SelectOption) => v.value))
-            }
+            onChange={(val) => {
+              if (val.length === 0) {
+                setValue("subTypeIds", [], { shouldValidate: true });
+                return;
+              }
+              const v = val.map((v: SelectOption) => v.value);
+              setValue("subTypeIds", v, { shouldValidate: true });
+            }}
             options={options}
             closeMenuOnSelect={false}
             className="border border-black shadow-sm rounded-sm"

diff --git a/src/services/ui/src/features/submission/spa/chip-intitial.tsx b/src/services/ui/src/features/submission/spa/chip-intitial.tsx
@@ -211,10 +211,7 @@ export const ChipSpaFormPage = () => {
               name="typeIds"
               authorityId={124} // chip authority
             />
-            <SubTypeSelect
-              name="subTypeIds"
-              authorityId={124} // chip authority
-            />
+            <SubTypeSelect authorityId={124} />
           </SectionCard>
           <SectionCard title="Attachments">
             <Content.AttachmentsSizeTypesDesc faqLink="/faq/chip-spa-attachments" />

diff --git a/src/services/ui/src/features/submission/spa/medicaid-initial.tsx b/src/services/ui/src/features/submission/spa/medicaid-initial.tsx
@@ -214,8 +214,7 @@ export const MedicaidSpaFormPage = () => {
               authorityId={125} // medicaid authority
             />
             <SubTypeSelect
-              name="subTypeIds"
-              authorityId={125} // medicaid authority
+              authorityId={125} 
             />
           </SectionCard>
           <SectionCard title="Attachments">

diff --git a/...ervices/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-amendment.tsx b/...ervices/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-amendment.tsx
@@ -256,8 +256,7 @@ export const Capitated1915BWaiverAmendmentPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
-              authorityId={122} // waivers authority
+              authorityId={122}
             />
           </SectionCard>
           <SectionCard title="Attachments">

diff --git a/src/services/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-initial.tsx b/src/services/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-initial.tsx
@@ -223,7 +223,6 @@ export const Capitated1915BWaiverInitialPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
               authorityId={122} // waivers authority
             />
           </SectionCard>

diff --git a/src/services/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-renewal.tsx b/src/services/ui/src/features/submission/waiver/capitated/capitated-1915-b-waiver-renewal.tsx
@@ -283,7 +283,6 @@ export const Capitated1915BWaiverRenewalPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
               authorityId={122} // waivers authority
             />
           </SectionCard>

diff --git a/...ces/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-amendment.tsx b/...ces/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-amendment.tsx
@@ -250,7 +250,6 @@ export const Contracting1915BWaiverAmendmentPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
               authorityId={122} // waivers authority
             />
           </SectionCard>

diff --git a/...vices/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-initial.tsx b/...vices/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-initial.tsx
@@ -218,7 +218,6 @@ export const Contracting1915BWaiverInitialPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
               authorityId={122} // waivers authority
             />
           </SectionCard>

diff --git a/...vices/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-renewal.tsx b/...vices/ui/src/features/submission/waiver/contracting/contracting-1915-b-waiver-renewal.tsx
@@ -276,7 +276,6 @@ export const Contracting1915BWaiverRenewalPage = () => {
               authorityId={122}
             />
             <SubTypeSelect
-              name="subTypeIds"
               authorityId={122} // waivers authority
             />
           </SectionCard>