From f3893245716f360302aca80ae475411211a8438c Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 17 Dec 2021 10:36:52 +0000 Subject: [PATCH] Show error if could not load space hierarchy (#7399) --- src/components/structures/SpaceHierarchy.tsx | 20 +++++++++++++------- src/i18n/strings/en_EN.json | 1 + 2 files changed, 14 insertions(+), 7 deletions(-) diff --git a/src/components/structures/SpaceHierarchy.tsx b/src/components/structures/SpaceHierarchy.tsx index f684c28ff0..9e7f1df272 100644 --- a/src/components/structures/SpaceHierarchy.tsx +++ b/src/components/structures/SpaceHierarchy.tsx @@ -477,17 +477,19 @@ export const useRoomHierarchy = (space: Room): { loading: boolean; rooms: IHierarchyRoom[]; hierarchy: RoomHierarchy; - loadMore(pageSize?: number): Promise ; + error: Error; + loadMore(pageSize?: number): Promise; } => { const [rooms, setRooms] = useState([]); const [hierarchy, setHierarchy] = useState(); + const [error, setError] = useState(); const resetHierarchy = useCallback(() => { const hierarchy = new RoomHierarchy(space, INITIAL_PAGE_SIZE); hierarchy.load().then(() => { if (space !== hierarchy.root) return; // discard stale results setRooms(hierarchy.rooms); - }); + }, setError); setHierarchy(hierarchy); }, [space]); useEffect(resetHierarchy, [resetHierarchy]); @@ -501,12 +503,12 @@ export const useRoomHierarchy = (space: Room): { const loadMore = useCallback(async (pageSize?: number) => { if (hierarchy.loading || !hierarchy.canLoadMore || hierarchy.noSupport) return; - await hierarchy.load(pageSize); + await hierarchy.load(pageSize).catch(setError); setRooms(hierarchy.rooms); }, [hierarchy]); const loading = hierarchy?.loading ?? true; - return { loading, rooms, hierarchy, loadMore }; + return { loading, rooms, hierarchy, loadMore, error }; }; const useIntersectionObserver = (callback: () => void) => { @@ -649,7 +651,7 @@ const SpaceHierarchy = ({ const [selected, setSelected] = useState(new Map>()); // Map> - const { loading, rooms, hierarchy, loadMore } = useRoomHierarchy(space); + const { loading, rooms, hierarchy, loadMore, error: hierarchyError } = useRoomHierarchy(space); const filteredRoomSet = useMemo>(() => { if (!rooms?.length) return new Set(); @@ -677,6 +679,10 @@ const SpaceHierarchy = ({ }, [rooms, hierarchy, query]); const [error, setError] = useState(""); + let errorText = error; + if (!error && hierarchyError) { + errorText = _t("Failed to load list of rooms."); + } const loaderRef = useIntersectionObserver(loadMore); @@ -759,8 +765,8 @@ const SpaceHierarchy = ({ ) } - { error &&
- { error } + { errorText &&
+ { errorText }
}