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

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

	// Get kernel application custom data.
	const [kernelApplicationData] = useKernelApplicationData("customData", "");

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

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

				{kernelApplicationData && <p><strong>Kernel application data</strong>: <code>{kernelApplicationData}</code></p>}

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