Disable 3pid fields in settings when m.3pid_changes capability is disabled (#11430)

* check m.3pid_changes capability in user settings

* comments

* assume 3pid_changes is true for older evrsions
This commit is contained in:
Kerry 2023-08-22 18:07:10 +12:00 committed by GitHub
parent dfded8d4d3
commit 5c1b62cf99
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 440 additions and 18 deletions

View file

@ -44,6 +44,10 @@ that is available.
interface IExistingEmailAddressProps {
email: ThirdPartyIdentifier;
onRemoved: (emails: ThirdPartyIdentifier) => void;
/**
* Disallow removal of this email address when truthy
*/
disabled?: boolean;
}
interface IExistingEmailAddressState {
@ -121,7 +125,7 @@ export class ExistingEmailAddress extends React.Component<IExistingEmailAddressP
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">
{this.props.email.address}
</span>
<AccessibleButton onClick={this.onRemove} kind="danger_sm">
<AccessibleButton onClick={this.onRemove} kind="danger_sm" disabled={this.props.disabled}>
{_t("Remove")}
</AccessibleButton>
</div>
@ -132,6 +136,10 @@ export class ExistingEmailAddress extends React.Component<IExistingEmailAddressP
interface IProps {
emails: ThirdPartyIdentifier[];
onEmailsChange: (emails: ThirdPartyIdentifier[]) => void;
/**
* Adding or removing emails is disabled when truthy
*/
disabled?: boolean;
}
interface IState {
@ -248,11 +256,18 @@ export default class EmailAddresses extends React.Component<IProps, IState> {
public render(): React.ReactNode {
const existingEmailElements = this.props.emails.map((e) => {
return <ExistingEmailAddress email={e} onRemoved={this.onRemoved} key={e.address} />;
return (
<ExistingEmailAddress
email={e}
onRemoved={this.onRemoved}
key={e.address}
disabled={this.props.disabled}
/>
);
});
let addButton = (
<AccessibleButton onClick={this.onAddClick} kind="primary">
<AccessibleButton onClick={this.onAddClick} kind="primary" disabled={this.props.disabled}>
{_t("Add")}
</AccessibleButton>
);
@ -283,7 +298,7 @@ export default class EmailAddresses extends React.Component<IProps, IState> {
type="text"
label={_t("Email Address")}
autoComplete="email"
disabled={this.state.verifying}
disabled={this.props.disabled || this.state.verifying}
value={this.state.newEmailAddress}
onChange={this.onChangeNewEmailAddress}
/>

View file

@ -39,6 +39,10 @@ This is a copy/paste of EmailAddresses, mostly.
interface IExistingPhoneNumberProps {
msisdn: ThirdPartyIdentifier;
onRemoved: (phoneNumber: ThirdPartyIdentifier) => void;
/**
* Disable removing phone number
*/
disabled?: boolean;
}
interface IExistingPhoneNumberState {
@ -116,7 +120,7 @@ export class ExistingPhoneNumber extends React.Component<IExistingPhoneNumberPro
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">
+{this.props.msisdn.address}
</span>
<AccessibleButton onClick={this.onRemove} kind="danger_sm">
<AccessibleButton onClick={this.onRemove} kind="danger_sm" disabled={this.props.disabled}>
{_t("Remove")}
</AccessibleButton>
</div>
@ -127,6 +131,10 @@ export class ExistingPhoneNumber extends React.Component<IExistingPhoneNumberPro
interface IProps {
msisdns: ThirdPartyIdentifier[];
onMsisdnsChange: (phoneNumbers: ThirdPartyIdentifier[]) => void;
/**
* Adding or removing phone numbers is disabled when truthy
*/
disabled?: boolean;
}
interface IState {
@ -251,11 +259,18 @@ export default class PhoneNumbers extends React.Component<IProps, IState> {
public render(): React.ReactNode {
const existingPhoneElements = this.props.msisdns.map((p) => {
return <ExistingPhoneNumber msisdn={p} onRemoved={this.onRemoved} key={p.address} />;
return (
<ExistingPhoneNumber
msisdn={p}
onRemoved={this.onRemoved}
key={p.address}
disabled={this.props.disabled}
/>
);
});
let addVerifySection = (
<AccessibleButton onClick={this.onAddClick} kind="primary">
<AccessibleButton onClick={this.onAddClick} kind="primary" disabled={this.props.disabled}>
{_t("Add")}
</AccessibleButton>
);
@ -277,14 +292,18 @@ export default class PhoneNumbers extends React.Component<IProps, IState> {
type="text"
label={_t("Verification code")}
autoComplete="off"
disabled={this.state.continueDisabled}
disabled={this.props.disabled || this.state.continueDisabled}
value={this.state.newPhoneNumberCode}
onChange={this.onChangeNewPhoneNumberCode}
/>
<AccessibleButton
onClick={this.onContinueClick}
kind="primary"
disabled={this.state.continueDisabled || this.state.newPhoneNumberCode.length === 0}
disabled={
this.props.disabled ||
this.state.continueDisabled ||
this.state.newPhoneNumberCode.length === 0
}
>
{_t("Continue")}
</AccessibleButton>
@ -313,7 +332,7 @@ export default class PhoneNumbers extends React.Component<IProps, IState> {
type="text"
label={_t("Phone Number")}
autoComplete="tel-national"
disabled={this.state.verifying}
disabled={this.props.disabled || this.state.verifying}
prefixComponent={phoneCountry}
value={this.state.newPhoneNumber}
onChange={this.onChangeNewPhoneNumber}

View file

@ -46,6 +46,7 @@ TODO: Reduce all the copying between account vs. discovery components.
interface IEmailAddressProps {
email: ThirdPartyIdentifier;
disabled?: boolean;
}
interface IEmailAddressState {
@ -194,6 +195,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
kind="danger_sm"
onClick={this.onRevokeClick}
disabled={this.props.disabled}
>
{_t("Revoke")}
</AccessibleButton>
@ -204,6 +206,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
kind="primary_sm"
onClick={this.onShareClick}
disabled={this.props.disabled}
>
{_t("Share")}
</AccessibleButton>
@ -221,6 +224,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
interface IProps {
emails: ThirdPartyIdentifier[];
isLoading?: boolean;
disabled?: boolean;
}
export default class EmailAddresses extends React.Component<IProps> {
@ -230,7 +234,7 @@ export default class EmailAddresses extends React.Component<IProps> {
content = <InlineSpinner />;
} else if (this.props.emails.length > 0) {
content = this.props.emails.map((e) => {
return <EmailAddress email={e} key={e.address} />;
return <EmailAddress email={e} key={e.address} disabled={this.props.disabled} />;
});
}

View file

@ -38,6 +38,7 @@ This is a copy/paste of EmailAddresses, mostly.
interface IPhoneNumberProps {
msisdn: ThirdPartyIdentifier;
disabled?: boolean;
}
interface IPhoneNumberState {
@ -202,6 +203,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
kind="danger_sm"
onClick={this.onRevokeClick}
disabled={this.props.disabled}
>
{_t("Revoke")}
</AccessibleButton>
@ -212,6 +214,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
kind="primary_sm"
onClick={this.onShareClick}
disabled={this.props.disabled}
>
{_t("Share")}
</AccessibleButton>
@ -230,6 +233,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
interface IProps {
msisdns: ThirdPartyIdentifier[];
isLoading?: boolean;
disabled?: boolean;
}
export default class PhoneNumbers extends React.Component<IProps> {
@ -239,7 +243,7 @@ export default class PhoneNumbers extends React.Component<IProps> {
content = <InlineSpinner />;
} else if (this.props.msisdns.length > 0) {
content = this.props.msisdns.map((e) => {
return <PhoneNumber msisdn={e} key={e.address} />;
return <PhoneNumber msisdn={e} key={e.address} disabled={this.props.disabled} />;
});
}

View file

@ -91,6 +91,7 @@ interface IState {
canChangePassword: boolean;
idServerName?: string;
externalAccountManagementUrl?: string;
canMake3pidChanges: boolean;
}
export default class GeneralUserSettingsTab extends React.Component<IProps, IState> {
@ -120,6 +121,7 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
msisdns: [],
loading3pids: true, // whether or not the emails and msisdns have been loaded
canChangePassword: false,
canMake3pidChanges: false,
};
this.dispatcherRef = dis.register(this.onAction);
@ -174,8 +176,12 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
const canChangePassword = !changePasswordCap || changePasswordCap["enabled"] !== false;
const externalAccountManagementUrl = getDelegatedAuthAccountUrl(cli.getClientWellKnown());
// https://spec.matrix.org/v1.7/client-server-api/#m3pid_changes-capability
// We support as far back as v1.1 which doesn't have m.3pid_changes
// 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 });
this.setState({ canChangePassword, externalAccountManagementUrl, canMake3pidChanges });
}
private async getThreepidState(): Promise<void> {
@ -323,12 +329,20 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
const emails = this.state.loading3pids ? (
<InlineSpinner />
) : (
<AccountEmailAddresses emails={this.state.emails} onEmailsChange={this.onEmailsChange} />
<AccountEmailAddresses
emails={this.state.emails}
onEmailsChange={this.onEmailsChange}
disabled={!this.state.canMake3pidChanges}
/>
);
const msisdns = this.state.loading3pids ? (
<InlineSpinner />
) : (
<AccountPhoneNumbers msisdns={this.state.msisdns} onMsisdnsChange={this.onMsisdnsChange} />
<AccountPhoneNumbers
msisdns={this.state.msisdns}
onMsisdnsChange={this.onMsisdnsChange}
disabled={!this.state.canMake3pidChanges}
/>
);
threepidSection = (
<>
@ -463,8 +477,16 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
const threepidSection = this.state.haveIdServer ? (
<>
<DiscoveryEmailAddresses emails={this.state.emails} isLoading={this.state.loading3pids} />
<DiscoveryPhoneNumbers msisdns={this.state.msisdns} isLoading={this.state.loading3pids} />
<DiscoveryEmailAddresses
emails={this.state.emails}
isLoading={this.state.loading3pids}
disabled={!this.state.canMake3pidChanges}
/>
<DiscoveryPhoneNumbers
msisdns={this.state.msisdns}
isLoading={this.state.loading3pids}
disabled={!this.state.canMake3pidChanges}
/>
</>
) : null;