BLUE

Edit File Size: 4.37 KB

/var/www/uibuilder.cmshelp.dk/httpdocs/src/app/_components/mappers/componentMapper.ts

Text Base64

import { bannerConfig } from '../config/bannerConfig';
import { marqueeConfig } from '../config/marqueeConfig';
import MediaService from '../services/mediaService';
import { defaultProperties as textDefaultProperties, htmlTemplate as textHtmlTemplate } from '../packages/TextComponent/TextComponent';
import { v4 as uuidv4 } from 'uuid';

// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const mapBlockToComponent = (block: any) => {
  const contentTypeKey = block.contentTypeKey;
  const values = block.values;

switch (contentTypeKey) {
    case "b5386d3b-78d6-425f-a78b-4efbb9c8d4d6":
      return mapBannerComponent(values);
    case "d9169e50-d0e2-4dce-be6b-4882be6dc8ed":
      return mapMarqueeComponent(values);
    case "22fc06c9-e3d0-4e31-85f4-3c8b80d3a846":
      return mapTextComponent(values);
    default:
      return null;
  }
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const fetchMediaUrl = async (imageItem: any) => {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const mediaKey: string[] = imageItem?.value?.map((item: any) => item.mediaKey) || [];
  const imageUrl = mediaKey.length ? await MediaService.fetchImageUrls(mediaKey) : [];
  return imageUrl.length ? { url: imageUrl[0]?.urlInfos[0]?.url || "", id: imageUrl[0]?.id || "" } : { url: "", id: "" };
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const mapBannerComponent = (values: any) => {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const ctaItem = values.find((v: any) => v.alias === "bannerCta");
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const bannerCta = ctaItem?.value?.map((link: any) => ({
    text: link.name,
    href: link.url
  })) || [{ text: null, href: null }];
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const imageItem = values.find((v: any) => v.alias === "image");
  const imageUrlPromise = fetchMediaUrl(imageItem);

const bannerComponent = {
    id: "banner",
    uniqueId: `banner-${uuidv4()}`, // Use UUID instead of Date.now()
    properties: {
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      bannerTitle: values.find((v: any) => v.alias === "bannerTitle")?.value || "",
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      bannerDescription: values.find((v: any) => v.alias === "bannerDescription")?.value || "",
      bannerCta,
      image: { url: "", id: "" }
    },
    html: bannerConfig.htmlTemplate({
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      title: values.find((v: any) => v.alias === "bannerTitle")?.value || "",
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      bannerDescription: values.find((v: any) => v.alias === "bannerDescription")?.value || "",
      image: { url: "", id: "" },
      bannerCta
    })
  };

imageUrlPromise?.then((image) => {
    debugger
    bannerComponent.properties.image = image;
    bannerComponent.html = bannerConfig.htmlTemplate({
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      bannerTitle: values.find((v: any) => v.alias === "bannerTitle")?.value || "",
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      bannerDescription: values.find((v: any) => v.alias === "bannerDescription")?.value || "",
      image: image,
      bannerCta
    });
  });

return bannerComponent;
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const mapMarqueeComponent = (values: any) => {
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const marqueeText = values.find((v: any) => v.alias === "marqueeText")?.value || "";
  return {
    id: "marquee",
    uniqueId: `marquee-${uuidv4()}`, // Use UUID instead of Date.now()
    properties: {
      marqueeText: marqueeText,
      marqueeSpeed: 20
    },
    html: marqueeConfig.htmlTemplate({
      marqueeText: marqueeText,
      marqueeSpeed: 20
    })
  };
};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const mapTextComponent = (values: any) => {
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const text = values.find((v: any) => v.alias === "text")?.value || textDefaultProperties.text;
  
  return {
    id: "text",
    uniqueId: `text-${uuidv4()}`, // Use UUID instead of Date.now()
    properties: {
      text: text
    },
    html: textHtmlTemplate({
      text: text
    })
  };
};

Exit & Reset Text mode: syntax highlighting auto-detects file type.

Name	Size	Perms	Modified	Actions
componentMapper.ts	4.37 KB	lrw-r--r--	2025-03-28 11:03:48	Edit Download recursive recursive
footerMapper.ts	727 B	lrw-r--r--	2025-03-28 11:03:48	Edit Download recursive recursive
headerMapper.ts	738 B	lrw-r--r--	2025-03-28 11:03:48	Edit Download recursive recursive
pageMapper.ts	3.78 KB	lrw-r--r--	2025-03-28 11:03:48	Edit Download recursive recursive
umbracoMapper.ts	8.06 KB	lrw-r--r--	2025-03-28 11:03:48	Edit Download recursive recursive

Directory Contents