import { withAuth } from "auth/hoc/withAuth";
import React from "react";
import { RouteObject, useRoutes } from "react-router-dom";
import { RoutePathDefinition } from "routes";
import { mapDefinitionToRoute } from "routes/mapDefinitionToRoute";

type Props = {
  routes: RoutePathDefinition[];
};


const RoutesRenderer = ({ routes }: Props) => {

  const mappedRoutes = React.useMemo<RouteObject[]>( () => {
    return routes.map<RouteObject>((props) => mapDefinitionToRoute(props));
  }, [routes]);

  const Renderer = useRoutes(mappedRoutes);
  return Renderer;
}

export default withAuth(RoutesRenderer);
