diff --git a/client/src/ConfigureImageClassification/ConfigureImageClassification.test.js b/client/src/ConfigureImageClassification/ConfigureImageClassification.test.js index 8159296..cf9bb14 100644 --- a/client/src/ConfigureImageClassification/ConfigureImageClassification.test.js +++ b/client/src/ConfigureImageClassification/ConfigureImageClassification.test.js @@ -81,7 +81,6 @@ describe('ConfigureImageClassification', () => { expect(screen.getByText('Multiple Region Labels')).toBeInTheDocument(); expect(screen.getByText('Region Types Allowed')).toBeInTheDocument(); expect(screen.getByText('Labels')).toBeInTheDocument(); - expect(screen.getByText('Regions')).toBeInTheDocument(); // Assert checkboxes are rendered const multipleRegionsCheckbox = screen.getByTestId('checkbox-multipleRegions'); diff --git a/client/src/ConfigureImageClassification/index.jsx b/client/src/ConfigureImageClassification/index.jsx index bc20d78..207f7ea 100644 --- a/client/src/ConfigureImageClassification/index.jsx +++ b/client/src/ConfigureImageClassification/index.jsx @@ -1,7 +1,7 @@ // @flow import React, { useMemo } from "react" import Survey from "material-survey/components/Survey" -import { setIn } from "seamless-immutable" +import { setIn, asMutable } from "seamless-immutable" import { CssBaseline, GlobalStyles } from "@mui/material"; import { useTranslation } from "react-i18next" @@ -21,12 +21,12 @@ export default ({ config, onChange }) => { type: "boolean", }, { - name: "regionTypesAllowed", - title: t("configuration.region_types_allowed"), - description: t("configuration.region_types_allowed.description"), - type: "checkbox", - choices: ["bounding-box", "polygon", "circle"], - }, + name: "regionTypesAllowed", + title: t("configuration.region_types_allowed"), + description: t("configuration.region_types_allowed.description"), + type: "multiple-dropdown", + choices: ["bounding-box", "polygon", "circle"], + }, { name: "labels", title: t("configuration.labels"), @@ -40,23 +40,12 @@ export default ({ config, onChange }) => { title: t("configuration.labels.option.id"), }, ], - }, - { - name: "regions", - title: t("configuration.regions"), - description: t("configuration.regions.description"), - type: "dropdown", - choices: [ - "Polygon", - "Bounding Box", - "Point", - ], } ], } const defaultAnswers = useMemo( - () => ({ + () => asMutable({ multipleRegions: config.multipleRegions ?? false, multipleRegionLabels: config.multipleRegionLabels ?? false, regionTypesAllowed: config.regionTypesAllowed ? config.regionTypesAllowed : [], @@ -64,8 +53,9 @@ export default ({ config, onChange }) => { (config.labels || []).map((a) => { return typeof a === "string" ? { id: a, description: a } : a }) || [], - regions: config.regions ?? "Polygon" - }), + }, + {deep: true} + ), [config.labels, config.multipleRegions] ) return ( @@ -97,16 +87,16 @@ export default ({ config, onChange }) => { variant="flat" defaultAnswers={defaultAnswers} onQuestionChange={(questionId, newValue) => { - if(questionId !=="regionTypesAllowed" && questionId !=="multipleRegions" && questionId !=="multipleRegionLabels"){ - let arrayId = [] - if (Array.isArray(newValue)){ - newValue = newValue.filter((json) => { - if (arrayId.includes(json.id)) return false - arrayId.push(json.id) - return true - }) - onChange(setIn(config, [questionId], newValue)) - } + if(questionId !=="regionTypesAllowed" && questionId !=="multipleRegions" && questionId !=="multipleRegionLabels"){ + let arrayId = [] + if (Array.isArray(newValue)){ + newValue = newValue.filter((json) => { + if (arrayId.includes(json.id)) return false + arrayId.push(json.id) + return true + }) + onChange(setIn(config, [questionId], newValue)) + } }else { onChange(setIn(config, [questionId], newValue)) } diff --git a/client/src/SetupPage/index.jsx b/client/src/SetupPage/index.jsx index c432db5..9134e2f 100644 --- a/client/src/SetupPage/index.jsx +++ b/client/src/SetupPage/index.jsx @@ -95,14 +95,17 @@ export const SetupPage = ({setConfiguration, settings, setShowLabel, showAnnotat settings.taskChoice = newTaskInfo.taskChoice; settingsConfig.changeSetting('settings',settings); } + + useEffect(() => { + setTab("datatype"); + }, []); useEffect(() => { const { labels } = configuration if (labels.length > 0) { setHasConfig(true) } - setTab("datatype"); - }, []); + }, [currentTab]); const showLab = ()=> { const hasLabels = configuration.labels.length > 0;