chore: markdowntosafeHtml refactor and fix the warning

packages/features/bookings/Booker/components/EventMeta.tsx

@@ -11,7 +11,7 @@ import { EventMetaBlock } from "@calcom/features/bookings/components/event-meta/
 import { useTimePreferences } from "@calcom/features/bookings/lib";
 import type { BookerEvent } from "@calcom/features/bookings/types";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { markdownToSafeHTMLClient } from "@calcom/lib/markdownToSafeHTMLClient";
+import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
 import type { EventTypeTranslation } from "@calcom/prisma/client";
 import { EventTypeAutoTranslatedField } from "@calcom/prisma/enums";
 
@@ -159,7 +159,7 @@ export const EventMeta = ({
               <div
                 // eslint-disable-next-line react/no-danger
                 dangerouslySetInnerHTML={{
-                  __html: markdownToSafeHTMLClient(translatedDescription ?? event.description),
+                  __html: markdownToSafeHTML(translatedDescription ?? event.description),
                 }}
               />
             </EventMetaBlock>

packages/features/form-builder/FormBuilder.tsx

@@ -8,7 +8,7 @@ import { ZodError } from "zod";
 import { classNames } from "@calcom/lib";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { md } from "@calcom/lib/markdownIt";
-import { markdownToSafeHTMLClient } from "@calcom/lib/markdownToSafeHTMLClient";
+import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
 import turndown from "@calcom/lib/turndownService";
 import {
   Badge,
@@ -154,7 +154,7 @@ export const FormBuilder = function FormBuilder({
             }
 
             if (fieldsThatSupportLabelAsSafeHtml.includes(field.type)) {
-              field = { ...field, labelAsSafeHtml: markdownToSafeHTMLClient(field.label ?? "") };
+              field = { ...field, labelAsSafeHtml: markdownToSafeHTML(field.label ?? "") };
             }
             const numOptions = options?.length ?? 0;
             const firstOptionInput =
@@ -736,7 +736,7 @@ function FieldLabel({ field }: { field: RhfFormField }) {
           // eslint-disable-next-line react/no-danger
           dangerouslySetInnerHTML={{
             // Derive from field.label because label might change in b/w and field.labelAsSafeHtml will not be updated.
-            __html: markdownToSafeHTMLClient(field.label || t(field.defaultLabel || "") || ""),
+            __html: markdownToSafeHTML(field.label || t(field.defaultLabel || "") || ""),
           }}
         />
       );

packages/lib/markdownToSafeHTML.ts

@@ -1,19 +1,15 @@
+import DOMPurify from "dompurify";
 import sanitizeHtml from "sanitize-html";
 
 import { md } from "@calcom/lib/markdownIt";
 
-if (typeof window !== "undefined") {
-  // This file imports markdown parser which is a costly dependency, so we want to make sure it's not imported on the client side.
-  // It is still imported at some places on client in non-booker pages, we can gradually remove it from there and then convert it into an error
-  console.warn("`markdownToSafeHTML` should not be imported on the client side.");
-}
-
 export function markdownToSafeHTML(markdown: string | null) {
   if (!markdown) return "";
 
   const html = md.render(markdown);
 
-  const safeHTML = sanitizeHtml(html);
+  // Sanitize HTML using the appropriate library based on environment
+  const safeHTML = typeof window === "undefined" ? sanitizeHtml(html) : DOMPurify.sanitize(html);
 
   const safeHTMLWithListFormatting = safeHTML
     .replace(