import React from "react";

export function FormattedText({ text }: { text: string }) {
  const lines = text.split('\n');
  const urlRegex = /(https?:\/\/[^\s]+)/g;

  return (
    <>
      {lines.map((line, i) => {
        const parts = line.split(urlRegex);
        return (
          <React.Fragment key={i}>
            {i > 0 && <br />}
            {parts.map((part, j) => {
              if (part.match(urlRegex)) {
                return (
                  <a
                    key={j}
                    href={part}
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-primary hover:underline underline-offset-4"
                    onClick={(e) => e.stopPropagation()}
                  >
                    {part}
                  </a>
                );
              }
              return part;
            })}
          </React.Fragment>
        );
      })}
    </>
  );
}