fixed error when data not found (#2449)

* fixed error when data not found

fixes: #2447

* change to useMemo
This commit is contained in:
Erik Jan de Wit 2022-04-20 21:10:30 +02:00 committed by GitHub
parent 709a9987ad
commit 50ba699ab8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useMemo, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Controller, useFieldArray, useFormContext } from "react-hook-form"; import { Controller, useFieldArray, useFormContext } from "react-hook-form";
import { import {
@ -56,7 +56,6 @@ const ValueInput = ({
}: ValueInputProps) => { }: ValueInputProps) => {
const { t } = useTranslation("common"); const { t } = useTranslation("common");
const { control, register, getValues } = useFormContext(); const { control, register, getValues } = useFormContext();
const [isValueOpenArray, setIsValueOpenArray] = useState([false]); const [isValueOpenArray, setIsValueOpenArray] = useState([false]);
const toggleValueSelect = (rowIndex: number, open: boolean) => { const toggleValueSelect = (rowIndex: number, open: boolean) => {
@ -65,19 +64,23 @@ const ValueInput = ({
setIsValueOpenArray(arr); setIsValueOpenArray(arr);
}; };
let attributeValues: { key: string; name: string }[] | undefined = []; const attributeValues = useMemo(() => {
let values: AttributeType[] | undefined = [];
const scopeValues = resources?.find( if (selectableValues) {
(resource) => resource.name === getValues().resources[rowIndex]?.key values = defaultContextAttributes.find(
)?.scopes; (attr) => attr.key === getValues().context?.[rowIndex]?.key
)?.values;
}
if (selectableValues) { return values;
attributeValues = defaultContextAttributes.find( }, [getValues]);
(attr) => attr.key === getValues().context[rowIndex]?.key
)?.values;
}
const renderSelectOptionType = () => { const renderSelectOptionType = () => {
const scopeValues = resources?.find(
(resource) => resource.name === getValues().resources?.[rowIndex]?.key
)?.scopes;
if (attributeValues?.length && !resources) { if (attributeValues?.length && !resources) {
return attributeValues.map((attr) => ( return attributeValues.map((attr) => (
<SelectOption key={attr.key} value={attr.key}> <SelectOption key={attr.key} value={attr.key}>
@ -165,7 +168,7 @@ export const KeyBasedAttributeInput = ({
useEffect(() => { useEffect(() => {
if (!fields.length) { if (!fields.length) {
append({ key: "", value: "" }); append({ key: "", value: "" }, false);
} }
}, [fields]); }, [fields]);