import DOMPurify from 'isomorphic-dompurify'

const SVG_SANITIZE_CONFIG = {
  USE_PROFILES: { svg: true, svgFilters: true },
  ADD_TAGS: [
    'use', 'defs', 'linearGradient', 'radialGradient', 'stop',
    'filter', 'feDropShadow', 'feGaussianBlur', 'feBlend', 'feComposite',
    'feMerge', 'feMergeNode', 'feColorMatrix', 'feOffset', 'feTurbulence',
    'feDisplacementMap', 'clipPath', 'mask', 'pattern', 'symbol', 'marker',
  ],
  ADD_ATTR: [
    'viewBox', 'xmlns', 'preserveAspectRatio',
    'gradientUnits', 'gradientTransform', 'spreadMethod',
    'offset', 'stop-color', 'stop-opacity',
    'x', 'y', 'width', 'height', 'fill', 'stroke', 'stroke-width',
    'opacity', 'transform', 'd', 'cx', 'cy', 'r', 'rx', 'ry',
    'x1', 'y1', 'x2', 'y2', 'points', 'class', 'id', 'href', 'xlink:href',
  ],
} as const

export function sanitizeIllustrationSvg(svg: string): string {
  if (!svg) return ''
  return DOMPurify.sanitize(svg, SVG_SANITIZE_CONFIG)
}

export function sanitizeRichHtml(html: string): string {
  if (!html) return ''
  return DOMPurify.sanitize(html, { USE_PROFILES: { html: true } })
}