import classNames from "classnames";
import { JsonAttributeTree } from "../core/JsonAttributeTree";

interface Props {
  text: string;
  className?: string;
}

export function JsonViewer({ text, className }: Props) {
  let parsed = {};
  try {
    parsed = JSON.parse(text);
  } catch {
    // Nothing yet
  }

  return (
    <div className={classNames(className, "overflow-x-auto h-full")}>
      <JsonAttributeTree attrValue={parsed} />
    </div>
  );
}