Service worker caching, Loader component

This commit is contained in:
James Barnsley
2019-09-10 06:59:44 +12:00
parent a86403fa59
commit c08cc71c47
49 changed files with 16390 additions and 11259 deletions

View File

@ -6,17 +6,18 @@ import { bindActionCreators } from 'redux';
import Header from '../../components/Header';
import Icon from '../../components/Icon';
import CategoryGrid from '../../components/CategoryGrid';
import Loader from '../../components/Loader';
import * as helpers from '../../helpers';
import * as uiActions from '../../services/ui/actions';
import * as spotifyActions from '../../services/spotify/actions';
class DiscoverCategories extends React.Component {
class DiscoverCategories extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {
componentDidMount() {
// Check for an empty category index, or where we've only got one loaded
// This would be the case if you've refreshed from within a category and only loaded
// the single record.
@ -31,9 +32,7 @@ class DiscoverCategories extends React.Component {
return (
<div className="view discover-categories-view">
<Header icon="grid" title="Genre / Mood" />
<div className="body-loader loading">
<div className="loader" />
</div>
<Loader body loading />
</div>
);
}
@ -79,4 +78,4 @@ const mapDispatchToProps = (dispatch) => ({
spotifyActions: bindActionCreators(spotifyActions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverCategories);
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverCategories);

View File

@ -7,12 +7,13 @@ import Header from '../../components/Header';
import Icon from '../../components/Icon';
import PlaylistGrid from '../../components/PlaylistGrid';
import LazyLoadListener from '../../components/LazyLoadListener';
import Loader from '../../components/Loader';
import * as helpers from '../../helpers';
import * as uiActions from '../../services/ui/actions';
import * as spotifyActions from '../../services/spotify/actions';
class DiscoverCategory extends React.Component {
class DiscoverCategory extends React.Component {
constructor(props) {
super(props);
}
@ -69,9 +70,7 @@ class DiscoverCategory extends React.Component {
<Icon name="mood" type="material" />
{(this.props.category ? this.props.category.name : 'Category')}
</Header>
<div className="body-loader loading">
<div className="loader" />
</div>
<Loader body loading />
</div>
);
}
@ -95,7 +94,7 @@ class DiscoverCategory extends React.Component {
<LazyLoadListener
loadKey={category.playlists_more}
showLoader={category.playlists_more}
loadMore={() => this.loadMore()}
loadMore={() => this.loadMore()}
/>
</div>
</div>
@ -114,4 +113,4 @@ const mapDispatchToProps = (dispatch) => ({
spotifyActions: bindActionCreators(spotifyActions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverCategory);
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverCategory);

View File

@ -8,16 +8,14 @@ import PlaylistGrid from '../../components/PlaylistGrid';
import Header from '../../components/Header';
import Icon from '../../components/Icon';
import Parallax from '../../components/Parallax';
import Thumbnail from '../../components/Thumbnail';
import URILink from '../../components/URILink';
import Dater from '../../components/Dater';
import Loader from '../../components/Loader';
import * as helpers from '../../helpers';
import * as uiActions from '../../services/ui/actions';
import * as mopidyActions from '../../services/mopidy/actions';
import * as spotifyActions from '../../services/spotify/actions';
class DiscoverFeatured extends React.Component {
class DiscoverFeatured extends React.Component {
constructor(props) {
super(props);
}
@ -56,7 +54,7 @@ class DiscoverFeatured extends React.Component {
<div className="intro">
<Parallax disabled={this.props.disable_parallax} />
</div>
);
);
}
render() {
@ -67,9 +65,7 @@ class DiscoverFeatured extends React.Component {
<Icon name="star" type="material" />
Featured playlists
</Header>
<div className="body-loader loading">
<div className="loader" />
</div>
<Loader body loading />
</div>
);
}
@ -89,7 +85,7 @@ class DiscoverFeatured extends React.Component {
const options = (
<a className="button button--no-hover" onClick={(e) => { this.props.uiActions.hideContextMenu(); this.props.spotifyActions.getFeaturedPlaylists(); }}>
<Icon name="refresh" />
<Icon name="refresh" />
Refresh
</a>
);
@ -122,4 +118,4 @@ const mapDispatchToProps = (dispatch) => ({
spotifyActions: bindActionCreators(spotifyActions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverFeatured);
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverFeatured);

View File

@ -8,16 +8,15 @@ import Header from '../../components/Header';
import Icon from '../../components/Icon';
import AlbumGrid from '../../components/AlbumGrid';
import Parallax from '../../components/Parallax';
import Thumbnail from '../../components/Thumbnail';
import ArtistSentence from '../../components/ArtistSentence';
import LazyLoadListener from '../../components/LazyLoadListener';
import Loader from '../../components/Loader';
import * as helpers from '../../helpers';
import * as uiActions from '../../services/ui/actions';
import * as mopidyActions from '../../services/mopidy/actions';
import * as spotifyActions from '../../services/spotify/actions';
class DiscoverNewReleases extends React.Component {
class DiscoverNewReleases extends React.Component {
constructor(props) {
super(props);
}
@ -67,7 +66,7 @@ class DiscoverNewReleases extends React.Component {
<div className="intro preserve-3d">
<Parallax />
</div>
);
);
}
render() {
@ -78,9 +77,7 @@ class DiscoverNewReleases extends React.Component {
<Icon name="new_releases" type="material" />
New releases
</Header>
<div className="body-loader loading">
<div className="loader" />
</div>
<Loader body loading />
</div>
);
}
@ -102,7 +99,7 @@ class DiscoverNewReleases extends React.Component {
const options = (
<a className="button button--no-hover" onClick={(e) => { this.props.uiActions.hideContextMenu(); this.props.spotifyActions.getNewReleases(); }}>
<Icon name="refresh" />
<Icon name="refresh" />
Refresh
</a>
);
@ -120,7 +117,7 @@ Refresh
<LazyLoadListener
loadKey={this.props.new_releases_more}
showLoader={this.props.new_releases_more}
loadMore={() => this.loadMore()}
loadMore={() => this.loadMore()}
/>
</div>
);
@ -143,4 +140,4 @@ const mapDispatchToProps = (dispatch) => ({
spotifyActions: bindActionCreators(spotifyActions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverNewReleases);
export default connect(mapStateToProps, mapDispatchToProps)(DiscoverNewReleases);