/* eslint-disable react/no-array-index-key */
import React from 'react';
import { Switch, Route, Redirect } from "react-router-dom";

function withChildrenComponent(WrapperComponent, item) {
  return function Component() {
    const routes = item.routes && renderRoutes(item.routes);
    return <WrapperComponent>{routes}</WrapperComponent>;
  }
}

export default function renderRoutes(routes) {
  return (
    <Switch>
      {routes.map((v, ix) => {
        const { component, ...rest } = v;
        let result = null;
        // 组件存在
        if (component) {
          result = (
            <Route
              key={ix}
              {...rest}
              component={withChildrenComponent(component, v)}
            />
          );
        } else if (v.redirect) {
          const { path: from, redirect: to, ...rest } = v;
          // 重定向
          result = <Redirect key={`${v.path}${ix}`} from={from} to={to} {...rest} />
        } else {
          result = <Route {...v} key={`${v.path}${ix}`} />
        }
        return result;
      })}
    </Switch>
  )
}