85 lines
2.4 KiB
JavaScript
85 lines
2.4 KiB
JavaScript
import React from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Link, NavLink } from 'react-router-dom';
|
|
import { filter_subscribe } from '../actions/filter_subscribe';
|
|
import { push } from 'react-router-redux';
|
|
import query from 'query-string';
|
|
|
|
function search_qs(text) {
|
|
const qs = query.stringify({
|
|
...query.parse(location.search),
|
|
s: text || undefined
|
|
});
|
|
return `${
|
|
location.pathname === "/" ? location.pathname : ""
|
|
}${qs && "?" + qs}`;
|
|
}
|
|
|
|
function update_filter(text, fs, location, dispatch) {
|
|
dispatch(push(search_qs(text)));
|
|
}
|
|
|
|
function render(props) {
|
|
const { dispatch, router } = props;
|
|
const qs = query.parse(router.location.search);
|
|
const navto = where => e => {
|
|
e.preventDefault();
|
|
dispatch(push(where));
|
|
};
|
|
return <nav className="navbar navbar-light navbar-toggleable-xl">
|
|
<Link to="/" className="navbar-brand">receptor</Link>
|
|
<div className="navbar-collapse collapse">
|
|
<ul className="navbar-nav mr-auto">
|
|
<li className="nav-item">
|
|
<NavLink
|
|
to="/add-torrent"
|
|
className="nav-link btn-primary"
|
|
activeClassName="nav-link active"
|
|
>add torrent</NavLink>
|
|
</li>
|
|
<li className="nav-item" style={{minWidth: "1rem"}}>
|
|
</li>
|
|
<li className="nav-item">
|
|
<a
|
|
className="nav-link"
|
|
href={search_qs("")}
|
|
onClick={navto(search_qs(""))}
|
|
>all</a>
|
|
</li>
|
|
<li className="nav-item">
|
|
<a
|
|
className="nav-link"
|
|
href={search_qs("status:leeching")}
|
|
onClick={navto(search_qs("status:leeching"))}
|
|
>leeching</a>
|
|
</li>
|
|
<li className="nav-item">
|
|
<a
|
|
className="nav-link"
|
|
href={search_qs("status:seeding")}
|
|
onClick={navto(search_qs("status:seeding"))}
|
|
>seeding</a>
|
|
</li>
|
|
<form className="form-inline">
|
|
<input
|
|
className="form-control mr-sm-2"
|
|
type="text"
|
|
placeholder="Search"
|
|
aria-label="Search"
|
|
value={qs.s}
|
|
onChange={e => update_filter(
|
|
e.target.value,
|
|
props.filter_subscribe,
|
|
router.location,
|
|
dispatch)} />
|
|
</form>
|
|
</ul>
|
|
</div>
|
|
</nav>;
|
|
}
|
|
|
|
export default connect(state => ({
|
|
filter_subscribe: state.filter_subscribe,
|
|
router: state.router,
|
|
}))(render);
|