Fix scrolling in the navigator

This commit is contained in:
Bill 2022-08-18 00:06:52 -04:00
parent 46ff82940e
commit d30c067381
2 changed files with 5 additions and 3 deletions

View File

@ -24,6 +24,7 @@ export const NavigatorView: FC<{}> = props =>
const [ needsSearch, setNeedsSearch ] = useState(false); const [ needsSearch, setNeedsSearch ] = useState(false);
const { searchResult = null, topLevelContext = null, topLevelContexts = null, navigatorData = null } = useNavigator(); const { searchResult = null, topLevelContext = null, topLevelContexts = null, navigatorData = null } = useNavigator();
const pendingSearch = useRef<{ value: string, code: string }>(null); const pendingSearch = useRef<{ value: string, code: string }>(null);
const elementRef = useRef<HTMLDivElement>();
useRoomSessionManagerEvent<RoomSessionEvent>(RoomSessionEvent.CREATED, event => useRoomSessionManagerEvent<RoomSessionEvent>(RoomSessionEvent.CREATED, event =>
{ {
@ -158,6 +159,8 @@ export const NavigatorView: FC<{}> = props =>
if(!searchResult) return; if(!searchResult) return;
setIsLoading(false); setIsLoading(false);
if(elementRef && elementRef.current) elementRef.current.scrollTop = 0;
}, [ searchResult ]); }, [ searchResult ]);
useEffect(() => useEffect(() =>
@ -214,7 +217,7 @@ export const NavigatorView: FC<{}> = props =>
{ !isCreatorOpen && { !isCreatorOpen &&
<> <>
<NavigatorSearchView sendSearch={ sendSearch } /> <NavigatorSearchView sendSearch={ sendSearch } />
<Column overflow="auto"> <Column innerRef={ elementRef } overflow="auto">
{ (searchResult && searchResult.results.map((result, index) => <NavigatorSearchResultView key={ index } searchResult={ result } />)) } { (searchResult && searchResult.results.map((result, index) => <NavigatorSearchResultView key={ index } searchResult={ result } />)) }
</Column> </Column>
</> } </> }

View File

@ -13,7 +13,6 @@ export interface NavigatorSearchResultViewProps extends AutoGridProps
export const NavigatorSearchResultView: FC<NavigatorSearchResultViewProps> = props => export const NavigatorSearchResultView: FC<NavigatorSearchResultViewProps> = props =>
{ {
const { searchResult = null, ...rest } = props; const { searchResult = null, ...rest } = props;
const [ isExtended, setIsExtended ] = useState(true); const [ isExtended, setIsExtended ] = useState(true);
const [ displayMode, setDisplayMode ] = useState<number>(0); const [ displayMode, setDisplayMode ] = useState<number>(0);
@ -44,7 +43,7 @@ export const NavigatorSearchResultView: FC<NavigatorSearchResultViewProps> = pro
//setIsExtended(searchResult.closed); //setIsExtended(searchResult.closed);
setDisplayMode(searchResult.mode); setDisplayMode(searchResult.mode);
}, [ searchResult,props ]); }, [ searchResult ]);
const gridHasTwoColumns = (displayMode >= NavigatorSearchResultViewDisplayMode.THUMBNAILS); const gridHasTwoColumns = (displayMode >= NavigatorSearchResultViewDisplayMode.THUMBNAILS);