@designcrowd/library.brand-page 5.17.21 → 5.17.23-ast-subnav

package/src/brand-page-maker/utils/rich-text-editor.util.ts

@@ -12,6 +12,13 @@ import {
   type TextContent,
   type TextStyleDeclaration,
   type TextStyleType,
+  type ContactFormContent,
+  type AboutSectionContent,
+  type TestimonialSectionContent,
+  type SocialLinksContent,
+  type RequestPaymentContent,
+  type SupportMeContent,
+  type ShopContent,
 } from '@brand-page';
 import type { PageSettingsState } from '@shared/page-settings/store';
 import type { StyleSettingsState } from '@shared/style-settings/store';
@@ -21,16 +28,81 @@ import type { Mark } from 'prosemirror-model';
 import createDomPurify, { type DOMPurify } from 'dompurify';
 import { isHrefPageId } from '../composables/rich-text-editor/hyperlink';
 
+interface RTEFieldPair {
+  textField: string;
+  styleField: string;
+}
+
+const RTE_SECTION_FIELD_PAIRS: Record<string, RTEFieldPair[]> = {
+  'banner-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'booking-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'images-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'shapes-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'mailing-list': [{ textField: 'title', styleField: 'titleStyle' }],
+  profile: [
+    { textField: 'name', styleField: 'nameStyle' },
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'contact-form': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+    { textField: 'successMessage', styleField: 'successMessageStyle' },
+  ],
+  'about-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'paragraph', styleField: 'paragraphStyle' },
+  ],
+  'testimonial-section': [{ textField: 'title', styleField: 'titleStyle' }],
+  'social-links': [{ textField: 'title', styleField: 'titleStyle' }],
+  'request-payment': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'support-me': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+  'shop-section': [
+    { textField: 'title', styleField: 'titleStyle' },
+    { textField: 'description', styleField: 'descriptionStyle' },
+  ],
+};
+
+// 'text' has special textItems handling, so it's not in the map but is RTE-enabled
 export const RTE_ALLOWED_SECTION_TYPES = [
-  'banner-section',
+  ...Object.keys(RTE_SECTION_FIELD_PAIRS),
   'text',
-  'booking-section',
-  'images-section',
-  'shapes-section',
-  'mailing-list',
-  'profile',
 ];
 
