diff --git a/client/modules/User/components/Collection.jsx b/client/modules/User/components/Collection.jsx index bb798161..05f6b757 100644 --- a/client/modules/User/components/Collection.jsx +++ b/client/modules/User/components/Collection.jsx @@ -53,9 +53,10 @@ const ShareURL = ({ value }) => { { showURL &&
@@ -97,8 +98,9 @@ class CollectionItemRowBase extends React.Component { ); @@ -295,21 +297,43 @@ class Collection extends React.Component { return null; } + _getButtonLabel = (fieldName, displayName) => { + const { field, direction } = this.props.sorting; + let buttonLabel; + if (field !== fieldName) { + if (field === 'name') { + buttonLabel = `Sort by ${displayName} ascending.`; + } else { + buttonLabel = `Sort by ${displayName} descending.`; + } + } else if (direction === SortingActions.DIRECTION.ASC) { + buttonLabel = `Sort by ${displayName} descending.`; + } else { + buttonLabel = `Sort by ${displayName} ascending.`; + } + return buttonLabel; + } + _renderFieldHeader(fieldName, displayName) { const { field, direction } = this.props.sorting; const headerClass = classNames({ 'sketches-table__header': true, 'sketches-table__header--selected': field === fieldName }); + const buttonLabel = this._getButtonLabel(fieldName, displayName); return ( - diff --git a/client/modules/User/components/GithubButton.jsx b/client/modules/User/components/GithubButton.jsx index 58bc2f64..32edfe8a 100644 --- a/client/modules/User/components/GithubButton.jsx +++ b/client/modules/User/components/GithubButton.jsx @@ -9,7 +9,7 @@ function GithubButton(props) { className="github-button" href="/auth/github" > - + {props.buttonText} ); diff --git a/client/modules/User/components/GoogleButton.jsx b/client/modules/User/components/GoogleButton.jsx index 5f07f5c7..c508aa9b 100644 --- a/client/modules/User/components/GoogleButton.jsx +++ b/client/modules/User/components/GoogleButton.jsx @@ -9,7 +9,7 @@ function GoogleButton(props) { className="google-button" href="/auth/google/" > - + {props.buttonText} );