import * as React from "react";
import { GlobalAutocomplete } from "../components/autocomplete";
import { Header } from "../components/header";
import GlobalLogin from "../components/login";
import GlobalToast from "../components/toast";

export default function registry(id: string) {
  const components = {
    globalheader: Header,
    globallogin: GlobalLogin,
    globaltoast: GlobalToast,
    globalautocomplete: GlobalAutocomplete,
    globalnav: ({ foo }) => (<div><button onClick={() => console.log("foo")}>{foo}</button></div>),
  };

  const lowerId = id.toLowerCase();
  if (components[lowerId]) {
    return components[lowerId];
  }

  return null;
}