"use client";

import { SchemaValue } from "@/components/MessagesTable/components/SchemaValue";
import {
  Flex,
  FlexItem,
  PageSection,
  Title,
} from "@/libs/patternfly/react-core";

export function ConnectedSchema({
  content,
  name,
}: {
  content: string;
  name: string;
}) {
  return (
    <PageSection hasBodyWrapper={false}>
      <Flex direction={{ default: "column" }} gap={{ default: "gap2xl" }}>
        <FlexItem>
          <Title headingLevel={"h4"}>{name}</Title>
        </FlexItem>
        <FlexItem>
          <SchemaValue schema={content} name={name} />
        </FlexItem>
      </Flex>
    </PageSection>
  );
}
