Fix Manage Restricted Join Rule Dialog for Spaces (#7208)

Author: t3chguy

src/components/views/dialogs/ManageRestrictedJoinRuleDialog.tsx

@@ -66,16 +66,28 @@ const Entry = ({ room, checked, onChange }) => {
     </label>;
 };
 
+const addAllParents = (set: Set<Room>, room: Room): void => {
+    const cli = room.client;
+    const parents = Array.from(SpaceStore.instance.getKnownParents(room.roomId)).map(parentId => cli.getRoom(parentId));
+
+    parents.forEach(parent => {
+        if (set.has(parent)) return;
+        set.add(parent);
+        addAllParents(set, parent);
+    });
+};
+
 const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [], onFinished }) => {
     const cli = room.client;
     const [newSelected, setNewSelected] = useState(new Set<string>(selected));
     const [query, setQuery] = useState("");
     const lcQuery = query.toLowerCase().trim();
 
     const [spacesContainingRoom, otherEntries] = useMemo(() => {
-        const spaces = cli.getVisibleRooms().filter(r => r.getMyMembership() === "join" && r.isSpaceRoom());
+        const parents = new Set<Room>();
+        addAllParents(parents, room);
         return [
-            spaces.filter(r => SpaceStore.instance.getSpaceFilteredRoomIds(r.roomId).has(room.roomId)),
+            Array.from(parents),
             selected.map(roomId => {
                 const room = cli.getRoom(roomId);
                 if (!room) {
@@ -86,9 +98,9 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
                 }
             }).filter(Boolean),
         ];
-    }, [cli, selected, room.roomId]);
+    }, [cli, selected, room]);
 
-    const [filteredSpacesContainingRooms, filteredOtherEntries] = useMemo(() => [
+    const [filteredSpacesContainingRoom, filteredOtherEntries] = useMemo(() => [
         spacesContainingRoom.filter(r => r.name.toLowerCase().includes(lcQuery)),
         otherEntries.filter(r => r.name.toLowerCase().includes(lcQuery)),
     ], [spacesContainingRoom, otherEntries, lcQuery]);
@@ -129,10 +141,14 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
                 autoFocus={true}
             />
             <AutoHideScrollbar className="mx_ManageRestrictedJoinRuleDialog_content">
-                { filteredSpacesContainingRooms.length > 0 ? (
+                { filteredSpacesContainingRoom.length > 0 ? (
                     <div className="mx_ManageRestrictedJoinRuleDialog_section">
-                        <h3>{ _t("Spaces you know that contain this room") }</h3>
-                        { filteredSpacesContainingRooms.map(space => {
+                        <h3>
+                            { room.isSpaceRoom()
+                                ? _t("Spaces you know that contain this space")
+                                : _t("Spaces you know that contain this room") }
+                        </h3>
+                        { filteredSpacesContainingRoom.map(space => {
                             return <Entry
                                 key={space.roomId}
                                 room={space}
@@ -164,7 +180,7 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
                     </div>
                 ) : null }
 
-                { filteredSpacesContainingRooms.length + filteredOtherEntries.length < 1
+                { filteredSpacesContainingRoom.length + filteredOtherEntries.length < 1
                     ? <span className="mx_ManageRestrictedJoinRuleDialog_noResults">
                         { _t("No results") }
                     </span>

src/i18n/strings/en_EN.json

@@ -2570,6 +2570,7 @@
     "Select spaces": "Select spaces",
     "Decide which spaces can access this room. If a space is selected, its members can find and join <RoomName/>.": "Decide which spaces can access this room. If a space is selected, its members can find and join <RoomName/>.",
     "Search spaces": "Search spaces",
+    "Spaces you know that contain this space": "Spaces you know that contain this space",
     "Spaces you know that contain this room": "Spaces you know that contain this room",
     "Other spaces or rooms you might not know": "Other spaces or rooms you might not know",
     "These are likely ones other room admins are a part of.": "These are likely ones other room admins are a part of.",