Upgrading all buttons to Button component

This commit is contained in:
James Barnsley
2020-08-16 20:00:10 +12:00
parent eb90730667
commit d02d5dd491
42 changed files with 1060 additions and 531 deletions

View File

@ -11,6 +11,7 @@ import * as mopidyActions from '../../services/mopidy/actions';
import * as spotifyActions from '../../services/spotify/actions';
import { isLoading } from '../../util/helpers';
import { i18n, I18n } from '../../locale';
import Button from '../../components/Button';
class DiscoverFeatured extends React.Component {
componentDidMount() {
@ -89,10 +90,14 @@ class DiscoverFeatured extends React.Component {
}
const options = (
<a className="button button--no-hover" onClick={this.onRefresh}>
<Button
noHover
onClick={this.onRefresh}
tracking={{ category: 'DiscoverFeatured', action: 'Refresh' }}
>
<Icon name="refresh" />
<I18n path="actions.refresh" />
</a>
</Button>
);
return (

View File

@ -13,6 +13,7 @@ import * as mopidyActions from '../../services/mopidy/actions';
import * as spotifyActions from '../../services/spotify/actions';
import { isLoading } from '../../util/helpers';
import { i18n, I18n } from '../../locale';
import Button from '../../components/Button';
class DiscoverNewReleases extends React.Component {
componentDidMount() {
@ -119,10 +120,14 @@ class DiscoverNewReleases extends React.Component {
}
const options = (
<a className="button button--no-hover" onClick={this.refresh}>
<Button
noHover
onClick={this.refresh}
tracking={{ category: 'DiscoverFeatured', action: 'Refresh' }}
>
<Icon name="refresh" />
<I18n path="actions.refresh" />
</a>
</Button>
);
return (

View File

@ -24,6 +24,7 @@ import {
} from '../../util/helpers';
import { arrayOf, indexToArray } from '../../util/arrays';
import { i18n, I18n } from '../../locale';
import Button from '../../components/Button';
class Discover extends React.Component {
constructor(props) {
@ -526,9 +527,13 @@ class Discover extends React.Component {
<I18n path="discover.recommendations.tracks" />
<div className="pull-right">
<ContextMenuTrigger onTrigger={this.handleContextMenu} />
<button className="button button--primary" onClick={this.playTracks} type="button">
<Button
type="primary"
onClick={this.playTracks}
tracking={{ category: 'DiscoverRecommendations', action: 'Play' }}
>
<I18n path="actions.play_all" />
</button>
</Button>
</div>
</h4>
<TrackList className="discover-track-list" uri={this.uri()} tracks={tracks} />
@ -608,15 +613,19 @@ class Discover extends React.Component {
handleChange={this.toggleTunability}
/>
<div className="intro__actions__separator" />
<span
className={`submit button button--primary button--large${is_loading ? ' button--working' : ''}`}
<Button
className="submit"
type="primary"
size="large"
working={is_loading}
onClick={this.getRecommendations}
tracking={{ category: 'DiscoverRecommendations', action: 'Submit' }}
>
<Icon name="explore" />
<I18n path="discover.recommendations.find_recommendations" afterContent>
{' '}
</I18n>
</span>
</Button>
</div>
</div>