Improvements to the single column layout (#10835)

* Improvements to the single column layout

- Add follows and followers link to the right panel
- Increase margins around separators in right panel
- Add follow requests link with counter when account is locked to right panel

* Redirect from getting started to home when navigation panel is visible

1 files changed, 12 insertions, 1 deletions

diff --git a/app/javascript/mastodon/features/getting_started/index.js b/app/javascript/mastodon/features/getting_started/index.js
index cb3efb57b..bafcc275b 100644
--- a/app/javascript/mastodon/features/getting_started/index.js
+++ b/app/javascript/mastodon/features/getting_started/index.js
@@ -55,10 +55,16 @@ const badgeDisplay = (number, limit) => {
   }
 };
 
+const NAVIGATION_PANEL_BREAKPOINT = 600 + (285 * 2) + (10 * 2);
+
 export default @connect(mapStateToProps, mapDispatchToProps)
 @injectIntl
 class GettingStarted extends ImmutablePureComponent {
 
+  static contextTypes = {
+    router: PropTypes.object.isRequired,
+  };
+
   static propTypes = {
     intl: PropTypes.object.isRequired,
     myAccount: ImmutablePropTypes.map.isRequired,
@@ -72,6 +78,11 @@ class GettingStarted extends ImmutablePureComponent {
   componentDidMount () {
     const { myAccount, fetchFollowRequests } = this.props;
 
+    if (window.innerWidth >= NAVIGATION_PANEL_BREAKPOINT) {
+      this.context.router.history.replace('/timelines/home');
+      return;
+    }
+
     if (myAccount.get('locked')) {
       fetchFollowRequests();
     }
@@ -123,7 +134,7 @@ class GettingStarted extends ImmutablePureComponent {
     height += 48*3;
 
     if (myAccount.get('locked')) {
-      navItems.push(<ColumnLink key={i++} icon='users' text={intl.formatMessage(messages.follow_requests)} badge={badgeDisplay(unreadFollowRequests, 40)} to='/follow_requests' />);
+      navItems.push(<ColumnLink key={i++} icon='user-plus' text={intl.formatMessage(messages.follow_requests)} badge={badgeDisplay(unreadFollowRequests, 40)} to='/follow_requests' />);
       height += 48;
     }