PingPongViewsPage

PingPongViewsPage.tsx

import { PingPongChannelApi } from "ping-pong-view/dist/api";

let pings = 0;
let pongs = 0;

export function PingPongViewsPage() {
  const [lastPing, setLastPing] = useState<string>("-");
  const [lastPong, setLastPong] = useState<string>("-");

  const api: PingPongChannelApi = useMemo(() => {
    return {
      pingPongView__ping(source: string) {
        pings++;
        setLastPing(source);
      },
      pingPongView__pong(source: string, replyingTo: string) {
        pongs++;
        setLastPong(source);
      },
    };
  }, [pings, pongs]);
   
  // ...
}