Space Room View should react to join rule changes down /sync

Author: t3chguy

src/components/structures/SpaceRoomView.tsx

@@ -79,6 +79,7 @@ import { useAsyncMemo } from "../../hooks/useAsyncMemo";
 import Spinner from "../views/elements/Spinner";
 import GroupAvatar from "../views/avatars/GroupAvatar";
 import { useDispatcher } from "../../hooks/useDispatcher";
+import { useRoomState } from "../../hooks/useRoomState";
 
 import { logger } from "matrix-js-sdk/src/logger";
 
@@ -124,7 +125,7 @@ const useMyRoomMembership = (room: Room) => {
 };
 
 const SpaceInfo = ({ space }) => {
- const joinRule = space.getJoinRule();
+ const joinRule = useRoomState(space, state => state.getJoinRule());
 
  let visibilitySection;
  if (joinRule === "public") {
@@ -204,8 +205,9 @@ const SpacePreview = ({ space, onJoinButtonClicked, onRejectButtonClicked }: ISp
 
  const spacesEnabled = SpaceStore.spacesEnabled;
 
+ const joinRule = useRoomState(space, state => state.getJoinRule());
  const cannotJoin = getEffectiveMembership(myMembership) === EffectiveMembership.Leave
- && space.getJoinRule() !== JoinRule.Public;
+ && joinRule !== JoinRule.Public;
 
  let inviterSection;
  let joinButtons;