123456789101112131415161718192021222324252627282930313233343536373839
import React from "https://esm.sh/react";import { Container } from "../container.ts";import type { Request } from "../mod.ts";
export const options = {  // Define custom html template  template: "react.template.html",  // Define html title  title: "React SSR",};
// Define react props: https://reactjs.org/docs/components-and-props.htmlexport const props = async (request: Request) => {  const container: Container = request.container;  return {    params: request.getParams(),    header: "Click me!",    repository: await container.repository,  };};
// Define component: https://reactjs.org/docs/components-and-props.htmlconst App = (props: { params: string[]; header: string }) => {  const [count, setCount] = React.useState(0);  return (    <div>      <h2>{props.header}</h2>      <p>        This page was created using Deno, Fastro and React's server-side        rendering (SSR). Click to try the react hook.      </p>      <button onClick={() => setCount(count + 1)}>Click me</button>      <p>You clicked me {count} times</p>    </div>  );};
export default App;