fix: add react-select default values

start-at-root · Sep 22, 2019 · 7dc255c · 7dc255c
1 parent 00959de
commit 7dc255c
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 1 deletion.
diff --git a/src/Form.tsx b/src/Form.tsx
@@ -68,6 +68,7 @@ export default ({
         elementConfig={elementConfig}
         valid={valid}
         formHooks={formHooks}
+        defaultValues={defaultValues}
       />
     );
   });

diff --git a/src/components/SingleSelect.tsx b/src/components/SingleSelect.tsx
@@ -17,7 +17,7 @@ interface Props extends DefaultInputProps {
 }
 
 /** Render a generic single select input */
-export default ({elementConfig, formHooks}: Props) => {
+export default ({defaultValues, elementConfig, formHooks}: Props) => {
   const {
     className,
     isMulti,
@@ -26,6 +26,7 @@ export default ({elementConfig, formHooks}: Props) => {
     placeholder,
     required,
   } = elementConfig;
+  const initialValue = defaultValues ? defaultValues[name] : undefined;
   const {formState, register, setValue} = formHooks;
   const {touched} = formState;
   const {t} = useTranslation();
@@ -64,6 +65,15 @@ export default ({elementConfig, formHooks}: Props) => {
     register({name, required});
   }, [name, register, required]);
 
+  /**
+   * React's use effect.
+   */
+  useEffect(() => {
+    if (initialValue) {
+      setReactSelectValue({selectedOption: [initialValue]});
+    }
+  }, [initialValue]);
+
   return (
     <FormGroup className="rbf-group">
       <Select

diff --git a/src/interfaces/FormConfig.ts b/src/interfaces/FormConfig.ts
@@ -62,6 +62,7 @@ export interface DefaultInputProps {
   formHooks: Hooks;
   elementConfig: FormConfig;
   valid?: {[key: string]: any};
+  defaultValues?: {[key: string]: any};
 }
 
 export interface FormHooks extends Omit<DefaultInputProps, 'elementConfig'> {