imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Disable profile controls if the HS doesn't allow them to be set (#12652)

Browse source 
* Disable profile controls if the HS doesn't allow them to be set

Also updates to the js-sdk interface changes in https://github.com/matrix-org/matrix-js-sdk/pull/4246

* Remove unnecessary await

* Pass disabled prop to accessiblebutton in avatarsetting

* Use getCapabilities

in case there are no cached capabilities

* Fix test

* Go back to just using getCapabilities

Rather than change the other places
This commit is contained in:
David Baker 2024-07-02 11:04:07 +01:00 • committed by GitHub
parent 922676a7cc
commit 510fb1ba2f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 42 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/views/settings/AvatarSetting.tsx
View file

@ -170,6 +170,7 @@ const AvatarSetting: React.FC<IProps> = ({
aria-labelledby={disabled ? undefined : a11yId}
// Inhibit tab stop as we have explicit upload/remove buttons
tabIndex={-1}
disabled={disabled}
>
<BaseAvatar idName={placeholderId} name={placeholderName} size="90px" />
</AccessibleButton>
@ -184,6 +185,7 @@ const AvatarSetting: React.FC<IProps> = ({
onClick={uploadAvatar}
// Inhibit tab stop as we have explicit upload/remove buttons
tabIndex={-1}
disabled={disabled}
/>
);
}

19
src/components/views/settings/UserProfileSettings.tsx
View file

@ -55,10 +55,17 @@ const UsernameBox: React.FC<UsernameBoxProps> = ({ username }) => {
);
};
interface UserProfileSettingsProps {
// Whether the homeserver allows the user to set their display name.
canSetDisplayName: boolean;
// Whether the homeserver allows the user to set their avatar.
canSetAvatar: boolean;
}
/**
* A group of settings views to allow the user to set their profile information.
*/
const UserProfileSettings: React.FC = () => {
const UserProfileSettings: React.FC<UserProfileSettingsProps> = ({ canSetDisplayName, canSetAvatar }) => {
const [avatarURL, setAvatarURL] = useState(OwnProfileStore.instance.avatarMxc);
const [displayName, setDisplayName] = useState(OwnProfileStore.instance.displayName ?? "");
const [initialDisplayName, setInitialDisplayName] = useState(OwnProfileStore.instance.displayName ?? "");
@ -143,10 +150,16 @@ const UserProfileSettings: React.FC = () => {
[client],
);
const someFieldsDisabled = !canSetDisplayName || !canSetAvatar;
return (
<div className="mx_UserProfileSettings">
<h2>{_t("common|profile")}</h2>
<div>{_t("settings|general|profile_subtitle")}</div>
<div>
{someFieldsDisabled
? _t("settings|general|profile_subtitle_oidc")
: _t("settings|general|profile_subtitle")}
</div>
<div className="mx_UserProfileSettings_profile">
<AvatarSetting
avatar={avatarURL ?? undefined}
@ -155,6 +168,7 @@ const UserProfileSettings: React.FC = () => {
removeAvatar={avatarURL ? onAvatarRemove : undefined}
placeholderName={displayName}
placeholderId={client.getUserId() ?? ""}
disabled={!canSetAvatar}
/>
<EditInPlace
className="mx_UserProfileSettings_profile_displayName"
@ -169,6 +183,7 @@ const UserProfileSettings: React.FC = () => {
onCancel={onDisplayNameCancel}
onSave={onDisplayNameSave}
error={displayNameError ? _t("settings|general|display_name_error") : undefined}
disabled={!canSetDisplayName}
/>
</div>
{avatarError && (

23
src/components/views/settings/tabs/user/GeneralUserSettingsTab.tsx
View file

@ -56,6 +56,8 @@ interface IState {
idServerName?: string;
externalAccountManagementUrl?: string;
canMake3pidChanges: boolean;
canSetDisplayName: boolean;
canSetAvatar: boolean;
}
export default class GeneralUserSettingsTab extends React.Component<IProps, IState> {
@ -72,6 +74,8 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
spellCheckLanguages: [],
canChangePassword: false,
canMake3pidChanges: false,
canSetDisplayName: false,
canSetAvatar: false,
};
this.getCapabilities();
@ -95,7 +99,7 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
private async getCapabilities(): Promise<void> {
const cli = this.context.client!;
const capabilities = await cli.getCapabilities(); // this is cached
const capabilities = (await cli.getCapabilities()) ?? {};
const changePasswordCap = capabilities["m.change_password"];
// You can change your password so long as the capability isn't explicitly disabled. The implicit
@ -110,7 +114,17 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
// so the behaviour for when it is missing has to be assume true
const canMake3pidChanges = !capabilities["m.3pid_changes"] || capabilities["m.3pid_changes"].enabled === true;
this.setState({ canChangePassword, externalAccountManagementUrl, canMake3pidChanges });
const canSetDisplayName =
!capabilities["m.set_displayname"] || capabilities["m.set_displayname"].enabled === true;
const canSetAvatar = !capabilities["m.set_avatar_url"] || capabilities["m.set_avatar_url"].enabled === true;
this.setState({
canChangePassword,
externalAccountManagementUrl,
canMake3pidChanges,
canSetDisplayName,
canSetAvatar,
});
}
private onLanguageChange = (newLanguage: string): void => {
@ -309,7 +323,10 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
return (
<SettingsTab data-testid="mx_GeneralUserSettingsTab">
<SettingsSection>
<UserProfileSettings />
<UserProfileSettings
canSetDisplayName={this.state.canSetDisplayName}
canSetAvatar={this.state.canSetAvatar}
/>
<UserPersonalInfoSettings canMake3pidChanges={this.state.canMake3pidChanges} />
{this.renderAccountSection()}
{this.renderLanguageSection()}