From b1571b1e1d679c227aecfdb5d3b599d68f875b64 Mon Sep 17 00:00:00 2001
From: Billie Thompson <billie@purplebooth.co.uk>
Date: Sat, 28 Jan 2017 23:49:42 +0000
Subject: Add missing back button to "Follow Requests"

Currently we have the problem where the follow request button is missing
from the Follow request tab. This means that when you visit that tab you
either have to press the back button in the browser or re-enter the home
page, which breaks the app flow.

This will resolve that issue by adding a new back button to that tab,
in the same way that the public timeline, and favourites have.
---
 app/assets/javascripts/components/features/follow_requests/index.jsx | 2 ++
 1 file changed, 2 insertions(+)

(limited to 'app/assets/javascripts/components/features/follow_requests/index.jsx')

diff --git a/app/assets/javascripts/components/features/follow_requests/index.jsx b/app/assets/javascripts/components/features/follow_requests/index.jsx
index 461370999..5c60b6028 100644
--- a/app/assets/javascripts/components/features/follow_requests/index.jsx
+++ b/app/assets/javascripts/components/features/follow_requests/index.jsx
@@ -4,6 +4,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import LoadingIndicator from '../../components/loading_indicator';
 import { ScrollContainer } from 'react-router-scroll';
 import Column from '../ui/components/column';
+import ColumnBackButton from '../../components/column_back_button';
 import AccountAuthorizeContainer from './containers/account_authorize_container';
 import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
 import { defineMessages, injectIntl } from 'react-intl';
