You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
37 lines
1.2 KiB
37 lines
1.2 KiB
import React, { Component } from "react";
|
|
import Menu, { MenuHeader, MenuLink, MenuGap } from "../../common/Menu";
|
|
import pluralize from "pluralize"
|
|
|
|
export default class StoryMenu extends Component {
|
|
render() {
|
|
return (
|
|
<Menu>
|
|
<MenuHeader>Story</MenuHeader>
|
|
<MenuLink to="/story/" icon="A">All</MenuLink>
|
|
<MenuGap />
|
|
<MenuHeader>By Category</MenuHeader>
|
|
<CategoryLinks categories={this.props.categories} />
|
|
<MenuGap />
|
|
<MenuHeader>By Tag</MenuHeader>
|
|
<MenuLink to="/story/tag/" icon="T">All Tags</MenuLink>
|
|
<MenuGap />
|
|
<MenuHeader>Your Content</MenuHeader>
|
|
<MenuLink to="/story/authored/" icon="A">Listed</MenuLink>
|
|
<MenuLink to="/story/open/" icon="O">Open</MenuLink>
|
|
<MenuLink to="/story/unlisted/" icon="U">Unlisted</MenuLink>
|
|
<MenuGap />
|
|
<MenuHeader>Options</MenuHeader>
|
|
<MenuLink icon="+">Create Story</MenuLink>
|
|
</Menu>
|
|
)
|
|
}
|
|
}
|
|
|
|
function CategoryLinks({categories}) {
|
|
return categories.map(category => {
|
|
const icon = category.charAt(0).toUpperCase()
|
|
const label = pluralize(category)
|
|
|
|
return <MenuLink to={`/story/category/${category}`} icon={icon}>{label}</MenuLink>
|
|
})
|
|
}
|