+// Union of all section content types that support RTE field-pair processing
+type RTESectionContent =
+  | BannerSectionContent
+  | BookingSectionContent
+  | ImagesSectionContent
+  | ShapesSectionContent
+  | MailingListContent
+  | ProfileContent
+  | ContactFormContent
+  | AboutSectionContent
+  | TestimonialSectionContent
+  | SocialLinksContent
+  | RequestPaymentContent
+  | SupportMeContent
+  | ShopContent;
+
 // Only allow tags used by the enabled Tiptap extensions
 const allowedTags = [
   'p',
@@ -330,6 +402,94 @@ export const replaceTextInRTE = (
   return tempDiv.innerHTML;
 };
 
+const transformRTEField = (
+  content: RTESectionContent,
+  pair: RTEFieldPair,
+  externalEditor: Editor,
+  uiStyleSettingsStore: StyleSettingsState | undefined,
+  newContent: Content | undefined,
+  type: TextStyleType | undefined,
+  newStyle: TextStyleDeclaration | undefined,
+) => {
+  const fields = content as unknown as Record<string, unknown>;
+  const style = fields[pair.styleField] as TextStyleDeclaration | undefined;
+  const textStyleType = style?.textStyleType;
+
+  if (textStyleType && (textStyleType === type || uiStyleSettingsStore)) {
+    let globalContentStyle = uiStyleSettingsStore
+      ? uiStyleSettingsStore.textStyles.textStyleOptions[textStyleType].style
+      : newStyle ?? ({} as TextStyleDeclaration);
+
+    globalContentStyle = {
+      ...globalContentStyle,
+      textAlign: style?.textAlign,
+    };
+
+    fields[pair.textField] = getUpdatedHTMLFromEditor(
+      externalEditor,
+      fields[pair.textField] as string,
+      globalContentStyle,
+    );
+  } else if (
+    !textStyleType &&
+    newContent &&
+    newContent.id === content.id &&
+    !hasRTEContent(fields[pair.textField] as string)
+  ) {
+    const newContentFields = newContent as unknown as Record<string, unknown>;
+    const newContentStyle =
+      (newContentFields[pair.styleField] as TextStyleDeclaration | undefined) ||
+      style;
+
+    if (newContentStyle) {
+      fields[pair.textField] = getUpdatedHTMLFromEditor(
+        externalEditor,
+        fields[pair.textField] as string,
+        newContentStyle,
+      );
+    }
+  }
+};
+
+const switchRTEField = (
+  content: RTESectionContent,
+  pair: RTEFieldPair,
+  externalEditor: Editor,
+  uiStyleSettingsStore: StyleSettingsState | undefined,
+) => {
+  const fields = content as unknown as Record<string, unknown>;
+  const style = fields[pair.styleField] as TextStyleDeclaration | undefined;
+  const textStyleType = style?.textStyleType;
+
+  if (textStyleType && uiStyleSettingsStore) {
+    let globalContentStyle = uiStyleSettingsStore.textStyles.textStyleOptions[
+      textStyleType
+    ].style as TextStyleDeclaration;
+
+    globalContentStyle = {
+      ...globalContentStyle,
+      textAlign: style?.textAlign,
+    };
+
+    if (!hasRTEContent(fields[pair.textField] as string))
+      fields[pair.textField] = getUpdatedHTMLFromEditor(
+        externalEditor,
+        fields[pair.textField] as string,
+        globalContentStyle,
+      );
+  } else if (
+    !textStyleType &&
+    style &&
+    !hasRTEContent(fields[pair.textField] as string)
+  ) {
+    fields[pair.textField] = getUpdatedHTMLFromEditor(
+      externalEditor,
+      fields[pair.textField] as string,
+      style,
+    );
+  }
+};
+
 export const transformToRTE = (
   uiPageSettingStore: PageSettingsState,
   externalEditor: Editor,
@@ -340,427 +500,113 @@ export const transformToRTE = (
 ) => {
   for (const page of uiPageSettingStore.pages) {
     for (const contentItem of page.contents) {
-      switch (contentItem.type) {
-        case 'banner-section':
-        case 'booking-section':
-          const sectionContent = contentItem.settings.content as
-            | BannerSectionContent
-            | BookingSectionContent;
-          const titleTextStyleType = sectionContent.titleStyle.textStyleType;
-          const descriptionTextStyleType =
-            sectionContent.descriptionStyle.textStyleType;
-
-          if (
-            titleTextStyleType &&
-            (titleTextStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  titleTextStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: sectionContent.titleStyle.textAlign,
-            };
-
-            sectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.title,
-              globalContentStyle,
-            );
-          } else if (
-            !titleTextStyleType &&
-            newContent &&
-            newContent.id === sectionContent.id &&
-            !hasRTEContent(sectionContent.title)
-          ) {
-            const newContentStyle = (
-              newContent as BannerSectionContent | BookingSectionContent
-            ).titleStyle;
-
-            sectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (
-            descriptionTextStyleType &&
-            (descriptionTextStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  descriptionTextStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: sectionContent.descriptionStyle.textAlign,
-            };
-
-            sectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.description,
-              globalContentStyle,
-            );
-          } else if (
-            !descriptionTextStyleType &&
-            newContent &&
-            newContent.id === sectionContent.id &&
-            !hasRTEContent(sectionContent.description)
-          ) {
-            const newContentStyle = (
-              newContent as BannerSectionContent | BookingSectionContent
-            ).descriptionStyle;
-
-            sectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.description,
-              newContentStyle,
-            );
-          }
-
-          break;
-        case 'images-section':
-        case 'shapes-section':
-          const mediaSectionContent = contentItem.settings.content as
-            | ImagesSectionContent
-            | ShapesSectionContent;
-          const mediaTitleTextStyleType =
-            mediaSectionContent.titleStyle.textStyleType;
-          const mediaDescriptionTextStyleType =
-            mediaSectionContent.descriptionStyle.textStyleType;
-
-          if (
-            mediaTitleTextStyleType &&
-            (mediaTitleTextStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  mediaTitleTextStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: mediaSectionContent.titleStyle.textAlign,
-            };
-
-            mediaSectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.title,
-              globalContentStyle,
-            );
-          } else if (
-            !mediaTitleTextStyleType &&
-            newContent &&
-            newContent.id === mediaSectionContent.id &&
-            !hasRTEContent(mediaSectionContent.title)
-          ) {
-            const newContentStyle = (
-              newContent as ImagesSectionContent | ShapesSectionContent
-            ).titleStyle;
-
-            mediaSectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (
-            mediaDescriptionTextStyleType &&
-            (mediaDescriptionTextStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  mediaDescriptionTextStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: mediaSectionContent.descriptionStyle.textAlign,
-            };
-
-            mediaSectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.description,
-              globalContentStyle,
-            );
-          } else if (
-            !mediaDescriptionTextStyleType &&
-            newContent &&
-            newContent.id === mediaSectionContent.id &&
-            !hasRTEContent(mediaSectionContent.description)
-          ) {
-            const newContentStyle = (
-              newContent as ImagesSectionContent | ShapesSectionContent
-            ).descriptionStyle;
-
-            mediaSectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.description,
-              newContentStyle,
-            );
-          }
-
-          break;
-        case 'text':
-          const textContent = contentItem.settings.content as TextContent;
-
-          if (textContent.textItems && textContent.textItems.length > 0) {
-            for (const [
-              itemIndex,
-              textItemContent,
-            ] of textContent.textItems.entries()) {
-              const textItemStyleType = textItemContent.textStyle.textStyleType;
-
-              if (
-                textItemStyleType &&
-                (textItemStyleType === type || uiStyleSettingsStore)
-              ) {
-                let globalContentStyle = uiStyleSettingsStore
-                  ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                      textItemStyleType
-                    ].style
-                  : newStyle ?? ({} as TextStyleDeclaration);
-
-                globalContentStyle = {
-                  ...globalContentStyle,
-                  textAlign: textItemContent.textStyle.textAlign,
-                };
-
-                textItemContent.text = getUpdatedHTMLFromEditor(
-                  externalEditor,
-                  textItemContent.text,
-                  globalContentStyle,
-                );
-              } else if (
-                !textItemStyleType &&
-                newContent &&
-                newContent.id === textContent.id &&
-                !hasRTEContent(textItemContent.text)
-              ) {
-                const newContentStyle =
-                  (newContent as TextContent)?.textItems?.[itemIndex]
-                    ?.textStyle ?? (newContent as TextContent).textStyle;
+      const fieldPairs = RTE_SECTION_FIELD_PAIRS[contentItem.type];
+
+      if (fieldPairs) {
+        const content = contentItem.settings.content as RTESectionContent;
+
+        for (const pair of fieldPairs) {
+          transformRTEField(
+            content,
+            pair,
+            externalEditor,
+            uiStyleSettingsStore,
+            newContent,
+            type,
+            newStyle,
+          );
+        }
+      }
 
-                textItemContent.text = getUpdatedHTMLFromEditor(
-                  externalEditor,
-                  textItemContent.text,
-                  newContentStyle,
-                );
-              }
-            }
-          }
+      if (contentItem.type === 'text') {
+        const textContent = contentItem.settings.content as TextContent;
 
-          if (
-            (!textContent.textItems || textContent.textItems.length === 0) &&
-            textContent.textStyle
-          ) {
-            const textStyleType = textContent.textStyle.textStyleType;
+        if (textContent.textItems && textContent.textItems.length > 0) {
+          for (const [
+            itemIndex,
+            textItemContent,
+          ] of textContent.textItems.entries()) {
+            const textItemStyleType = textItemContent.textStyle.textStyleType;
 
             if (
-              textStyleType &&
-              (textStyleType === type || uiStyleSettingsStore)
+              textItemStyleType &&
+              (textItemStyleType === type || uiStyleSettingsStore)
             ) {
               let globalContentStyle = uiStyleSettingsStore
                 ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                    textStyleType
+                    textItemStyleType
                   ].style
                 : newStyle ?? ({} as TextStyleDeclaration);
 
               globalContentStyle = {
                 ...globalContentStyle,
-                textAlign: textContent.textStyle.textAlign,
+                textAlign: textItemContent.textStyle.textAlign,
               };
 
-              textContent.text = getUpdatedHTMLFromEditor(
+              textItemContent.text = getUpdatedHTMLFromEditor(
                 externalEditor,
-                textContent.text,
+                textItemContent.text,
                 globalContentStyle,
               );
             } else if (
-              !textStyleType &&
+              !textItemStyleType &&
               newContent &&
               newContent.id === textContent.id &&
-              !hasRTEContent(textContent.text)
+              !hasRTEContent(textItemContent.text)
             ) {
-              const newContentStyle = (newContent as TextContent).textStyle;
+              const newContentStyle =
+                (newContent as TextContent)?.textItems?.[itemIndex]
+                  ?.textStyle ?? (newContent as TextContent).textStyle;
 
-              textContent.text = getUpdatedHTMLFromEditor(
+              textItemContent.text = getUpdatedHTMLFromEditor(
                 externalEditor,
-                textContent.text,
+                textItemContent.text,
                 newContentStyle,
               );
             }
           }
+        }
 
-          break;
-        case 'profile':
-          const profileContent = contentItem.settings.content as ProfileContent;
-
-          const nameStyleType = profileContent.nameStyle.textStyleType;
-          const profileTitleStyleType = profileContent.titleStyle.textStyleType;
-          const profileDescriptionTextStyleType =
-            profileContent.descriptionStyle.textStyleType;
+        if (
+          (!textContent.textItems || textContent.textItems.length === 0) &&
+          textContent.textStyle
+        ) {
+          const textStyleType = textContent.textStyle.textStyleType;
 
           if (
-            nameStyleType &&
-            (nameStyleType === type || uiStyleSettingsStore)
+            textStyleType &&
+            (textStyleType === type || uiStyleSettingsStore)
           ) {
             let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[nameStyleType]
+              ? uiStyleSettingsStore.textStyles.textStyleOptions[textStyleType]
                   .style
               : newStyle ?? ({} as TextStyleDeclaration);
 
             globalContentStyle = {
               ...globalContentStyle,
-              textAlign: profileContent.nameStyle.textAlign,
-            };
-
-            profileContent.name = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.name,
-              globalContentStyle,
-            );
-          } else if (
-            !nameStyleType &&
-            newContent &&
-            newContent.id === profileContent.id &&
-            !hasRTEContent(profileContent.name)
-          ) {
-            const newContentStyle = (newContent as ProfileContent).nameStyle;
-
-            profileContent.name = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.name,
-              newContentStyle,
-            );
-          }
-
-          if (
-            profileTitleStyleType &&
-            (profileTitleStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  profileTitleStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: profileContent.titleStyle.textAlign,
-            };
-
-            profileContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.title,
-              globalContentStyle,
-            );
-          } else if (
-            !profileTitleStyleType &&
-            newContent &&
-            newContent.id === profileContent.id &&
-            !hasRTEContent(profileContent.title)
-          ) {
-            const newContentStyle = (newContent as ProfileContent).titleStyle;
-
-            profileContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (
-            profileDescriptionTextStyleType &&
-            (profileDescriptionTextStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  profileDescriptionTextStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: profileContent.descriptionStyle.textAlign,
+              textAlign: textContent.textStyle.textAlign,
             };
 
-            profileContent.description = getUpdatedHTMLFromEditor(
+            textContent.text = getUpdatedHTMLFromEditor(
               externalEditor,
-              profileContent.description,
+              textContent.text,
               globalContentStyle,
             );
           } else if (
-            !profileDescriptionTextStyleType &&
+            !textStyleType &&
             newContent &&
-            newContent.id === profileContent.id &&
-            !hasRTEContent(profileContent.description)
+            newContent.id === textContent.id &&
+            !hasRTEContent(textContent.text)
           ) {
-            const newContentStyle = (newContent as ProfileContent)
-              .descriptionStyle;
+            const newContentStyle = (newContent as TextContent).textStyle;
 
-            profileContent.description = getUpdatedHTMLFromEditor(
+            textContent.text = getUpdatedHTMLFromEditor(
               externalEditor,
-              profileContent.description,
+              textContent.text,
               newContentStyle,
             );
           }
-
-          break;
-        case 'mailing-list':
-          const mailingListContent = contentItem.settings
-            .content as MailingListContent;
-
-          const titleStyle = mailingListContent.titleStyle;
-
-          const mailingTitleStyleType = titleStyle?.textStyleType;
-
-          if (
-            mailingTitleStyleType &&
-            (mailingTitleStyleType === type || uiStyleSettingsStore)
-          ) {
-            let globalContentStyle = uiStyleSettingsStore
-              ? uiStyleSettingsStore.textStyles.textStyleOptions[
-                  mailingTitleStyleType
-                ].style
-              : newStyle ?? ({} as TextStyleDeclaration);
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: titleStyle.textAlign,
-            };
-
-            mailingListContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mailingListContent.title,
-              globalContentStyle,
-            );
-          } else if (
-            !mailingTitleStyleType &&
-            newContent &&
-            newContent.id === mailingListContent.id &&
-            !hasRTEContent(mailingListContent.title)
-          ) {
-            const newContentStyle =
-              (newContent as MailingListContent).titleStyle || titleStyle;
-
-            mailingListContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mailingListContent.title,
-              newContentStyle,
-            );
-          }
-
-          break;
+        }
       }
     }
   }
