DigitalConsumer.ISS/src/helpers/cms-content-helper.js

import { dynamicStrings } from "@/constants/dynamic-strings";
import { useMainStore } from '@/store';

export function fetchCmsContentForPage(issPage) {
  const store = useMainStore()
  const clientName = store.issConfig.clientName;
  const accountNumber = store.issConfig.accountNumber;
  const clientOverride = (clientName.length > 0 && accountNumber > 0);

  return store.getPageData(issPage)
    .then(
      // Get the base/default page first.
      (baseResponse) => {
        if ( !clientOverride )
        {
          // Return the base page if there are no client override.
          return processPageData(baseResponse, null);
        }
        else {
          // Else get the client override page.
          const pageName = issPage + "_" + clientName.toLowerCase().replace(/ /g, "");

          return store.getPageData(pageName)
          .then(            
            (clientResponse) => {
              // Process the client override if it exists.
              return processPageData(baseResponse, clientResponse);
            },
            (error) => {
              // Process the just the base if no client override exists.
              return processPageData(baseResponse, null);
            }
          );
        }
      }
    );
};

// Support method for processing the page data from the CMS call.
// baseResponse = contains the widgets from the base page.
// clientResponse = contains the widgets from the client override page. (null if none)
function processPageData(baseResponse, clientResponse) {
  const pageDataFromCms = {};
  let widgets = [];

  if ( clientResponse === null )
  {
    widgets = baseResponse.data.Result;
  }
  else
  {
    // Overide any base widgets with the client override widgets if found.
    baseResponse.data.Result.forEach((baseWidget) => {
      let found = false;
      clientResponse.data.Result.forEach((clientWidget) => {
        
        if ( clientWidget.Name == baseWidget.Name )
        {
          widgets.push(clientWidget);
          found = true;
        }
      });

      if ( !found )
        widgets.push(baseWidget);

    });
  }
  
  widgets.forEach((widget) => {
    // Global state value replacement.
    let widgetWithReplacements = findAndReplaceGlobalStateValues(
      widget.Model,
      widget.Name
    );

    // If we already have this widget, push it on the collection
    if (widgetWithReplacements.Name in pageDataFromCms) {
      pageDataFromCms[widgetWithReplacements.Name].push(
        widgetWithReplacements.Model
      );
      return;
    }

    pageDataFromCms[widgetWithReplacements.Name] = [
      widgetWithReplacements.Model,
    ];
  });

  Object.keys(pageDataFromCms).forEach((key) => {
    if (pageDataFromCms[key].length === 1) {
      pageDataFromCms[key] = pageDataFromCms[key][0];
    }
  });

  return pageDataFromCms;
}

  // Parent function for processWidgetItemForReplacement. This will loop through the parent
// object and pass any objects that need additional processing to the processWidgetItemForReplacement function.
function findAndReplaceGlobalStateValues(widgetModel, widgetName) {
    const objWithReplacements = {
      Name: widgetName,
      Model: {},
    };
  
    Object.keys(widgetModel).forEach((key) => {
      let modelWithReplacements = processWidgetItemForReplacement(
        widgetModel,
        key
      );
  
      objWithReplacements.Model[key] = modelWithReplacements;
    });
  
    return objWithReplacements;
  }

  // This function will process the widget item and replace any global state variables with their values.
// This is a recursive function, it will call itself until it runs out of items to iterate on given the object.
function processWidgetItemForReplacement(widgetModel, key) {
    // If we have a string, and it needs to be replaced.
    if (typeof widgetModel[key] === "string") {
      if (widgetModel[key].includes(dynamicStrings.GLOBAL_STATE)) {
        widgetModel[key] = mapStringToState(widgetModel[key]);
      }
      if (widgetModel[key].includes(dynamicStrings.MODAL_LINK)) {
        widgetModel[key] = mapStringToModal(widgetModel[key]);
      }
      return widgetModel[key];
    }
  
    // If we have an object. array, etc
    if (
      typeof widgetModel[key] === "object" &&
      Object.keys(widgetModel[key]).length
    ) {
      Object.keys(widgetModel[key]).forEach((item) => {
        processWidgetItemForReplacement(widgetModel[key], item);
      });
  
      return widgetModel[key];
    }
  
    // If we have something else like a number, boolean, etc. just return it
    return widgetModel[key];
  }

function mapStringToModal(str) {
  let startIndex = str.indexOf("{" + dynamicStrings.MODAL_LINK);
  let linkToReplace = str.substring(startIndex, str.length);
  linkToReplace = linkToReplace.substring(0, linkToReplace.indexOf("}") + 1);
  
  let params = linkToReplace.substring((dynamicStrings.MODAL_LINK).length + 2, linkToReplace.length -1)
  let splitParams = params.split(",");
  let bodyText = '<a href="#!" data-bs-toggle="modal" data-bs-target="#' + splitParams[0] + '" aria-label="Modal window">' + splitParams[1] +'</a>'
  
  return str.replace(linkToReplace, bodyText);
}

  // Function to convert a string, into a matching global state item.
function mapStringToState(str) {
    // Pull all matches out of the string.
    const regexExp = new RegExp("{(.*?):(.*?)}", "g");
    const regexMatches = [...str.matchAll(regexExp)];
    const globalStateMatches = regexMatches.filter(match => {
      return match[1] === dynamicStrings.GLOBAL_STATE;
    });
  
    // Our final string value that will be built from the matches.
    let stringBuilder = "";
  
    for (const match of globalStateMatches) {
      // Reset store state for each match.
      let storeState = useMainStore();
  
      for (const s of match[2].split(".")) {
        if (storeState[s] != undefined) {
          storeState = storeState[s];
        } else {
          return ""; // if we can't map our string to state data, return an empty string.
        }
      }
  
      const stringWithReplacement = str.replace(match[0], storeState);
  
      // If we still have values we need to substitute, call this function again.
      if (stringWithReplacement.includes(dynamicStrings.GLOBAL_STATE)) {
        return mapStringToState(stringWithReplacement);
      }
  
      // Concatenate the string.
      stringBuilder = `${stringBuilder} ${stringWithReplacement}`;
    }
  
    return stringBuilder.trimStart();
  }

export function doesCopyContainRouterLink(copy) {
    return copy.includes(this.dynamicStrings.ROUTER_LINK);
}

export function splitCopyOnCMSPlaceHolder(copy) {
    // splits copy on { ... } such as {routerlink: ...}
    return copy.split(/{(.*?)}/g);
}

export function getRouterLinkRouteFromCopy(copy) {
    // sample input:      {routerLink:estimate,provide your VIN}
    // first split would return      'estimate,provide your VIN'
    // second split would return     'estimate'
    return copy.split(":")[1].split(",")[0];
}

export function getRouterLinkDisplayTextFromCopy(copy) {
    // sample input:     {routerLink:estimate,provide your VIN}
    // first split would return     'estimate,provide your VIN'
    // second split would return             'provide your VIN'
    return copy.split(":")[1].split(",")[1];
}

// Copy returned from the CMS that has newlines will return blocks wrapped in
//   <p ... >...</p>
// This function returns an array of each paragraph, works with or without html
//   attributes present
export function splitCMSCopyOnParagraphTag(copy) {
    // filter removes empty strings that are a result of string.split with regex
    return copy.split(/(?:<p(?:.*?)>)|(?:<\/p>)/g).filter((paragraph) => paragraph !== "");
}