Add more prettty and human readable artists URLs

这个提交包含在:
Lucas Verney 2016-08-12 13:11:14 +02:00
父节点 85dcf6d271
当前提交 e232ec8c16
共有 7 个文件被更改,包括 44 次插入18 次删除

查看文件

@ -46,3 +46,10 @@ homogeneous.
## Hooks
Usefuls Git hooks are located in `hooks` folder.
## Notes on URLs
Text after any dash in a URL parameter is considered as a comment and
discarded. In `/artist/1-foobar`, the artist ID is `1` and the `foobar` text
is simply considered as a comment for human readable URLs.

查看文件

@ -26,6 +26,9 @@ export default class Artists extends Component {
itemsLabel: "app.common.artist",
subItemsType: "albums",
subItemsLabel: "app.common.album",
buildLinkTo: (itemType, item) => {
return "/" + itemType + "/" + item.get("id") + "-" + encodeURIComponent(item.get("name"));
},
};
return (

查看文件

@ -64,7 +64,10 @@ class GridItemCSSIntl extends Component {
{ itemCount: nSubItems }
);
const to = "/" + this.props.itemsType + "/" + this.props.item.get("id");
let to = "/" + this.props.itemsType + "/" + this.props.item.get("id");
if (this.props.buildLinkTo) {
to = this.props.buildLinkTo(this.props.itemsType, this.props.item);
}
const id = "grid-item-" + this.props.itemsType + "/" + this.props.item.get("id");
const title = formatMessage(gridMessages["app.grid.goTo" + this.props.itemsType.capitalize() + "Page"]);
@ -85,6 +88,7 @@ GridItemCSSIntl.propTypes = {
itemsLabel: PropTypes.string.isRequired,
subItemsType: PropTypes.string.isRequired,
subItemsLabel: PropTypes.string.isRequired,
buildLinkTo: PropTypes.func,
intl: intlShape.isRequired,
};
export let GridItem = injectIntl(CSSModules(GridItemCSSIntl, css));
@ -237,9 +241,9 @@ export class Grid extends Component {
// Build grid items
let gridItems = [];
const { itemsType, itemsLabel, subItemsType, subItemsLabel } = this.props;
const { itemsType, itemsLabel, subItemsType, subItemsLabel, buildLinkTo } = this.props;
this.props.items.forEach(function (item) {
gridItems.push(<GridItem item={item} itemsType={itemsType} itemsLabel={itemsLabel} subItemsType={subItemsType} subItemsLabel={subItemsLabel} key={item.get("id")} />);
gridItems.push(<GridItem item={item} itemsType={itemsType} itemsLabel={itemsLabel} subItemsType={subItemsType} subItemsLabel={subItemsLabel} buildLinkTo={buildLinkTo} key={item.get("id")} />);
});
return (
@ -264,6 +268,7 @@ Grid.propTypes = {
itemsLabel: PropTypes.string.isRequired,
subItemsType: PropTypes.string.isRequired,
subItemsLabel: PropTypes.string.isRequired,
buildLinkTo: PropTypes.func,
filterText: PropTypes.string,
};

查看文件

@ -1,12 +1,12 @@
// NPM imports
import React, { Component } from "react";
import React, { Component, PropTypes } from "react";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import { defineMessages, injectIntl, intlShape } from "react-intl";
import Immutable from "immutable";
// Local imports
import { messagesMap, handleErrorI18nObject } from "../utils";
import { messagesMap, handleErrorI18nObject, filterInt } from "../utils";
// Actions
import * as actionCreators from "../actions";
@ -26,9 +26,16 @@ const artistMessages = defineMessages(messagesMap(Array.concat([], APIMessages))
*/
class ArtistPageIntl extends Component {
componentWillMount() {
const id = filterInt(this.props.params.id.split("-")[0]);
if (isNaN(id)) {
// Redirect to homepage
this.context.router.replace({
pathname: "/",
});
}
// Load the data
this.props.actions.loadArtist({
filter: this.props.params.id,
filter: id,
include: ["albums", "songs"],
});
}
@ -53,10 +60,14 @@ class ArtistPageIntl extends Component {
ArtistPageIntl.propTypes = {
intl: intlShape.isRequired,
};
ArtistPageIntl.contextTypes = {
router: PropTypes.object.isRequired,
};
const mapStateToProps = (state, ownProps) => {
const id = ownProps.params.id.split("-")[0];
// Get artist
let artist = state.entities.getIn(["entities", "artist", ownProps.params.id]);
let artist = state.entities.getIn(["entities", "artist", id]);
let albums = new Immutable.List();
let songs = new Immutable.Map();
if (artist) {

文件差异因一行或多行过长而隐藏

文件差异因一行或多行过长而隐藏

文件差异因一行或多行过长而隐藏