fix: sponsor form description/instructions validation for html

src/components/inputs/formik-text-editor.js

@@ -1,7 +1,7 @@
 import React from "react";
 import TextEditorV3 from "openstack-uicore-foundation/lib/components/inputs/editor-input-v3";
 import { useFormikContext } from "formik";
-import normalizeJoditEmpty from "./utils/normalizeJoditEmpty";
+import normalizeHtmlString from "../../utils/normalize-html-string";
 
 const FormikTextEditor = ({ name, ...props }) => {
   const { values, errors, touched, setFieldValue, setFieldTouched } =
@@ -13,8 +13,7 @@ const FormikTextEditor = ({ name, ...props }) => {
       id={name}
       value={values[name]}
       onChange={(e) => {
-        const stringValue = normalizeJoditEmpty(e.target.value);
-
+        const stringValue = normalizeHtmlString(e.target.value);
         setFieldValue(name, stringValue);
       }}
       onBlur={() => setFieldTouched(name, true)}

src/pages/sponsors-global/form-templates/form-template-popup.js

@@ -22,6 +22,7 @@ import AdditionalInputList from "../../../components/mui/formik-inputs/additiona
 import useScrollToError from "../../../hooks/useScrollToError";
 import {
   formMetafieldsValidation,
+  requiredHTMLValidation,
   requiredStringValidation
 } from "../../../utils/yup";
 
@@ -53,7 +54,7 @@ const FormTemplateDialog = ({
     validationSchema: yup.object().shape({
       code: requiredStringValidation(),
       name: requiredStringValidation(),
-      instructions: requiredStringValidation(),
+      instructions: requiredHTMLValidation(),
       meta_fields: formMetafieldsValidation()
     }),
     enableReinitialize: true,

src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js

@@ -32,7 +32,8 @@ import {
   decimalValidation,
   requiredStringValidation,
   positiveNumberValidation,
-  formMetafieldsValidation
+  formMetafieldsValidation,
+  requiredHTMLValidation
 } from "../../../utils/yup";
 import AdditionalInputList from "../../../components/mui/formik-inputs/additional-input/additional-input-list";
 import MuiFormikQuantityField from "../../../components/mui/formik-inputs/mui-formik-quantity-field";
@@ -66,7 +67,7 @@ const SponsorItemDialog = ({
     validationSchema: yup.object().shape({
       code: requiredStringValidation(),
       name: requiredStringValidation(),
-      description: requiredStringValidation(),
+      description: requiredHTMLValidation(),
       images: yup.array(),
       early_bird_rate: decimalValidation(),
       standard_rate: decimalValidation(),

src/pages/sponsors/sponsor-form-item-list-page/components/sponsor-form-item-form.js

@@ -18,6 +18,7 @@ import {
   decimalValidation,
   formMetafieldsValidation,
   positiveNumberValidation,
+  requiredHTMLValidation,
   requiredStringValidation
 } from "../../../../utils/yup";
 import MuiFormikTextField from "../../../../components/mui/formik-inputs/mui-formik-textfield";
@@ -38,7 +39,7 @@ const SponsorFormItemForm = ({ initialValues, onSubmit }) => {
     validationSchema: yup.object({
       code: requiredStringValidation(),
       name: requiredStringValidation(),
-      description: requiredStringValidation(),
+      description: requiredHTMLValidation(),
       early_bird_rate: decimalValidation(),
       standard_rate: decimalValidation(),
       onsite_rate: decimalValidation(),

src/pages/sponsors/sponsor-forms-list-page/components/form-template/form-template-form.js

@@ -17,6 +17,7 @@ import {
   addIssAfterDateFieldValidator,
   formMetafieldsValidation,
   opensAtValidation,
+  requiredHTMLValidation,
   requiredStringValidation
 } from "../../../../../utils/yup";
 import DropdownCheckbox from "../../../../../components/mui/dropdown-checkbox";
@@ -51,7 +52,7 @@ const FormTemplateForm = ({
     initialValues: buildInitialValues(initialValues, summitTZ),
     validationSchema: yup.object({
       code: requiredStringValidation(),
-      instructions: requiredStringValidation(),
+      instructions: requiredHTMLValidation(),
       opens_at: opensAtValidation(),
       expires_at: yup
         .date(T.translate("validation.date"))

src/components/inputs/utils/__tests__/normalizeJoditEmpty.test.js → src/utils/normalize-html-string/__tests__/normalizeHtmlString.test.js

@@ -1,14 +1,14 @@
 import { expect, describe, it } from "@jest/globals";
-import normalizeJoditEmpty from "../normalizeJoditEmpty";
+import normalizeHtmlString from "../index";
 
-describe("normalizeJoditEmpty", () => {
+describe("normalizeHtmlString", () => {
   it("normalizes an empty string that is surrounded by html tags", () => {
     const inputString = "<p><br></p>";
-    expect(normalizeJoditEmpty(inputString)).toBe("");
+    expect(normalizeHtmlString(inputString)).toBe("");
   });
 
   it("normalizes a string with content is returned without modifications", () => {
     const inputString = "<p>This is a content strign</p>";
-    expect(normalizeJoditEmpty(inputString)).toBe(inputString);
+    expect(normalizeHtmlString(inputString)).toBe(inputString);
   });
 });

src/utils/normalize-html-string/index.js

@@ -0,0 +1,8 @@
+// removes html tags if contained text is empty
+const normalizeHtmlString = (textInput) => {
+  if (!textInput) return "";
+  const doc = new DOMParser().parseFromString(textInput, "text/html");
+  return doc.body.textContent.trim().length === 0 ? "" : textInput;
+};
+
+export default normalizeHtmlString;

src/utils/yup.js

@@ -1,6 +1,7 @@
 import * as yup from "yup";
 import T from "i18n-react";
 import { METAFIELD_TYPES, fieldTypesWithOptions } from "./constants";
+import normalizeHtmlString from "./normalize-html-string";
 
 export const addEmailListValidator = () => {
   yup.addMethod(yup.string, "emailList", function (errorMessage) {
@@ -87,6 +88,18 @@ export const rateCellValidation = () =>
 export const requiredStringValidation = () =>
   yup.string().required(T.translate("validation.required"));
 
+export const requiredHTMLValidation = () =>
+  yup
+    .string()
+    .transform((value, originalValue) => {
+      // If the value is a string, strip HTML tags
+      if (typeof originalValue === "string") {
+        return normalizeHtmlString(originalValue);
+      }
+      return value; // Handle non-string values appropriately
+    })
+    .required(T.translate("validation.required"));
+
 export const positiveNumberValidation = () =>
   numberValidation()
     .integer(T.translate("validation.integer"))