import { ReactElement } from "react";
import { useSearchParams } from "react-router-dom";

export interface IQueryRouterProps {
  mapping: Record<string, ReactElement>;
};

export const QueryRouter = ({ mapping }: IQueryRouterProps): ReactElement => {
  const [params] = useSearchParams();
  let element: ReactElement | null = null;

  for (const key of params.keys()) {
    if (mapping[key]) {
      element = mapping[key];
      break;
    }
  }

  if (element === null) {
    throw new Error("missing mapping");
  }

  return element;
};
