Merge commit '55e7c08a83547424024bac311d5459cb82cf6dae' into glitch-soc/merge-upstream

Conflicts:
- `app/models/user_settings.rb`:
  Upstream added a constraint on a setting textually close
  to glitch-soc-only settings.
  Applied upstream's change.
- `lib/sanitize_ext/sanitize_config.rb`:
  Upstream added support for the `translate` attribute on a few elements,
  where glitch-soc had a different set of allowed elements and attributes.
  Extended glitch-soc's allowed attributes with `translate` as upstream did.
- `spec/validators/status_length_validator_spec.rb`:
  Upstream refactored to use RSpec's `instance_double` instead of `double`,
  but glitch-soc had changes to tests due to configurable max toot chars.
  Applied upstream's changes while keeping tests against configurable max
  toot chars.

app/javascript/mastodon/features/onboarding/components/step.jsx

@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import { Check } from 'mastodon/components/check';
 import { Icon }  from 'mastodon/components/icon';
 
+import ArrowSmallRight from './arrow_small_right';
+
 const Step = ({ label, description, icon, completed, onClick, href }) => {
   const content = (
     <>
@@ -15,11 +17,9 @@ const Step = ({ label, description, icon, completed, onClick, href }) => {
         <p>{description}</p>
       </div>
 
-      {completed && (
-        <div className='onboarding__steps__item__progress'>
-          <Check />
-        </div>
-      )}
+      <div className={completed ? 'onboarding__steps__item__progress' : 'onboarding__steps__item__go'}>
+        {completed ? <Check /> : <ArrowSmallRight />}
+      </div>
     </>
   );
 

app/javascript/mastodon/features/onboarding/follows.jsx

@@ -12,20 +12,11 @@ import Column from 'mastodon/components/column';
 import ColumnBackButton from 'mastodon/components/column_back_button';
 import { EmptyAccount } from 'mastodon/components/empty_account';
 import Account from 'mastodon/containers/account_container';
-import { me } from 'mastodon/initial_state';
-import { makeGetAccount } from 'mastodon/selectors';
 
-import ProgressIndicator from './components/progress_indicator';
-
-const mapStateToProps = () => {
-  const getAccount = makeGetAccount();
-
-  return state => ({
-    account: getAccount(state, me),
-    suggestions: state.getIn(['suggestions', 'items']),
-    isLoading: state.getIn(['suggestions', 'isLoading']),
-  });
-};
+const mapStateToProps = state => ({
+  suggestions: state.getIn(['suggestions', 'items']),
+  isLoading: state.getIn(['suggestions', 'isLoading']),
+});
 
 class Follows extends PureComponent {
 
@@ -33,7 +24,6 @@ class Follows extends PureComponent {
     onBack: PropTypes.func,
     dispatch: PropTypes.func.isRequired,
     suggestions: ImmutablePropTypes.list,
-    account: ImmutablePropTypes.map,
     isLoading: PropTypes.bool,
     multiColumn: PropTypes.bool,
   };
@@ -49,7 +39,7 @@ class Follows extends PureComponent {
   }
 
   render () {
-    const { onBack, isLoading, suggestions, account, multiColumn } = this.props;
+    const { onBack, isLoading, suggestions, multiColumn } = this.props;
 
     let loadedContent;
 
@@ -58,7 +48,7 @@ class Follows extends PureComponent {
     } else if (suggestions.isEmpty()) {
       loadedContent = <div className='follow-recommendations__empty'><FormattedMessage id='onboarding.follows.empty' defaultMessage='Unfortunately, no results can be shown right now. You can try using search or browsing the explore page to find people to follow, or try again later.' /></div>;
     } else {
-      loadedContent = suggestions.map(suggestion => <Account id={suggestion.get('account')} key={suggestion.get('account')} />);
+      loadedContent = suggestions.map(suggestion => <Account id={suggestion.get('account')} key={suggestion.get('account')} withBio />);
     }
 
     return (
@@ -71,8 +61,6 @@ class Follows extends PureComponent {
             <p><FormattedMessage id='onboarding.follows.lead' defaultMessage='You curate your own home feed. The more people you follow, the more active and interesting it will be. These profiles may be a good starting point—you can always unfollow them later!' /></p>
           </div>
 
-          <ProgressIndicator steps={7} completed={account.get('following_count') * 1} />
-
           <div className='follow-recommendations'>
             {loadedContent}
           </div>

app/javascript/mastodon/features/onboarding/index.jsx

@@ -19,6 +19,7 @@ import { closeOnboarding } from 'mastodon/actions/onboarding';
 import Column from 'mastodon/features/ui/components/column';
 import { me } from 'mastodon/initial_state';
 import { makeGetAccount } from 'mastodon/selectors';
+import { assetHost } from 'mastodon/utils/config';
 
 import ArrowSmallRight from './components/arrow_small_right';
 import Step from './components/step';
@@ -122,21 +123,22 @@ class Onboarding extends ImmutablePureComponent {
           <div className='onboarding__steps'>
             <Step onClick={this.handleProfileClick} href='/settings/profile' completed={(!account.get('avatar').endsWith('missing.png')) || (account.get('display_name').length > 0 && account.get('note').length > 0)} icon='address-book-o' label={<FormattedMessage id='onboarding.steps.setup_profile.title' defaultMessage='Customize your profile' />} description={<FormattedMessage id='onboarding.steps.setup_profile.body' defaultMessage='Others are more likely to interact with you with a filled out profile.' />} />
             <Step onClick={this.handleFollowClick} completed={(account.get('following_count') * 1) >= 7} icon='user-plus' label={<FormattedMessage id='onboarding.steps.follow_people.title' defaultMessage='Find at least {count, plural, one {one person} other {# people}} to follow' values={{ count: 7 }} />} description={<FormattedMessage id='onboarding.steps.follow_people.body' defaultMessage="You curate your own home feed. Let's fill it with interesting people." />} />
-            <Step onClick={this.handleComposeClick} completed={(account.get('statuses_count') * 1) >= 1} icon='pencil-square-o' label={<FormattedMessage id='onboarding.steps.publish_status.title' defaultMessage='Make your first post' />} description={<FormattedMessage id='onboarding.steps.publish_status.body' defaultMessage='Say hello to the world.' />} />
+            <Step onClick={this.handleComposeClick} completed={(account.get('statuses_count') * 1) >= 1} icon='pencil-square-o' label={<FormattedMessage id='onboarding.steps.publish_status.title' defaultMessage='Make your first post' />} description={<FormattedMessage id='onboarding.steps.publish_status.body' defaultMessage='Say hello to the world.' values={{ emoji: <img className='emojione' alt='🐘' src={`${assetHost}/emoji/1f418.svg`} /> }} />} />
             <Step onClick={this.handleShareClick} completed={shareClicked} icon='copy' label={<FormattedMessage id='onboarding.steps.share_profile.title' defaultMessage='Share your profile' />} description={<FormattedMessage id='onboarding.steps.share_profile.body' defaultMessage='Let your friends know how to find you on Mastodon!' />} />
           </div>
 
-          <p className='onboarding__lead'><FormattedMessage id='onboarding.start.skip' defaultMessage='Want to skip right ahead?' /></p>
+          <p className='onboarding__lead'><FormattedMessage id='onboarding.start.skip' defaultMessage="Don't need help getting started?" /></p>
 
           <div className='onboarding__links'>
             <Link to='/explore' className='onboarding__link'>
+              <FormattedMessage id='onboarding.actions.go_to_explore' defaultMessage='Take me to trending' />
               <ArrowSmallRight />
-              <FormattedMessage id='onboarding.actions.go_to_explore' defaultMessage="See what's trending" />
             </Link>
-          </div>
 
-          <div className='onboarding__footer'>
-            <button className='link-button' onClick={this.handleClose}><FormattedMessage id='onboarding.actions.close' defaultMessage="Don't show this screen again" /></button>
+            <Link to='/home' className='onboarding__link'>
+              <FormattedMessage id='onboarding.actions.go_to_home' defaultMessage='Take me to my home feed' />
+              <ArrowSmallRight />
+            </Link>
           </div>
         </div>
 

app/javascript/mastodon/features/onboarding/share.jsx

@@ -177,13 +177,13 @@ class Share extends PureComponent {
 
           <div className='onboarding__links'>
             <Link to='/home' className='onboarding__link'>
+              <FormattedMessage id='onboarding.actions.go_to_home' defaultMessage='Take me to my home feed' />
               <ArrowSmallRight />
-              <FormattedMessage id='onboarding.actions.go_to_home' defaultMessage='Go to your home feed' />
             </Link>
 
             <Link to='/explore' className='onboarding__link'>
+              <FormattedMessage id='onboarding.actions.go_to_explore' defaultMessage='Take me to trending' />
               <ArrowSmallRight />
-              <FormattedMessage id='onboarding.actions.go_to_explore' defaultMessage="See what's trending" />
             </Link>
           </div>