gnh1201/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2025-10-05 08:33:00 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Convert InlineAlert to functional component

Browse Source
This commit is contained in:
Claire 2025-03-13 10:27:38 +01:00
parent 547658f086
commit 3b3f3787d7
1 changed files with 18 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
app/javascript/mastodon/features/account/components/account_note.jsx
View File

@ -1,5 +1,5 @@
import PropTypes from 'prop-types';
import { PureComponent } from 'react';
import { useEffect, useState } from 'react';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
@ -12,38 +12,27 @@ const messages = defineMessages({
placeholder: { id: 'account_note.placeholder', defaultMessage: 'Click to add a note' },
});
class InlineAlert extends PureComponent {
const InlineAlert = ({ show }) => {
const [mountMessage, setMountMessage] = useState(false);
static propTypes = {
show: PropTypes.bool,
};
state = {
mountMessage: false,
};
static TRANSITION_DELAY = 200;
UNSAFE_componentWillReceiveProps (nextProps) {
if (!this.props.show && nextProps.show) {
this.setState({ mountMessage: true });
} else if (this.props.show && !nextProps.show) {
setTimeout(() => this.setState({ mountMessage: false }), InlineAlert.TRANSITION_DELAY);
useEffect(() => {
if (show) {
setMountMessage(true);
} else {
setTimeout(() => setMountMessage(false), 200);
}
}
}, [show, setMountMessage]);
render () {
const { show } = this.props;
const { mountMessage } = this.state;
return (
<span aria-live='polite' role='status' className='inline-alert' style={{ opacity: show ? 1 : 0 }}>
{mountMessage && <FormattedMessage id='generic.saved' defaultMessage='Saved' />}
</span>
);
};
return (
<span aria-live='polite' role='status' className='inline-alert' style={{ opacity: show ? 1 : 0 }}>
{mountMessage && <FormattedMessage id='generic.saved' defaultMessage='Saved' />}
</span>
);
}
}
InlineAlert.propTypes = {
show: PropTypes.bool,
};
class AccountNote extends ImmutablePureComponent {