lukas/OpenMediaCenter
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases Wiki Activity

correct behaviour on category page on tag click

Browse Source
This commit is contained in:
Lukas Heiligenbrunner 2020-06-24 22:47:46 +02:00
parent 753ea99693
commit a6f6b2d96f
4 changed files with 48 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/pages/CategoryPage/CategoryPage.js
View File

@ -35,10 +35,26 @@ class CategoryPage extends React.Component {
<SideBar>
<div className='sidebartitle'>Default Tags:</div>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>All</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>FullHd</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>LowQuality</Tag>
<Tag viewbinding={this.props.viewbinding} contentbinding={this.loadTag}>HD</Tag>
<Tag viewbinding={{
changeRootElement: (e) => {
this.loadTag(e.props.category)
}
}}>All</Tag>
<Tag viewbinding={{
changeRootElement: (e) => {
this.loadTag(e.props.category)
}
}}>FullHd</Tag>
<Tag viewbinding={{
changeRootElement: (e) => {
this.loadTag(e.props.category)
}
}}>LowQuality</Tag>
<Tag viewbinding={{
changeRootElement: (e) => {
this.loadTag(e.props.category)
}
}}>HD</Tag>
<hr/>
<button data-testid='btnaddtag' className='btn btn-success' onClick={() => {
this.setState({popupvisible: true})
@ -46,8 +62,17 @@ class CategoryPage extends React.Component {
</button>
</SideBar>
{!this.state.selected ?
(<div className='maincontent'>
{this.state.selected ?
<>
{this.videodata ?
<VideoContainer
data={this.videodata}
viewbinding={this.props.viewbinding}/> : null}
<button data-testid='backbtn' className="btn btn-success"
onClick={this.loadCategoryPageDefault}>Back
</button>
</> :
<div className='maincontent'>
{this.state.loadedtags ?
this.state.loadedtags.map((m) => (
<TagPreview
@ -58,13 +83,7 @@ class CategoryPage extends React.Component {
categorybinding={this.loadTag}/>
)) :
"loading"}
</div>) :
<>
{this.selectionelements ? this.selectionelements : null}
<button data-testid='backbtn' className="btn btn-success"
onClick={this.loadCategoryPageDefault}>Back
</button>
</>
</div>
}
{this.state.popupvisible ?
@ -81,8 +100,6 @@ class CategoryPage extends React.Component {
}
loadTag = (tagname) => {
// this.selectionelements = element;
// this.setState({selected: null}); // todo save this change trigger better
this.fetchVideoData(tagname);
};
@ -98,10 +115,8 @@ class CategoryPage extends React.Component {
fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
.then((response) => response.json()
.then((result) => {
this.selectionelements =
<VideoContainer
data={result}
viewbinding={this.props.viewbinding}/>;
this.videodata = result;
this.setState({selected: null}); // needed to trigger the state reload correctly
this.setState({selected: tag});
}))
.catch(() => {
@ -111,6 +126,7 @@ class CategoryPage extends React.Component {
loadCategoryPageDefault = () => {
this.setState({selected: null});
this.loadTags();
};
/**

11
src/pages/CategoryPage/CategoryPage.test.js
View File

@ -86,8 +86,6 @@ describe('<CategoryPage/>', function () {
process.nextTick(() => {
// expect callback to have loaded correct tag
expect(wrapper.state().selected).toBe("testname");
// expect to receive a videocontainer with simulated data
expect(wrapper.instance().selectionelements).toMatchObject(<VideoContainer data={[{}, {}]}/>);
global.fetch.mockClear();
done();
@ -104,4 +102,13 @@ describe('<CategoryPage/>', function () {
wrapper.find('[data-testid="backbtn"]').simulate("click");
expect(wrapper.state().selected).toBeNull();
});
it('load categorypage with predefined tag', function () {
const func = jest.fn();
CategoryPage.prototype.fetchVideoData = func;
const wrapper = shallow(<CategoryPage category="fullhd"/>);
expect(func).toBeCalledTimes(1);
});
});

22
src/pages/HomePage/HomePage.js
View File

@ -118,12 +118,6 @@ class HomePage extends React.Component {
});
}
setPage = (element, tagname) => {
this.setState({tag: tagname});
// todo warning double data download here!
this.fetchVideoData(tagname);
};
render() {
return (
<div>
@ -152,18 +146,10 @@ class HomePage extends React.Component {
<div className='sidebarinfo'><b>{this.state.sideinfo.tagnr}</b> different Tags!</div>
<hr/>
<div className='sidebartitle'>Default Tags:</div>
<Tag
viewbinding={this.props.viewbinding}
contentbinding={this.setPage}>All</Tag>
<Tag
viewbinding={this.props.viewbinding}
contentbinding={this.setPage}>FullHd</Tag>
<Tag
viewbinding={this.props.viewbinding}
contentbinding={this.setPage}>LowQuality</Tag>
<Tag
viewbinding={this.props.viewbinding}
contentbinding={this.setPage}>HD</Tag>
<Tag viewbinding={this.props.viewbinding}>All</Tag>
<Tag viewbinding={this.props.viewbinding}>FullHd</Tag>
<Tag viewbinding={this.props.viewbinding}>LowQuality</Tag>
<Tag viewbinding={this.props.viewbinding}>HD</Tag>
</SideBar>
{this.state.data.length !== 0 ?
<VideoContainer

7
src/pages/HomePage/HomePage.test.js
View File

@ -105,11 +105,4 @@ describe('<HomePage/>', function () {
done();
});
});
it.skip('test setcontent of homepage', function () {
const wrapper = shallow(<HomePage/>);
wrapper.instance().setPage();
// todo finish test
});
});