Migrate most React class components to function components

This commit is contained in:
Jamie Kyle 2023-04-12 16:17:56 -07:00 committed by GitHub
parent 4c9baaef80
commit 558b5a4a38
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
23 changed files with 1444 additions and 1775 deletions

View file

@ -24,56 +24,56 @@ type PropsHousekeeping = {
export type Props = PropsData & PropsHousekeeping;
export class VerificationNotification extends React.Component<Props> {
public renderContents(): JSX.Element {
const { contact, isLocal, type, i18n } = this.props;
function VerificationNotificationContents({
contact,
isLocal,
type,
i18n,
}: Props) {
const name = (
<ContactName
key="external-1"
title={contact.title}
module="module-verification-notification__contact"
/>
);
const name = (
<ContactName
key="external-1"
title={contact.title}
module="module-verification-notification__contact"
/>
);
switch (type) {
case 'markVerified':
return isLocal ? (
<Intl
id="icu:youMarkedAsVerified"
components={{ name }}
i18n={i18n}
/>
) : (
<Intl
id="icu:youMarkedAsVerifiedOtherDevice"
components={{ name }}
i18n={i18n}
/>
);
case 'markNotVerified':
return isLocal ? (
<Intl
id="icu:youMarkedAsNotVerified"
components={{ name }}
i18n={i18n}
/>
) : (
<Intl
id="icu:youMarkedAsNotVerifiedOtherDevice"
components={{ name }}
i18n={i18n}
/>
);
default:
throw missingCaseError(type);
}
}
public override render(): JSX.Element {
const { type } = this.props;
const icon = type === 'markVerified' ? 'verified' : 'verified-not';
return <SystemMessage icon={icon} contents={this.renderContents()} />;
switch (type) {
case 'markVerified':
return isLocal ? (
<Intl id="icu:youMarkedAsVerified" components={{ name }} i18n={i18n} />
) : (
<Intl
id="icu:youMarkedAsVerifiedOtherDevice"
components={{ name }}
i18n={i18n}
/>
);
case 'markNotVerified':
return isLocal ? (
<Intl
id="icu:youMarkedAsNotVerified"
components={{ name }}
i18n={i18n}
/>
) : (
<Intl
id="icu:youMarkedAsNotVerifiedOtherDevice"
components={{ name }}
i18n={i18n}
/>
);
default:
throw missingCaseError(type);
}
}
export function VerificationNotification(props: Props): JSX.Element {
const { type } = props;
return (
<SystemMessage
icon={type === 'markVerified' ? 'verified' : 'verified-not'}
contents={<VerificationNotificationContents {...props} />}
/>
);
}