Put room settings form elements in fieldsets (#7311)
* override default fieldset styles Signed-off-by: Kerry Archibald <kerrya@element.io> * SettingsFieldset component Signed-off-by: Kerry Archibald <kerrya@element.io> * test settings fieldset Signed-off-by: Kerry Archibald <kerrya@element.io> * refactor SettingsFlag styles * use SettingsFieldset in room > securit settings * use fieldset in urlpreviewsettings Signed-off-by: Kerry Archibald <kerrya@element.io> * use SettingsFieldset in AliasSettings Signed-off-by: Kerry Archibald <kerrya@element.io> * fieldset in room > roles settings Signed-off-by: Kerry Archibald <kerrya@element.io> * css lint Signed-off-by: Kerry Archibald <kerrya@element.io> * run i18n Signed-off-by: Kerry Archibald <kerrya@element.io> * fussy order Signed-off-by: Kerry Archibald <kerrya@element.io> * default export Signed-off-by: Kerry Archibald <kerrya@element.io> * fix copyright headers Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
cba92c0e90
commit
2e3f225520
16 changed files with 385 additions and 147 deletions
|
@ -27,6 +27,7 @@ import { RoomState } from "matrix-js-sdk/src/models/room-state";
|
|||
import { compare } from "../../../../../utils/strings";
|
||||
import ErrorDialog from '../../../dialogs/ErrorDialog';
|
||||
import PowerSelector from "../../../elements/PowerSelector";
|
||||
import SettingsFieldset from '../../SettingsFieldset';
|
||||
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import SettingsStore from "../../../../../settings/SettingsStore";
|
||||
|
@ -345,17 +346,15 @@ export default class RolesRoomSettingsTab extends React.Component<IProps> {
|
|||
|
||||
if (privilegedUsers.length) {
|
||||
privilegedUsersSection =
|
||||
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
|
||||
<div className='mx_SettingsTab_subheading'>{ _t('Privileged Users') }</div>
|
||||
{ privilegedUsers }
|
||||
</div>;
|
||||
<SettingsFieldset legend={_t('Privileged Users')}>
|
||||
{ privilegedUsers }
|
||||
</SettingsFieldset>;
|
||||
}
|
||||
if (mutedUsers.length) {
|
||||
mutedUsersSection =
|
||||
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
|
||||
<div className='mx_SettingsTab_subheading'>{ _t('Muted Users') }</div>
|
||||
<SettingsFieldset legend={_t('Muted Users')}>
|
||||
{ mutedUsers }
|
||||
</div>;
|
||||
</SettingsFieldset>;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -364,8 +363,7 @@ export default class RolesRoomSettingsTab extends React.Component<IProps> {
|
|||
if (banned.length) {
|
||||
const canBanUsers = currentUserLevel >= banLevel;
|
||||
bannedUsersSection =
|
||||
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
|
||||
<div className='mx_SettingsTab_subheading'>{ _t('Banned users') }</div>
|
||||
<SettingsFieldset legend={_t('Banned users')}>
|
||||
<ul>
|
||||
{ banned.map((member) => {
|
||||
const banEvent = member.events.member.getContent();
|
||||
|
@ -383,7 +381,7 @@ export default class RolesRoomSettingsTab extends React.Component<IProps> {
|
|||
);
|
||||
}) }
|
||||
</ul>
|
||||
</div>;
|
||||
</SettingsFieldset>;
|
||||
}
|
||||
|
||||
const powerSelectors = Object.keys(powerLevelDescriptors).map((key, index) => {
|
||||
|
@ -452,15 +450,17 @@ export default class RolesRoomSettingsTab extends React.Component<IProps> {
|
|||
{ privilegedUsersSection }
|
||||
{ mutedUsersSection }
|
||||
{ bannedUsersSection }
|
||||
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
|
||||
<span className='mx_SettingsTab_subheading'>{ _t("Permissions") }</span>
|
||||
<p>{ isSpaceRoom
|
||||
? _t('Select the roles required to change various parts of the space')
|
||||
: _t('Select the roles required to change various parts of the room')
|
||||
}</p>
|
||||
<SettingsFieldset
|
||||
legend={_t("Permissions")}
|
||||
description={
|
||||
isSpaceRoom
|
||||
? _t('Select the roles required to change various parts of the space')
|
||||
: _t('Select the roles required to change various parts of the room')
|
||||
}
|
||||
>
|
||||
{ powerSelectors }
|
||||
{ eventPowerSelectors }
|
||||
</div>
|
||||
</SettingsFieldset>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue