'use client';

import { useEffect } from 'react';

let spriteInjected = false;

export function EmojiSpriteProvider() {
  useEffect(() => {
    if (spriteInjected || typeof document === 'undefined') return;
    fetch('/emojis/lendry-emojis.svg')
      .then((response) => response.text())
      .then((markup) => {
        if (spriteInjected) return;
        const container = document.createElement('div');
        container.innerHTML = markup;
        container.style.display = 'none';
        container.setAttribute('aria-hidden', 'true');
        document.body.appendChild(container);
        spriteInjected = true;
      })
      .catch(() => {});
  }, []);

  return null;
}