From cb06edaaf409077b5abf7fed0b803984b6decf7e Mon Sep 17 00:00:00 2001 From: Ewe Zi Yi <36802364+deadlycoconuts@users.noreply.github.com> Date: Tue, 23 Jul 2024 14:55:15 +0800 Subject: [PATCH] fix(ui): Fix yup validation bug (#80) * Update yup validation schemas * Update mlp * Remove custom css styles for flyout --- ui/package.json | 2 +- .../experiments/components/form/validation/schema.js | 12 ++++++------ .../list/search/SearchExperimentsPanel.js | 4 +--- .../list/search/SearchExperimentsPanel.scss | 6 ------ ui/src/experiments/list/search/validation/schema.js | 2 +- ui/src/segments/components/form/validation/schema.js | 4 ++-- .../segmenters/components/form/validation/schema.js | 2 +- ui/yarn.lock | 8 ++++---- 8 files changed, 16 insertions(+), 24 deletions(-) delete mode 100644 ui/src/experiments/list/search/SearchExperimentsPanel.scss diff --git a/ui/package.json b/ui/package.json index 66fa192f..863fb39c 100644 --- a/ui/package.json +++ b/ui/package.json @@ -8,7 +8,7 @@ "//": "[@sentry/browser] pinned to 7.118.0 because craco/module federation has issues resolving this dependency; see", "//": "https://github.com/caraml-dev/turing/pull/384#discussion_r1666418144 for more details", "dependencies": { - "@caraml-dev/ui-lib": "^1.13.0-build.3-a234b6b", + "@caraml-dev/ui-lib": "^1.13.0-build.4-09c363a", "@elastic/datemath": "^5.0.3", "@elastic/eui": "88.2.0", "@emotion/css": "^11.11.2", diff --git a/ui/src/experiments/components/form/validation/schema.js b/ui/src/experiments/components/form/validation/schema.js index ca3c00ca..3d946836 100644 --- a/ui/src/experiments/components/form/validation/schema.js +++ b/ui/src/experiments/components/form/validation/schema.js @@ -138,10 +138,10 @@ const schema = [ .max(64, "Name should be between 4 and 64 characters") .matches(nameRegex, nameRegexDescription), type: yup - .mixed() + .string() .required("Experiment Type should be selected") .oneOf(experimentTypeValues, "Valid Experiment Type should be selected"), - interval: yup.mixed().when("type", (type, schema) => { + interval: yup.string().when("type", ([type], schema) => { return type === "Switchback" ? yup .number() @@ -151,11 +151,11 @@ const schema = [ : schema; }), tier: yup - .mixed() + .string() .required("Experiment Tier should be selected") .oneOf(experimentTierValues, "Valid Experiment Tier should be selected"), status: yup - .mixed() + .string() .required("Experiment Status should be selected") .oneOf( experimentStatusValues, @@ -165,7 +165,7 @@ const schema = [ end_time: yup .date() .required("End Time is required") - .when("start_time", (startTime, schema) => { + .when("start_time", ([startTime], schema) => { return startTime ? schema.min(startTime) : schema; }), }), @@ -176,7 +176,7 @@ const schema = [ treatments: yup .array() .of(treatmentSchema) - .when("type", (type, schema) => { + .when("type", ([type], schema) => { switch (type) { case "A/B": return schema diff --git a/ui/src/experiments/list/search/SearchExperimentsPanel.js b/ui/src/experiments/list/search/SearchExperimentsPanel.js index 1e8f33f3..6a5df70e 100644 --- a/ui/src/experiments/list/search/SearchExperimentsPanel.js +++ b/ui/src/experiments/list/search/SearchExperimentsPanel.js @@ -6,16 +6,14 @@ import { SegmenterContextProvider } from "providers/segmenter/context"; import SearchExperimentsFilters from "./SearchExperimentsFilters"; -import "./SearchExperimentsPanel.scss"; - const SearchExperimentsPanel = ({ onChange, onClose, projectId }) => { return ( { if (!!obj.start_time || !!obj.end_time) { return yup.object().shape({ start_time: yup.date().required("End time is set, Start time required"), - end_time: yup.mixed().when("start_time", (startTime, schema) => { + end_time: yup.mixed().when("start_time", ([startTime], schema) => { return !!startTime ? yup .date() diff --git a/ui/src/segments/components/form/validation/schema.js b/ui/src/segments/components/form/validation/schema.js index 5ce7ff2c..895e10ae 100644 --- a/ui/src/segments/components/form/validation/schema.js +++ b/ui/src/segments/components/form/validation/schema.js @@ -8,7 +8,7 @@ export const segmentConfigSchema = yup.lazy((obj) => return { ...acc, [key]: yup.mixed() - .when("$segmenterTypes", (segmenterTypes) => { + .when("$segmenterTypes", ([segmenterTypes], _) => { switch ((segmenterTypes[key] || "").toUpperCase()) { case "BOOL": return yup.array( @@ -43,7 +43,7 @@ export const segmentConfigSchema = yup.lazy((obj) => }) .when( "$requiredSegmenterNames", - (requiredSegmenterNames, schema) => { + ([requiredSegmenterNames], schema) => { if (requiredSegmenterNames.includes(key)) { return schema .required(`Segmenter ${key} is required`) diff --git a/ui/src/settings/segmenters/components/form/validation/schema.js b/ui/src/settings/segmenters/components/form/validation/schema.js index 684b07b2..6ab40f70 100644 --- a/ui/src/settings/segmenters/components/form/validation/schema.js +++ b/ui/src/settings/segmenters/components/form/validation/schema.js @@ -74,7 +74,7 @@ const schema = [ .max(64, "Name should be between 4 and 64 characters") .matches(nameRegex, nameRegexDescription), type: yup - .mixed() + .string() .required("Segmenter Value Type should be selected") .oneOf( typeOptionsValues, diff --git a/ui/yarn.lock b/ui/yarn.lock index 38f82c20..bb78f98f 100644 --- a/ui/yarn.lock +++ b/ui/yarn.lock @@ -1913,10 +1913,10 @@ resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39" integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== -"@caraml-dev/ui-lib@^1.13.0-build.3-a234b6b": - version "1.13.0-build.3-a234b6b" - resolved "https://registry.yarnpkg.com/@caraml-dev/ui-lib/-/ui-lib-1.13.0-build.3-a234b6b.tgz#f24d09d00c77f1288953da8f06893970cdeeda13" - integrity sha512-aiOWz2QNKJ3uK8No8r9FAfHHQNHe9cvSV5Bgznj7PRaTMpJbfDDSY8U+z+B60SjdtZ7qeeTiC14cEpmv/Ot07Q== +"@caraml-dev/ui-lib@^1.13.0-build.4-09c363a": + version "1.13.0-build.4-09c363a" + resolved "https://registry.yarnpkg.com/@caraml-dev/ui-lib/-/ui-lib-1.13.0-build.4-09c363a.tgz#c80987fa5c7989450095d354acf51a023ca94e15" + integrity sha512-kqb/5koS2IQtdLJIh5tk+t30ZX2GvvQO7kAuE9oKXKlwBPr83Q+lvLxcvSg+rxILYxjOUeNn2izoej0ZGMDoRg== dependencies: "@react-oauth/google" "0.12.1" classnames "^2.5.1"