type error in react-router-dom and react with typescript

I am a beginner in react with typescript, facing issue in following code

Here is the code of dashboard component

export default function Dashboard() {
return(
  <p>Dashboard page</p>
 )
 }

Here is code of route

const AppRouter = () => {
  return (
    <Router history={history}>
      <div>
        <Switch>
          <Route path={"/dashboard" } component={Dashboard} />

          <Route path="/" component={Login} />
        </Switch>
      </div>
    </Router>
  );
};

export default AppRouter;

In route code I am facing type issue i.e.

TypeScript error in E:/Web/src/router/route.tsx(18,51):

No overload matches this call.

Overload 1 of 2, '(props: Readonly): Route', gave the following error. Type '{ Dashboard: string; }' is not assignable to type 'ComponentClass | FunctionComponent | ComponentClass, any> | FunctionComponent<...> | undefined'.

Type '{ Dashboard: string; }' is not assignable to type 'FunctionComponent>'. Type '{ Dashboard: string; }' provides no match for the signature '(props: PropsWithChildren>, context?: any): ReactElement<...> | null'.

Overload 2 of 2, '(props: RouteProps, context?: any): Route', gave the following error. Type '{ Dashboard: string; }' is not assignable to type 'ComponentClass |FunctionComponent | ComponentClass, any> | FunctionComponent<...> | undefined'.

Type '{ Dashboard: string; }' is not assignable to type 'FunctionComponent>'. TS2769

16 |       <div>
17 |         <Switch>

18 | | ^ "