import React from "react";
import {Subapp, useSubapp} from "../src/Components/Subapps/Subapps";
import {Card} from "../src/Components/Card";
import {useKernelContext} from "../src/KernelGlobalContext";
import {KernelContext} from "./DemoKernelContext";

/**
 * A demo Subapp component.
 */
export function DemoSubapp()
{
	// Get subapp close function.
	const {uuid, close} = useSubapp();

	// Get kernel context data.
	const [kernelContext] = useKernelContext(KernelContext);

	return (
		<Subapp title={"My complex subapp"}>
			<Card>
				<p>This is a complex subapp.</p>

				<p>UUID : <code>{uuid}</code></p>

				{kernelContext && <p><strong>Kernel context data</strong>: <code>{kernelContext}</code></p>}

				<button onClick={close}>Close the subapp</button>
			</Card>
		</Subapp>
	);
}
