import * as React from 'react' ; import { useEffect , useMemo } from 'react' ; import { useDispatch , useSelector } from 'react-redux' ; import { Route , Switch } from 'react-router-dom' ; import WithPermissions from '../auth/WithPermissions' ; import { registerResource , unregisterResource } from '../actions' ; import { ResourceProps , ResourceMatch , ReduxState } from '../types' ; import { ResourceContextProvider } from './ResourceContextProvider' ; const defaultOptions = { } ; const ResourceRegister = ( props ) => { const { name , list , create , edit , show , icon , options = defaultOptions , } = props ; const dispatch = useDispatch ( ) ; useEffect ( ( ) => { dispatch ( registerResource ( { name , options , hasList : ! ! list , hasEdit : ! ! edit , hasShow : ! ! show , hasCreate : ! ! create , icon , } ) ) ; return ( ) => { dispatch ( unregisterResource ( name ) ) ; } ; } , [ dispatch , name , create , edit , icon , list , show , options ] ) ; return null ; } ; const ResourceRoutes = ( props ) => { const { name , match , list , create , edit , show , options = defaultOptions , } = props ; const isRegistered = useSelector ( ( state ) => ! ! state . admin . resources [ name ] ) ; const basePath = match ? match . path : '' ; const resourceData = useMemo ( ( ) => ( { resource : name , options , hasList : ! ! list , hasEdit : ! ! edit , hasShow : ! ! show , hasCreate : ! ! create , } ) , [ name , options , create , edit , list , show ] ) ; return useMemo ( ( ) => { if ( ! isRegistered ) { return null ; } return ( < ResourceContextProvider value = { name } > < Switch > { create && ( < Route path = { `${ basePath }/create` } render = { routeProps => ( < WithPermissions component = { create } basePath = { basePath } { ... routeProps } { ... resourceData } />)}/ > ) } { show && ( < Route path = { `${ basePath }/:id/show` } render = { routeProps => ( < WithPermissions component = { show } basePath = { basePath } id = { decodeURIComponent ( ( routeProps . match as ResourceMatch ) . params . id ) } { ... routeProps } { ... resourceData } />)}/ > ) } { edit && ( < Route path = { `${ basePath }/:id` } render = { routeProps => ( < WithPermissions component = { edit } basePath = { basePath } id = { decodeURIComponent ( ( routeProps . match as ResourceMatch ) . params . id ) } { ... routeProps } { ... resourceData } />)}/ > ) } { list && ( < Route path = { `${ basePath }` } render = { routeProps => ( < WithPermissions component = { list } basePath = { basePath } { ... routeProps } { ... resourceData } syncWithLocation / > ) } />)} < /Switch> < /ResourceContextProvider>); } , [ basePath , name , create , edit , list , show , options , isRegistered ] ) ; } ; const Resource = ( props ) => { const { intent = 'route' , ... rest } = props ; return intent === 'registration' ? ( < ResourceRegister { ... rest } / > ) : ( < ResourceRoutes { ... rest } / > ) ; } ; export default Resource ;