Fix account notes not being displayed (#34166)

app/javascript/mastodon/features/account/components/account_note.jsx

@@ -4,7 +4,6 @@ import { PureComponent } from 'react';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 
 import { is } from 'immutable';
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 import Textarea from 'react-textarea-autosize';
@@ -49,7 +48,7 @@ class InlineAlert extends PureComponent {
 class AccountNote extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.record.isRequired,
+    accountId: PropTypes.string.isRequired,
     value: PropTypes.string,
     onSave: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
@@ -66,7 +65,7 @@ class AccountNote extends ImmutablePureComponent {
   }
 
   UNSAFE_componentWillReceiveProps (nextProps) {
-    const accountWillChange = !is(this.props.account, nextProps.account);
+    const accountWillChange = !is(this.props.accountId, nextProps.accountId);
     const newState = {};
 
     if (accountWillChange && this._isDirty()) {
@@ -141,21 +140,21 @@ class AccountNote extends ImmutablePureComponent {
   }
 
   render () {
-    const { account, intl } = this.props;
+    const { accountId, intl } = this.props;
     const { value, saved } = this.state;
 
-    if (!account) {
+    if (!accountId) {
       return null;
     }
 
     return (
       <div className='account__header__account-note'>
-        <label htmlFor={`account-note-${account.get('id')}`}>
+        <label htmlFor={`account-note-${accountId}`}>
           <FormattedMessage id='account.account_note_header' defaultMessage='Personal note' /> <InlineAlert show={saved} />
         </label>
 
         <Textarea
-          id={`account-note-${account.get('id')}`}
+          id={`account-note-${accountId}`}
           className='account__header__account-note__content'
           disabled={this.props.value === null || value === null}
           placeholder={intl.formatMessage(messages.placeholder)}

app/javascript/mastodon/features/account/containers/account_note_container.js

@@ -4,14 +4,14 @@ import { submitAccountNote } from 'mastodon/actions/account_notes';
 
 import AccountNote from '../components/account_note';
 
-const mapStateToProps = (state, { account }) => ({
-  value: account.getIn(['relationship', 'note']),
+const mapStateToProps = (state, { accountId }) => ({
+  value: state.relationships.getIn([accountId, 'note']),
 });
 
-const mapDispatchToProps = (dispatch, { account }) => ({
+const mapDispatchToProps = (dispatch, { accountId }) => ({
 
   onSave (value) {
-    dispatch(submitAccountNote({ accountId: account.get('id'), note: value }));
+    dispatch(submitAccountNote({ accountId: accountId, note: value }));
   },
 
 });

app/javascript/mastodon/features/account_timeline/components/account_header.tsx

@@ -919,7 +919,7 @@ export const AccountHeader: React.FC<{
                 onClickCapture={handleLinkClick}
               >
                 {account.id !== me && signedIn && (
-                  <AccountNoteContainer account={account} />
+                  <AccountNoteContainer accountId={accountId} />
                 )}
 
                 {account.note.length > 0 && account.note !== '<p></p>' && (