diff --git a/src/containers/App/Content.tsx b/src/containers/App/Content.tsx index 473f06b44f..5b2293f126 100644 --- a/src/containers/App/Content.tsx +++ b/src/containers/App/Content.tsx @@ -78,14 +78,14 @@ function renderRouteSlot(slots: SlotMap, route: RouteSlot) { key={route.path} path={route.path} exact={route.exact} - render={() => { + render={(props) => { const slot = slots.get(route.slot); let content; if (!slot) { const Component = route.component; - content = ; + content = ; } else if (typeof slot.rendered === 'function') { - content = slot.rendered({component: route.component}); + content = slot.rendered({component: route.component, ...props}); } else { content = slot.rendered; } diff --git a/src/containers/App/appSlots.tsx b/src/containers/App/appSlots.tsx index 40ec2a0579..9862b637b9 100644 --- a/src/containers/App/appSlots.tsx +++ b/src/containers/App/appSlots.tsx @@ -1,6 +1,6 @@ import {createSlot} from '../../components/slots'; -import type {RedirectProps} from 'react-router'; +import type {RedirectProps, RouteComponentProps} from 'react-router'; import type Cluster from '../Cluster/Cluster'; import type {Clusters} from '../Clusters/Clusters'; import type Node from '../Node/Node'; @@ -9,22 +9,34 @@ import type TabletsFilters from '../TabletsFilters/TabletsFilters'; import type Tenant from '../Tenant/Tenant'; export const ClustersSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof Clusters}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof Clusters} & RouteComponentProps) => React.ReactNode); }>('clusters'); export const ClusterSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof Cluster}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof Cluster} & RouteComponentProps) => React.ReactNode); }>('cluster'); export const TenantSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof Tenant}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof Tenant} & RouteComponentProps) => React.ReactNode); }>('tenant'); export const NodeSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof Node}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof Node} & RouteComponentProps) => React.ReactNode); }>('node'); export const TabletSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof Tablet}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof Tablet} & RouteComponentProps) => React.ReactNode); }>('tablet'); export const TabletsFiltersSlot = createSlot<{ - children: React.ReactNode | ((props: {component: typeof TabletsFilters}) => React.ReactNode); + children: + | React.ReactNode + | ((props: {component: typeof TabletsFilters} & RouteComponentProps) => React.ReactNode); }>('tabletsFilters'); export const RoutesSlot = createSlot('routes');