reactjs : TypeScript 및 React-Router 4, 5 또는 6을 사용하여 보호 /개인 경로를 다시 작성하는 방법은 무엇입니까?

나는< PrivateRoute >반응 라우터에 설명 된대로 서류TypeScript 사용. 누구든지 나를 도울 수 있습니까?

반응 라우터 문서의 privateRoute :

const PrivateRoute= ({ component: Component, ...rest })=> (
  <Route {...rest} render={props=> (
    fakeAuth.isAuthenticated ? (
      <Component {...props}/>    ) : (
      <Redirect to={{pathname: '/login', state: { from: props.location }
   }}/>  )
 )}/>)

다음은 TypeScript 버전입니다 (작동하지 않음).

const PrivateRoute= (theProps: { path: string, component: React.SFC<RouteComponentProps<any> | undefined> | React.ComponentClass<RouteComponentProps<any> | undefined> })=> {
    return <Route path={theProps.path} render={props=> (
        fakeAuth.isAuthenticated ? (
            <React.Component {...theProps} /> <!--**** It will raise error *** -->        ) : (
                <Redirect to={{
                    pathname: '/',
                    state: { from: props.location }
                }} />            )
    )} />}

< React.Component {... thisProps} />옳지 않습니다. 오류 : NodeInvocationException : inst.render가 함수가 아닙니다. TypeError : inst.render는 함수가 아닙니다.