diff --git a/src/components/Visualizations/Containers/AuthorNetworkPageContainer.tsx b/src/components/Visualizations/Containers/AuthorNetworkPageContainer.tsx index 915b52435..64a582ffe 100644 --- a/src/components/Visualizations/Containers/AuthorNetworkPageContainer.tsx +++ b/src/components/Visualizations/Containers/AuthorNetworkPageContainer.tsx @@ -49,6 +49,7 @@ interface IAuthorNetworkPageState { type AuthorNetworkPageAction = | { type: 'CHANGE_PAPER_LIMIT'; payload: number } | { type: 'SET_SELECTED'; payload: { node: IADSApiAuthorNetworkNode; dict: IBibcodeDict } } + | { type: 'DESELECT' } | { type: 'ADD_FILTER'; payload: IAuthorNetworkNodeDetails } | { type: 'REMOVE_FILTER'; payload: IAuthorNetworkNodeDetails } | { type: 'REMOVE_FILTER_TAG'; payload: ITagItem } @@ -60,6 +61,8 @@ const reducer: Reducer = (stat return { ...state, selected: null, filters: [], rowsToFetch: action.payload }; case 'SET_SELECTED': return { ...state, selected: getAuthorNetworkNodeDetails(action.payload.node, action.payload.dict) }; + case 'DESELECT': + return { ...state, selected: null }; case 'ADD_FILTER': return { ...state, filters: uniq([...state.filters, action.payload]) }; case 'REMOVE_FILTER': diff --git a/src/components/Visualizations/Panes/NetworkDetails/AuthorNetworkDetailsPane.tsx b/src/components/Visualizations/Panes/NetworkDetails/AuthorNetworkDetailsPane.tsx index 1cb6c66ed..106cde190 100644 --- a/src/components/Visualizations/Panes/NetworkDetails/AuthorNetworkDetailsPane.tsx +++ b/src/components/Visualizations/Panes/NetworkDetails/AuthorNetworkDetailsPane.tsx @@ -1,8 +1,10 @@ import { IDocsEntity } from '@api'; import { Flex, Tab, TabList, TabPanel, TabPanels, Tabs } from '@chakra-ui/react'; +import { IAuthor } from '@components/FeedbackForms'; import { Item } from '@components/ResultList/Item'; import { ILineGraph } from '@components/Visualizations/types'; -import { ReactElement, useEffect, useState } from 'react'; +import { equals } from 'ramda'; +import { memo, ReactElement, useEffect, useRef, useState } from 'react'; import { NodeDetailPane } from './NodeDetailsPane'; import { SummaryPane } from './SummaryPane'; @@ -34,9 +36,15 @@ export const AuthorNetworkDetailsPane = ({ }: AuthorNetworkDetailsProps): ReactElement => { const [tabIndex, setTabIndex] = useState(0); + // prevent tab switching during re-render + const prevNode = useRef(null); + // when selected node changes, change tab to node details useEffect(() => { - setTabIndex(node ? 1 : 0); + if (!equals(node, prevNode.current)) { + setTabIndex(node ? 1 : 0); + prevNode.current = node; + } }, [node]); const handleTabIndexChange = (index: number) => {