add tag delete button if filtertag selected

This commit is contained in:
lukas-heiligenbrunner 2022-05-05 19:43:29 +02:00
parent 11c1e25de5
commit 9faf457c89

View File

@ -9,7 +9,7 @@ import {TagType} from '../../types/VideoTypes';
import {VideoTypes} from '../../types/ApiTypes'; import {VideoTypes} from '../../types/ApiTypes';
import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler'; import {addKeyHandler, removeKeyHandler} from '../../utils/ShortkeyHandler';
import {IconButton} from '../../elements/GPElements/Button'; import {IconButton} from '../../elements/GPElements/Button';
import {faPlusCircle} from '@fortawesome/free-solid-svg-icons'; import {faMinusCircle, faPlusCircle} from '@fortawesome/free-solid-svg-icons';
import AddTagPopup from '../../elements/Popups/AddTagPopup/AddTagPopup'; import AddTagPopup from '../../elements/Popups/AddTagPopup/AddTagPopup';
interface state { interface state {
@ -56,7 +56,7 @@ class RandomPage extends React.Component<{}, state> {
render(): JSX.Element { render(): JSX.Element {
return ( return (
<div> <div>
<PageTitle title='Random Videos' subtitle='4pc' /> <PageTitle title='Random Videos' subtitle='3pc' />
<SideBar> <SideBar>
<SideBarTitle>Visible Tags:</SideBarTitle> <SideBarTitle>Visible Tags:</SideBarTitle>
@ -75,6 +75,19 @@ class RandomPage extends React.Component<{}, state> {
this.setState({addTagPopup: true}); this.setState({addTagPopup: true});
}} }}
/> />
{this.state.filterTags.length > 0 ? (
<IconButton
title='Remove All'
icon={faMinusCircle}
onClick={(): void => {
this.setState({filterTags: []}, (): void => {
this.loadShuffledvideos(this.LoadNR);
});
}}
/>
) : (
<></>
)}
</SideBar> </SideBar>
{this.state.videos.length !== 0 ? <VideoContainer data={this.state.videos} /> : <div>No Data found!</div>} {this.state.videos.length !== 0 ? <VideoContainer data={this.state.videos} /> : <div>No Data found!</div>}
@ -122,7 +135,7 @@ class RandomPage extends React.Component<{}, state> {
private keypress(event: KeyboardEvent): void { private keypress(event: KeyboardEvent): void {
// bind s to shuffle // bind s to shuffle
if (event.key === 's') { if (event.key === 's') {
this.loadShuffledvideos(4); this.loadShuffledvideos(3);
} }
} }
} }