Merge branch 'validate-metadata-dynamically' of Arnei/opencast-admin-interface into main

Pull request #800
Fixes #317
  Fix required metadata not being required

Author: gregorydlogan

src/components/events/partials/wizards/NewEventWizard.tsx

@@ -7,7 +7,7 @@ import NewMetadataPage from "../ModalTabsAndPages/NewMetadataPage";
 import NewAccessPage from "../ModalTabsAndPages/NewAccessPage";
 import NewProcessingPage from "../ModalTabsAndPages/NewProcessingPage";
 import NewSourcePage from "../ModalTabsAndPages/NewSourcePage";
-import { NewEventSchema } from "../../../../utils/validate";
+import { NewEventSchema, MetadataSchema } from "../../../../utils/validate";
 import WizardStepperEvent from "../../../shared/wizard/WizardStepperEvent";
 import { getInitialMetadataFieldValues } from "../../../../utils/resourceUtils";
 import { sourceMetadata } from "../../../../configs/sourceConfig";
@@ -98,7 +98,12 @@ const NewEventWizard: React.FC<{
 	];
 
 	// Validation schema of current page
-	const currentValidationSchema = NewEventSchema[page];
+	let currentValidationSchema;
+	if (page === 0 || page === 1) {
+		currentValidationSchema = MetadataSchema(metadataFields.fields);
+	} else {
+		currentValidationSchema = NewEventSchema[page];
+	}
 
 	const nextPage = (values: typeof initialValues) => {
 		setSnapshot(values);

src/components/events/partials/wizards/NewSeriesWizard.tsx

@@ -12,7 +12,7 @@ import NewMetadataExtendedPage from "../ModalTabsAndPages/NewMetadataExtendedPag
 import NewAccessPage from "../ModalTabsAndPages/NewAccessPage";
 import WizardStepper from "../../../shared/wizard/WizardStepper";
 import { initialFormValuesNewSeries } from "../../../../configs/modalConfig";
-import { NewSeriesSchema } from "../../../../utils/validate";
+import { MetadataSchema, NewSeriesSchema } from "../../../../utils/validate";
 import { getInitialMetadataFieldValues } from "../../../../utils/resourceUtils";
 import { useAppDispatch, useAppSelector } from "../../../../store";
 import { TobiraPage, postNewSeries } from "../../../../slices/seriesSlice";
@@ -81,7 +81,12 @@ const NewSeriesWizard: React.FC<{
 	];
 
 	// Validation schema of current page
-	const currentValidationSchema = NewSeriesSchema[page];
+	let currentValidationSchema;
+	if (page === 0 || page === 1) {
+		currentValidationSchema = MetadataSchema(metadataFields.fields);
+	} else {
+		currentValidationSchema = NewSeriesSchema[page];
+	}
 
 	const nextPage = (
 		values: {

src/utils/validate.ts

@@ -1,4 +1,5 @@
 import * as Yup from "yup";
+import { MetadataField } from "../slices/eventSlice";
 
 /**
  * This File contains all schemas used for validation with yup in the context of events and series
@@ -7,11 +8,70 @@ import * as Yup from "yup";
 const today = new Date();
 today.setHours(0, 0, 0, 0);
 
+/**
+ * Dynamically create a schema for a required metadata field
+ */
+export function createMetadataSchema(
+	schema: { [key: string]: any; },
+	config: { id: string; required: boolean; type: string; })
+{
+	const { id, required, type } = config;
+	if (!required) return schema;
+
+	let validationType: "string" | "array" | "date" = "string";
+	const validations: {
+		type: string,
+		params: any[],
+	}[] = [
+		{
+			type: "required",
+			params: ["this field is required"]
+		},
+	]
+
+	if (type === "mixed_text") {
+		validationType = "array";
+		validations.push({
+			type: "min",
+			params: [1, "there should be atleast one entry"]
+		})
+	}
+
+	if (type === "date" || type === "start_date") {
+		validationType = "date";
+	}
+
+	if (!Yup[validationType as keyof typeof Yup]) {
+		return schema;
+	}
+	let validator = Yup[validationType as "string"]();
+	validations.forEach(validation => {
+		const { params, type } = validation;
+		// @ts-expect-error
+		if (!validator[type]) {
+			return;
+		}
+		// @ts-expect-error
+		validator = validator[type](...params);
+	});
+	schema[id] = validator;
+	return schema;
+}
+
+/**
+ * Dynamically create a schema for required metadata fields
+ */
+export const MetadataSchema = (fields: MetadataField[]) => {
+	const schema = fields.reduce(createMetadataSchema, {});
+	const validateSchema = Yup.object().shape(schema);
+
+	return validateSchema;
+}
+
+
 // Validation Schema used in new event wizard (each step has its own yup validation object)
 export const NewEventSchema = [
-	Yup.object().shape({
-		title: Yup.string().required("Required"),
-	}),
+	Yup.object().shape({}),
 	Yup.object().shape({}),
 	Yup.object().shape({
 		uploadAssetsTrack: Yup.array().when("sourceMode", {