@@ -773,348 +619,88 @@ export const switchAllContentToRTE = (
 ) => {
   for (const page of uiPageSettingStore.pages) {
     for (const contentItem of page.contents) {
-      switch (contentItem.type) {
-        case 'banner-section':
-        case 'booking-section':
-          const sectionContent = contentItem.settings.content as
-            | BannerSectionContent
-            | BookingSectionContent;
-          const titleTextStyleType = sectionContent.titleStyle.textStyleType;
-          const descriptionTextStyleType =
-            sectionContent.descriptionStyle.textStyleType;
-
-          if (titleTextStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[titleTextStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: sectionContent.titleStyle.textAlign,
-            };
-
-            if (!hasRTEContent(sectionContent.title))
-              sectionContent.title = getUpdatedHTMLFromEditor(
-                externalEditor,
-                sectionContent.title,
-                globalContentStyle,
-              );
-          } else if (
-            !titleTextStyleType &&
-            !hasRTEContent(sectionContent.title)
-          ) {
-            const newContentStyle = sectionContent.titleStyle;
-
-            sectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (descriptionTextStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[descriptionTextStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: sectionContent.descriptionStyle.textAlign,
-            };
-
-            if (!hasRTEContent(sectionContent.description))
-              sectionContent.description = getUpdatedHTMLFromEditor(
-                externalEditor,
-                sectionContent.description,
-                globalContentStyle,
-              );
-          } else if (
-            !descriptionTextStyleType &&
-            !hasRTEContent(sectionContent.description)
-          ) {
-            const newContentStyle = sectionContent.descriptionStyle;
-
-            sectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              sectionContent.description,
-              newContentStyle,
-            );
-          }
-
-          break;
-        case 'images-section':
-        case 'shapes-section':
-          const mediaSectionContent = contentItem.settings.content as
-            | ImagesSectionContent
-            | ShapesSectionContent;
-          const mediaTitleTextStyleType =
-            mediaSectionContent.titleStyle.textStyleType;
-          const mediaDescriptionTextStyleType =
-            mediaSectionContent.descriptionStyle.textStyleType;
-
-          if (mediaTitleTextStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[mediaTitleTextStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: mediaSectionContent.titleStyle.textAlign,
-            };
-
-            if (!hasRTEContent(mediaSectionContent.title))
-              mediaSectionContent.title = getUpdatedHTMLFromEditor(
-                externalEditor,
-                mediaSectionContent.title,
-                globalContentStyle,
-              );
-          } else if (
-            !mediaTitleTextStyleType &&
-            !hasRTEContent(mediaSectionContent.title)
-          ) {
-            const newContentStyle = mediaSectionContent.titleStyle;
-
-            mediaSectionContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (mediaDescriptionTextStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[mediaDescriptionTextStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: mediaSectionContent.descriptionStyle.textAlign,
-            };
-
-            if (!hasRTEContent(mediaSectionContent.description))
-              mediaSectionContent.description = getUpdatedHTMLFromEditor(
-                externalEditor,
-                mediaSectionContent.description,
-                globalContentStyle,
-              );
-          } else if (
-            !mediaDescriptionTextStyleType &&
-            !hasRTEContent(mediaSectionContent.description)
-          ) {
-            const newContentStyle = mediaSectionContent.descriptionStyle;
+      const fieldPairs = RTE_SECTION_FIELD_PAIRS[contentItem.type];
 
-            mediaSectionContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              mediaSectionContent.description,
-              newContentStyle,
-            );
-          }
+      if (fieldPairs) {
+        const content = contentItem.settings.content as RTESectionContent;
 
-          break;
-        case 'text':
-          const textContent = contentItem.settings.content as TextContent;
-
-          if (textContent.textItems && textContent.textItems.length > 0) {
-            for (const [
-              itemIndex,
-              textItemContent,
-            ] of textContent.textItems.entries()) {
-              const textItemStyleType = textItemContent.textStyle.textStyleType;
-
-              if (textItemStyleType && uiStyleSettingsStore) {
-                let globalContentStyle = uiStyleSettingsStore.textStyles
-                  .textStyleOptions[textItemStyleType]
-                  .style as TextStyleDeclaration;
-
-                globalContentStyle = {
-                  ...globalContentStyle,
-                  textAlign: textItemContent.textStyle.textAlign,
-                };
-
-                if (!hasRTEContent(textItemContent.text))
-                  textItemContent.text = getUpdatedHTMLFromEditor(
-                    externalEditor,
-                    textItemContent.text,
-                    globalContentStyle,
-                  );
-              } else if (
-                !textItemStyleType &&
-                !hasRTEContent(textItemContent.text)
-              ) {
-                const newContentStyle = textItemContent.textStyle;
+        for (const pair of fieldPairs) {
+          switchRTEField(content, pair, externalEditor, uiStyleSettingsStore);
+        }
+      }
 
-                textItemContent.text = getUpdatedHTMLFromEditor(
-                  externalEditor,
-                  textItemContent.text,
-                  newContentStyle,
-                );
-              }
-            }
-          }
+      if (contentItem.type === 'text') {
+        const textContent = contentItem.settings.content as TextContent;
 
-          if (
-            (!textContent.textItems || textContent.textItems.length === 0) &&
-            textContent.textStyle
-          ) {
-            const textStyleType = textContent.textStyle.textStyleType;
+        if (textContent.textItems && textContent.textItems.length > 0) {
+          for (const [
+            itemIndex,
+            textItemContent,
+          ] of textContent.textItems.entries()) {
+            const textItemStyleType = textItemContent.textStyle.textStyleType;
 
-            if (textStyleType && uiStyleSettingsStore) {
+            if (textItemStyleType && uiStyleSettingsStore) {
               let globalContentStyle = uiStyleSettingsStore.textStyles
-                .textStyleOptions[textStyleType].style as TextStyleDeclaration;
+                .textStyleOptions[textItemStyleType]
+                .style as TextStyleDeclaration;
 
               globalContentStyle = {
                 ...globalContentStyle,
-                textAlign: textContent.textStyle.textAlign,
+                textAlign: textItemContent.textStyle.textAlign,
               };
 
-              if (!hasRTEContent(textContent.text))
-                textContent.text = getUpdatedHTMLFromEditor(
+              if (!hasRTEContent(textItemContent.text))
+                textItemContent.text = getUpdatedHTMLFromEditor(
                   externalEditor,
-                  textContent.text,
+                  textItemContent.text,
                   globalContentStyle,
                 );
-            } else if (!textStyleType && !hasRTEContent(textContent.text)) {
-              const newContentStyle = textContent.textStyle;
+            } else if (
+              !textItemStyleType &&
+              !hasRTEContent(textItemContent.text)
+            ) {
+              const newContentStyle = textItemContent.textStyle;
 
-              textContent.text = getUpdatedHTMLFromEditor(
+              textItemContent.text = getUpdatedHTMLFromEditor(
                 externalEditor,
-                textContent.text,
+                textItemContent.text,
                 newContentStyle,
               );
             }
           }
+        }
 
-          break;
-        case 'profile':
-          const profileContent = contentItem.settings.content as ProfileContent;
-
-          const nameStyleType = profileContent.nameStyle.textStyleType;
-          const profileTitleStyleType = profileContent.titleStyle.textStyleType;
-          const profileDescriptionTextStyleType =
-            profileContent.descriptionStyle.textStyleType;
-
-          if (nameStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[nameStyleType].style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: profileContent.nameStyle.textAlign,
-            };
-
-            if (!hasRTEContent(profileContent.name))
-              profileContent.name = getUpdatedHTMLFromEditor(
-                externalEditor,
-                profileContent.name,
-                globalContentStyle,
-              );
-          } else if (!nameStyleType && !hasRTEContent(profileContent.name)) {
-            const newContentStyle = profileContent.nameStyle;
-
-            profileContent.name = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.name,
-              newContentStyle,
-            );
-          }
-
-          if (profileTitleStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[profileTitleStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: profileContent.titleStyle.textAlign,
-            };
-
-            if (!hasRTEContent(profileContent.title))
-              profileContent.title = getUpdatedHTMLFromEditor(
-                externalEditor,
-                profileContent.title,
-                globalContentStyle,
-              );
-          } else if (
-            !profileTitleStyleType &&
-            !hasRTEContent(profileContent.title)
-          ) {
-            const newContentStyle = profileContent.titleStyle;
-
-            profileContent.title = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.title,
-              newContentStyle,
-            );
-          }
-
-          if (profileDescriptionTextStyleType && uiStyleSettingsStore) {
-            let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[profileDescriptionTextStyleType]
-              .style as TextStyleDeclaration;
-
-            globalContentStyle = {
-              ...globalContentStyle,
-              textAlign: profileContent.descriptionStyle.textAlign,
-            };
-
-            if (!hasRTEContent(profileContent.description))
-              profileContent.description = getUpdatedHTMLFromEditor(
-                externalEditor,
-                profileContent.description,
-                globalContentStyle,
-              );
-          } else if (
-            !profileDescriptionTextStyleType &&
-            !hasRTEContent(profileContent.description)
-          ) {
-            const newContentStyle = profileContent.descriptionStyle;
-
-            profileContent.description = getUpdatedHTMLFromEditor(
-              externalEditor,
-              profileContent.description,
-              newContentStyle,
-            );
-          }
-
-          break;
-        case 'mailing-list':
-          const mailingListContent = contentItem.settings
-            .content as MailingListContent;
-
-          const titleStyle = mailingListContent.titleStyle;
-
-          const titleStyleStyleType = titleStyle?.textStyleType;
+        if (
+          (!textContent.textItems || textContent.textItems.length === 0) &&
+          textContent.textStyle
+        ) {
+          const textStyleType = textContent.textStyle.textStyleType;
 
-          if (titleStyleStyleType && uiStyleSettingsStore) {
+          if (textStyleType && uiStyleSettingsStore) {
             let globalContentStyle = uiStyleSettingsStore.textStyles
-              .textStyleOptions[titleStyleStyleType]
-              .style as TextStyleDeclaration;
+              .textStyleOptions[textStyleType].style as TextStyleDeclaration;
 
             globalContentStyle = {
               ...globalContentStyle,
-              textAlign: mailingListContent.titleStyle.textAlign,
+              textAlign: textContent.textStyle.textAlign,
             };
 
-            if (!hasRTEContent(mailingListContent.title))
-              mailingListContent.title = getUpdatedHTMLFromEditor(
+            if (!hasRTEContent(textContent.text))
+              textContent.text = getUpdatedHTMLFromEditor(
                 externalEditor,
-                mailingListContent.title,
+                textContent.text,
                 globalContentStyle,
               );
-          } else if (
-            !titleStyleStyleType &&
-            !hasRTEContent(mailingListContent.title)
-          ) {
-            const newContentStyle = mailingListContent.titleStyle;
+          } else if (!textStyleType && !hasRTEContent(textContent.text)) {
+            const newContentStyle = textContent.textStyle;
 
-            mailingListContent.title = getUpdatedHTMLFromEditor(
+            textContent.text = getUpdatedHTMLFromEditor(
               externalEditor,
-              mailingListContent.title,
+              textContent.text,
               newContentStyle,
             );
           }
-
-          break;
+        }
       }
     }
   }
@@ -1125,6 +711,10 @@ export const getUpdatedHTMLFromEditor = (
   contentText: string,
   newContentStyle: TextStyleDeclaration,
 ) => {
+  if (!contentText) {
+    return contentText;
+  }
+
   const content = contentText.includes(ESCAPED_NEWLINE_CHARACTER)
     ? getRenderText(contentText)
     : contentText;
@@ -1234,7 +824,7 @@ export const buildInitialMarks = (
   }
 
   // Bold and italic
-  if (fontWeight) {
+  if (fontWeight === 'bold') {
     marks.push(state.schema.marks.bold.create());
   }