cartesi / rollups-explorer / 15725286037

"use client";

import { CodeHighlight } from "@mantine/code-highlight";

} from "@mantine/core";

import { decodePayload } from "../decoder";

import { useSpecFormContext } from "../form/context";

import { buildSpecification, stringifyContent } from "../utils";

import { isNilOrEmpty } from "ramda-adjunct";

export const DecodingPreview = () => {

    const form = useSpecFormContext();

    const values = form.getTransformedValues();

    const { encodedData } = values;

    const tempSpec = buildSpecification(values);

    const envelope =

        tempSpec && encodedData ? decodePayload(tempSpec, encodedData) : null;

    const content = envelope?.result ? stringifyContent(envelope.result) : null;

    const theme = useMantineTheme();

    const headerHeight = themeDefaultProps?.header.height;

    const cardTop = !isNilOrEmpty(headerHeight)

    return (

        <Card shadow="sm" withBorder pos="sticky" top={cardTop}>

            <Title order={3}>Preview</Title>

            <Stack gap="lg">

                <Textarea

                    resize="vertical"

                    rows={5}

                    label="Data"

                    id="encoded-data-preview"

                    description="Encoded data to test against specification"

                    {...form.getInputProps("encodedData")}

                />

                {content && (

                    <CodeHighlight

                        data-testid="preview-decoded-data"

                        withCopyButton={false}

                        language="json"

                        code={content}

                    />

            </Stack>

        </Card>

};