Change onboarding flow in web UI (#32998)

app/javascript/mastodon/features/explore/suggestions.jsx

@@ -5,7 +5,6 @@ import { FormattedMessage } from 'react-intl';
 
 import { withRouter } from 'react-router-dom';
 
-import ImmutablePropTypes from 'react-immutable-proptypes';
 import { connect } from 'react-redux';
 
 import { fetchSuggestions } from 'mastodon/actions/suggestions';
@@ -15,15 +14,15 @@ import { WithRouterPropTypes } from 'mastodon/utils/react_router';
 import { Card } from './components/card';
 
 const mapStateToProps = state => ({
-  suggestions: state.getIn(['suggestions', 'items']),
-  isLoading: state.getIn(['suggestions', 'isLoading']),
+  suggestions: state.suggestions.items,
+  isLoading: state.suggestions.isLoading,
 });
 
 class Suggestions extends PureComponent {
 
   static propTypes = {
     isLoading: PropTypes.bool,
-    suggestions: ImmutablePropTypes.list,
+    suggestions: PropTypes.array,
     dispatch: PropTypes.func.isRequired,
     ...WithRouterPropTypes,
   };
@@ -32,17 +31,17 @@ class Suggestions extends PureComponent {
     const { dispatch, suggestions, history } = this.props;
 
     // If we're navigating back to the screen, do not trigger a reload
-    if (history.action === 'POP' && suggestions.size > 0) {
+    if (history.action === 'POP' && suggestions.length > 0) {
       return;
     }
 
-    dispatch(fetchSuggestions(true));
+    dispatch(fetchSuggestions());
   }
 
   render () {
     const { isLoading, suggestions } = this.props;
 
-    if (!isLoading && suggestions.isEmpty()) {
+    if (!isLoading && suggestions.length === 0) {
       return (
         <div className='explore__suggestions scrollable scrollable--flex'>
           <div className='empty-column-indicator'>
@@ -56,9 +55,9 @@ class Suggestions extends PureComponent {
       <div className='explore__suggestions scrollable' data-nosnippet>
         {isLoading ? <LoadingIndicator /> : suggestions.map(suggestion => (
           <Card
-            key={suggestion.get('account')}
-            id={suggestion.get('account')}
-            source={suggestion.getIn(['sources', 0])}
+            key={suggestion.account_id}
+            id={suggestion.account_id}
+            source={suggestion.sources[0]}
           />
         ))}
       </div>