import React , { useEffect } from 'react' ; import { Route , Switch , useParams } from 'react-router-dom' ; import { useActions , useValues } from 'kea' ; import { GROUP_SOURCE_PRIORITIZATION_PATH , GROUP_PATH } from '../../routes' ; import { GroupOverview } from './components/group_overview' ; import { GroupSourcePrioritization } from './components/group_source_prioritization' ; import { OrgSourcesModal } from './components/org_sources_modal' ; import { GroupLogic } from './group_logic' ; export const GroupRouter = ( ) => { const { groupId } = useParams ( ) as { groupId : string ; } ; const { initializeGroup , resetGroup } = useActions ( GroupLogic ) ; const { orgSourcesModalVisible } = useValues ( GroupLogic ) ; useEffect ( ( ) => { initializeGroup ( groupId ) ; return resetGroup ; } , [ ] ) ; return ( < > < Switch > < Route path = { GROUP_SOURCE_PRIORITIZATION_PATH } > < GroupSourcePrioritization /> < /Route> < Route path = { GROUP_PATH } > < GroupOverview /> < /Route> < /Switch> { orgSourcesModalVisible && < OrgSourcesModal />} < />); } ;