Merge pull request #6920 from matrix-org/t3chguy/fix/17410

src/components/views/settings/tabs/room/GeneralRoomSettingsTab.tsx

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React from 'react';
+import React, { ContextType } from 'react';
 import { _t } from "../../../../../languageHandler";
 import RoomProfileSettings from "../../../room_settings/RoomProfileSettings";
 import AccessibleButton from "../../../elements/AccessibleButton";
@@ -38,9 +38,10 @@ interface IState {
 @replaceableComponent("views.settings.tabs.room.GeneralRoomSettingsTab")
 export default class GeneralRoomSettingsTab extends React.Component<IProps, IState> {
     public static contextType = MatrixClientContext;
+    context: ContextType<typeof MatrixClientContext>;
 
-    constructor(props: IProps) {
-        super(props);
+    constructor(props: IProps, context: ContextType<typeof MatrixClientContext>) {
+        super(props, context);
 
         this.state = {
             isRoomPublished: false, // loaded async
@@ -89,6 +90,18 @@ export default class GeneralRoomSettingsTab extends React.Component<IProps, ISta
             </>;
         }
 
+        let leaveSection;
+        if (room.getMyMembership() === "join") {
+            leaveSection = <>
+                <span className='mx_SettingsTab_subheading'>{ _t("Leave room") }</span>
+                <div className='mx_SettingsTab_section'>
+                    <AccessibleButton kind='danger' onClick={this.onLeaveClick}>
+                        { _t('Leave room') }
+                    </AccessibleButton>
+                </div>
+            </>;
+        }
+
         return (
             <div className="mx_SettingsTab mx_GeneralRoomSettingsTab">
                 <div className="mx_SettingsTab_heading">{ _t("General") }</div>
@@ -108,13 +121,7 @@ export default class GeneralRoomSettingsTab extends React.Component<IProps, ISta
                 <div className="mx_SettingsTab_heading">{ _t("Other") }</div>
                 { flairSection }
                 { urlPreviewSettings }
-
-                <span className='mx_SettingsTab_subheading'>{ _t("Leave room") }</span>
-                <div className='mx_SettingsTab_section'>
-                    <AccessibleButton kind='danger' onClick={this.onLeaveClick}>
-                        { _t('Leave room') }
-                    </AccessibleButton>
-                </div>
+                { leaveSection }
             </div>
         );
     }