diff --git a/src/common/playlists/PlayList.jsx b/src/common/playlists/PlayList.jsx index 5e49ed56a0..87581a614a 100644 --- a/src/common/playlists/PlayList.jsx +++ b/src/common/playlists/PlayList.jsx @@ -1,6 +1,7 @@ import PlayThumbnail from "./PlayThumbnail"; import { ReactComponent as ImageOops } from "images/img-oops.svg"; -import React, { Fragment } from "react"; +import React, { Fragment, useEffect, useState, useContext } from "react"; +import { SearchContext } from "common/search/search-context"; import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; import Loader from "common/spinner/spinner"; import * as all_plays from "plays"; @@ -11,17 +12,28 @@ import { toSanitized } from "common/services/string"; const PlayList = () => { const [loading, error, plays] = useGetPlays(); + const { searchTerm, filterQuery } = useContext(SearchContext); + + const hasFilterQuery = + filterQuery.level_id.length > 0 || + filterQuery.tags.length > 0 || + filterQuery.owner_user_id.length > 0 || + filterQuery.language.length > 0; + let { playid } = useParams(); // return the parameter of url if (loading) { return ; } if (plays?.length === 0 || error) { return ( -
- -

Play not found

-

+

+ +

Play not found + {hasFilterQuery? " for matched filter criteria" : null} + {searchTerm ? " for " + searchTerm : null} +

+

Please change your search or adjust filters to find plays.