Merge pull request #6621 from TheThingsNetwork/fix/checkbox-group

Quickfix checkbox group not working properly
TheThingsNetwork · Oct 16, 2023 · 658b840 · 658b840
2 parents 1840a82 + a060160
commit 658b840
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 4 deletions.
diff --git a/pkg/webui/components/checkbox/checkbox.js b/pkg/webui/components/checkbox/checkbox.js
@@ -60,7 +60,7 @@ const Checkbox = props => {
     event => {
       const { checked } = event.target
 
-      if (hasValue && !context) {
+      if (!hasValue && !context) {
         setChecked(checked)
       }
 

diff --git a/pkg/webui/components/checkbox/group/index.js b/pkg/webui/components/checkbox/group/index.js
@@ -22,9 +22,25 @@ import style from './group.styl'
 export const CheckboxGroupContext = React.createContext()
 
 const CheckboxGroup = props => {
-  const { children, className, horizontal, onChange, disabled, onFocus, onBlur, ...rest } = props
-  const hasValue = 'value' in rest
-  const [value, setValue] = React.useState(hasValue ? rest.value : rest.initialValue || {})
+  const {
+    children,
+    className,
+    horizontal,
+    onChange,
+    disabled,
+    onFocus,
+    onBlur,
+    value: valueProp,
+    ...rest
+  } = props
+  const hasValue = Boolean(valueProp)
+  const [value, setValue] = React.useState(hasValue ? valueProp : rest.initialValue || {})
+
+  React.useEffect(() => {
+    if (valueProp) {
+      setValue(valueProp || {})
+    }
+  }, [valueProp])
 
   const handleCheckboxChange = useCallback(
     async event => {