@@ -51,6 +52,7 @@ const FollowRequests = React.createClass({
 
     return (
       <Column icon='users' heading={intl.formatMessage(messages.heading)}>
+        <ColumnBackButton />
         <ScrollContainer scrollKey='follow_requests'>
           <div className='scrollable' onScroll={this.handleScroll}>
             {accountIds.map(id =>
-- 
cgit 


From 9bde804ba2fe9ea934e702367b13461fb8da431f Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Mon, 30 Jan 2017 15:22:04 +0100
Subject: Resolve confusion between ColumnBackButton and the slim version that
 the public timeline has been using

---
 .../components/column_back_button_slim.jsx         | 46 ++++++++++++++++++++++
 .../features/favourited_statuses/index.jsx         |  4 +-
 .../components/features/follow_requests/index.jsx  |  4 +-
 .../components/features/hashtag_timeline/index.jsx | 12 +++---
 .../components/column_back_button.jsx              | 46 ----------------------
 .../components/features/public_timeline/index.jsx  | 12 +++---
 6 files changed, 62 insertions(+), 62 deletions(-)
 create mode 100644 app/assets/javascripts/components/components/column_back_button_slim.jsx
 delete mode 100644 app/assets/javascripts/components/features/public_timeline/components/column_back_button.jsx

(limited to 'app/assets/javascripts/components/features/follow_requests/index.jsx')

diff --git a/app/assets/javascripts/components/components/column_back_button_slim.jsx b/app/assets/javascripts/components/components/column_back_button_slim.jsx
new file mode 100644
index 000000000..cdbe13505
--- /dev/null
+++ b/app/assets/javascripts/components/components/column_back_button_slim.jsx
@@ -0,0 +1,46 @@
+import PureRenderMixin from 'react-addons-pure-render-mixin';
+import { FormattedMessage } from 'react-intl';
+
+const outerStyle = {
+  position: 'absolute',
+  right: '0',
+  top: '-48px',
+  padding: '15px',
+  fontSize: '16px',
+  background: '#2f3441',
+  flex: '0 0 auto',
+  cursor: 'pointer',
+  color: '#2b90d9'
+};
+
+const iconStyle = {
+  display: 'inline-block',
+  marginRight: '5px'
+};
+
+const ColumnBackButtonSlim = React.createClass({
+
+  contextTypes: {
+    router: React.PropTypes.object
+  },
+
+  mixins: [PureRenderMixin],
+
+  handleClick () {
+    this.context.router.push('/');
+  },
+
+  render () {
+    return (
+      <div style={{ position: 'relative' }}>
+        <div style={outerStyle} onClick={this.handleClick} className='column-back-button'>
+          <i className='fa fa-fw fa-chevron-left' style={iconStyle} />
+          <FormattedMessage id='column_back_button.label' defaultMessage='Back' />
+        </div>
+      </div>
+    );
+  }
+
+});
+
+export default ColumnBackButtonSlim;
diff --git a/app/assets/javascripts/components/features/favourited_statuses/index.jsx b/app/assets/javascripts/components/features/favourited_statuses/index.jsx
index a2d521736..1e9dafbdd 100644
--- a/app/assets/javascripts/components/features/favourited_statuses/index.jsx
+++ b/app/assets/javascripts/components/features/favourited_statuses/index.jsx
@@ -5,7 +5,7 @@ import LoadingIndicator from '../../components/loading_indicator';
 import { fetchFavouritedStatuses, expandFavouritedStatuses } from '../../actions/favourites';
 import Column from '../ui/components/column';
 import StatusList from '../../components/status_list';
-import ColumnBackButton from '../public_timeline/components/column_back_button';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
 import { defineMessages, injectIntl } from 'react-intl';
 
 const messages = defineMessages({
@@ -52,7 +52,7 @@ const Favourites = React.createClass({
 
     return (
       <Column icon='star' heading={intl.formatMessage(messages.heading)}>
-        <ColumnBackButton />
+        <ColumnBackButtonSlim />
         <StatusList statusIds={statusIds} me={me} onScrollToBottom={this.handleScrollToBottom} />
       </Column>
     );
diff --git a/app/assets/javascripts/components/features/follow_requests/index.jsx b/app/assets/javascripts/components/features/follow_requests/index.jsx
index 5c60b6028..3bee532c5 100644
--- a/app/assets/javascripts/components/features/follow_requests/index.jsx
+++ b/app/assets/javascripts/components/features/follow_requests/index.jsx
@@ -4,7 +4,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import LoadingIndicator from '../../components/loading_indicator';
 import { ScrollContainer } from 'react-router-scroll';
 import Column from '../ui/components/column';
-import ColumnBackButton from '../../components/column_back_button';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
 import AccountAuthorizeContainer from './containers/account_authorize_container';
 import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
 import { defineMessages, injectIntl } from 'react-intl';
@@ -52,7 +52,7 @@ const FollowRequests = React.createClass({
 
     return (
       <Column icon='users' heading={intl.formatMessage(messages.heading)}>
-        <ColumnBackButton />
+        <ColumnBackButtonSlim />
         <ScrollContainer scrollKey='follow_requests'>
           <div className='scrollable' onScroll={this.handleScroll}>
             {accountIds.map(id =>
diff --git a/app/assets/javascripts/components/features/hashtag_timeline/index.jsx b/app/assets/javascripts/components/features/hashtag_timeline/index.jsx
index f28e01a00..011b1e54d 100644
--- a/app/assets/javascripts/components/features/hashtag_timeline/index.jsx
+++ b/app/assets/javascripts/components/features/hashtag_timeline/index.jsx
@@ -7,7 +7,7 @@ import {
   updateTimeline,
   deleteFromTimelines
 } from '../../actions/timelines';
-import ColumnBackButton from '../public_timeline/components/column_back_button';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
 
 const HashtagTimeline = React.createClass({
 
@@ -27,10 +27,10 @@ const HashtagTimeline = React.createClass({
 
         received (data) {
           switch(data.type) {
-            case 'update':
-              return dispatch(updateTimeline('tag', JSON.parse(data.message)));
-            case 'delete':
-              return dispatch(deleteFromTimelines(data.id));
+          case 'update':
+            return dispatch(updateTimeline('tag', JSON.parse(data.message)));
+          case 'delete':
+            return dispatch(deleteFromTimelines(data.id));
           }
         }
 
@@ -69,7 +69,7 @@ const HashtagTimeline = React.createClass({
 
     return (
       <Column icon='hashtag' heading={id}>
-        <ColumnBackButton />
+        <ColumnBackButtonSlim />
         <StatusListContainer type='tag' id={id} />
       </Column>
     );
diff --git a/app/assets/javascripts/components/features/public_timeline/components/column_back_button.jsx b/app/assets/javascripts/components/features/public_timeline/components/column_back_button.jsx
deleted file mode 100644
index 4535f8f28..000000000
--- a/app/assets/javascripts/components/features/public_timeline/components/column_back_button.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import PureRenderMixin from 'react-addons-pure-render-mixin';
-import { FormattedMessage } from 'react-intl';
-
-const outerStyle = {
-  position: 'absolute',
-  right: '0',
-  top: '-48px',
-  padding: '15px',
-  fontSize: '16px',
-  background: '#2f3441',
-  flex: '0 0 auto',
-  cursor: 'pointer',
-  color: '#2b90d9'
-};
-
-const iconStyle = {
-  display: 'inline-block',
-  marginRight: '5px'
-};
-
-const ColumnBackButton = React.createClass({
-
-  contextTypes: {
-    router: React.PropTypes.object
-  },
-
-  mixins: [PureRenderMixin],
-
-  handleClick () {
-    this.context.router.push('/');
-  },
-
-  render () {
-    return (
-      <div style={{ position: 'relative' }}>
-        <div style={outerStyle} onClick={this.handleClick} className='column-back-button'>
-          <i className='fa fa-fw fa-chevron-left' style={iconStyle} />
-          <FormattedMessage id='column_back_button.label' defaultMessage='Back' />
-        </div>
-      </div>
-    );
-  }
-
-});
-
-export default ColumnBackButton;
diff --git a/app/assets/javascripts/components/features/public_timeline/index.jsx b/app/assets/javascripts/components/features/public_timeline/index.jsx
index eac85f01b..28cdc639a 100644
--- a/app/assets/javascripts/components/features/public_timeline/index.jsx
+++ b/app/assets/javascripts/components/features/public_timeline/index.jsx
@@ -8,7 +8,7 @@ import {
   deleteFromTimelines
 } from '../../actions/timelines';
 import { defineMessages, injectIntl } from 'react-intl';
-import ColumnBackButton from './components/column_back_button';
+import ColumnBackButtonSlim from '../../components/column_back_button_slim';
 
 const messages = defineMessages({
   title: { id: 'column.public', defaultMessage: 'Public' }
@@ -33,10 +33,10 @@ const PublicTimeline = React.createClass({
 
         received (data) {
           switch(data.type) {
-            case 'update':
-              return dispatch(updateTimeline('public', JSON.parse(data.message)));
-            case 'delete':
-              return dispatch(deleteFromTimelines(data.id));
+          case 'update':
+            return dispatch(updateTimeline('public', JSON.parse(data.message)));
+          case 'delete':
+            return dispatch(deleteFromTimelines(data.id));
           }
         }
 
@@ -55,7 +55,7 @@ const PublicTimeline = React.createClass({
 
     return (
       <Column icon='globe' heading={intl.formatMessage(messages.title)}>
-        <ColumnBackButton />
+        <ColumnBackButtonSlim />
         <StatusListContainer type='public' />
       </Column>
     );
-- 
cgit 

