Untitled

import React, { useEffect, useRef } from 'react';
import wordcloud from 'wordcloud2'; // Import wordcloud2 library

const WordCloud = ({ wordFrequency }) => {
  const wordCloudRef = useRef(null);

  useEffect(() => {
    // Convert word frequencies to an array of objects expected by wordcloud2.js
    const wordcloudData = Object.entries(wordFrequency).map(([word, frequency]) => ({ text: word, weight: frequency }));

    // Generate the word cloud
    wordcloud(wordCloudRef.current, {
      list: wordcloudData
    });

    // Cleanup function to destroy word cloud when component unmounts
    return () => {
      wordcloud(wordCloudRef.current, 'destroy');
    };
  }, [wordFrequency]); // Re-generate word cloud if wordFrequency changes

  return <div ref={wordCloudRef} style={{ width: '100%', height: '400px' }} />;
};

export default WordCloud;