Merge branch 'dev'

AAFC-BICoE · Apr 12, 2021 · 0b9145e · 0b9145e
2 parents 62604c9 + 9cc25bb
commit 0b9145e
Show file tree

Hide file tree

Showing 15 changed files with 284 additions and 166 deletions.
diff --git a/packages/common-ui/lib/formik-connected/CheckBoxField.tsx b/packages/common-ui/lib/formik-connected/CheckBoxField.tsx
@@ -1,17 +1,18 @@
 import { FastField, FieldProps } from "formik";
-import React from "react";
+import React, { ChangeEvent } from "react";
 import { FieldWrapper, LabelWrapperParams } from "./FieldWrapper";
+import { OnFormikSubmit } from "./safeSubmit";
 
 export interface CheckBoxProps extends LabelWrapperParams {
-  onCheckBoxClick?: (e) => void;
+  onCheckBoxClick?: OnFormikSubmit<ChangeEvent<HTMLInputElement>>;
   disabled?: boolean;
 }
 
 const checkboxProps = {
   style: {
     display: "block",
     height: "20px",
-    margin: "auto",
+    marginLeft: "15px",
     width: "20px"
   },
   type: "checkbox"
@@ -32,21 +33,18 @@ export function CheckBoxField(props: CheckBoxProps) {
       )}
     >
       <FastField name={name}>
-        {({
-          field: { value },
-          form: { setFieldValue, setFieldTouched }
-        }: FieldProps) => {
-          function onChange(event) {
-            setFieldValue(name, event.target.checked);
-            setFieldTouched(name);
-            onCheckBoxClick?.(event);
+        {({ field: { value }, form }: FieldProps) => {
+          function onChange(event, formik) {
+            formik.setFieldValue(name, event.target.checked);
+            formik.setFieldTouched(name);
+            onCheckBoxClick?.(event, formik);
           }
 
           return (
             <input
               {...checkboxProps}
               checked={value || false}
-              onChange={onChange}
+              onChange={event => onChange(event, form)}
               value={value || false}
               disabled={disabled}
             />

diff --git a/packages/common-ui/lib/formik-connected/ResourceSelectField.tsx b/packages/common-ui/lib/formik-connected/ResourceSelectField.tsx
@@ -13,6 +13,7 @@ export interface ResourceSelectFieldProps<TData extends KitsuResource>
   onChange?: (
     value?: PersistedResource<TData> | PersistedResource<TData>[]
   ) => void;
+  isDisabled?: boolean;
 }
 
 /** Formik-connected Dropdown select input for selecting a resource from the API. */

diff --git a/packages/common-ui/lib/resource-select/ResourceSelect.tsx b/packages/common-ui/lib/resource-select/ResourceSelect.tsx
@@ -47,6 +47,8 @@ export interface ResourceSelectProps<TData extends KitsuResource> {
 
   /** Special dropdown options that can fetch an async value e.g. by creating a resource in a modal. */
   asyncOptions?: AsyncOption<TData>[];
+
+  isDisabled?: boolean;
 }
 
 /**
@@ -78,7 +80,8 @@ export function ResourceSelect<TData extends KitsuResource>({
   sort,
   styles,
   value,
-  asyncOptions
+  asyncOptions,
+  isDisabled
 }: ResourceSelectProps<TData>) {
   const { apiClient } = useContext(ApiClientContext);
   const { formatMessage } = useIntl();
@@ -209,6 +212,7 @@ export function ResourceSelect<TData extends KitsuResource>({
         MultiValue: SortableMultiValue
       }}
       distance={4}
+      isDisabled={isDisabled}
     />
   );
 }