Fix search permission groups at staff member edit page (#1937)

* Fix undefined choices in multi autocomplete select field

* Replace optional chaining with empty array default prop
This commit is contained in:
Michał Droń 2022-03-25 13:46:43 +01:00 committed by GitHub
parent e186b2f8c3
commit d273706ef8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 6 deletions

View file

@ -241,7 +241,7 @@ const MultiAutocompleteSelectFieldComponent: React.FC<MultiAutocompleteSelectFie
} }
} }
} }
choices={choices.filter( choices={choices?.filter(
choice => !value.includes(choice.value) choice => !value.includes(choice.value)
)} )}
displayCustomValue={displayCustomValue} displayCustomValue={displayCustomValue}

View file

@ -164,7 +164,7 @@ function getChoiceIndex(
const MultiAutocompleteSelectFieldContent: React.FC<MultiAutocompleteSelectFieldContentProps> = props => { const MultiAutocompleteSelectFieldContent: React.FC<MultiAutocompleteSelectFieldContentProps> = props => {
const { const {
add, add,
choices, choices = [],
displayCustomValue, displayCustomValue,
displayValues, displayValues,
getItemProps, getItemProps,
@ -199,7 +199,7 @@ const MultiAutocompleteSelectFieldContent: React.FC<MultiAutocompleteSelectField
}, [loading]); }, [loading]);
const hasValuesToDisplay = const hasValuesToDisplay =
displayValues.length > 0 || displayCustomValue || choices.length > 0; displayValues?.length > 0 || displayCustomValue || choices.length > 0;
return ( return (
<Paper className={classes.root} elevation={8}> <Paper className={classes.root} elevation={8}>
{hasValuesToDisplay && ( {hasValuesToDisplay && (
@ -243,9 +243,9 @@ const MultiAutocompleteSelectFieldContent: React.FC<MultiAutocompleteSelectField
/> />
</MenuItem> </MenuItem>
)} )}
{(choices.length > 0 || displayValues.length > 0) && {(choices.length > 0 || displayValues?.length > 0) &&
displayCustomValue && <Hr className={classes.hr} />} displayCustomValue && <Hr className={classes.hr} />}
{displayValues.map(value => ( {displayValues?.map(value => (
<MenuItem <MenuItem
className={classes.menuItem} className={classes.menuItem}
key={value.value} key={value.value}
@ -266,7 +266,7 @@ const MultiAutocompleteSelectFieldContent: React.FC<MultiAutocompleteSelectField
<span className={classes.menuItemLabel}>{value.label}</span> <span className={classes.menuItemLabel}>{value.label}</span>
</MenuItem> </MenuItem>
))} ))}
{displayValues.length > 0 && choices.length > 0 && ( {displayValues?.length > 0 && choices.length > 0 && (
<Hr className={classes.hr} /> <Hr className={classes.hr} />
)} )}
{choices.map((suggestion, index) => { {choices.map((suggestion, index) => {