anix/feat: add popular modal to discovery

app/pages/Discover.tsx

@@ -2,16 +2,24 @@
 import { CollectionsOfTheWeek } from "#/components/Discovery/CollectionsOfTheWeek";
 import { DiscussingToday } from "#/components/Discovery/DiscussingToday";
 import { InterestingCarousel } from "#/components/Discovery/InterestingCarousel";
+import { PopularModal } from "#/components/Discovery/Modal/PopularModal";
 import { RecommendedCarousel } from "#/components/Discovery/RecommendedCarousel";
 import { WatchingNowCarousel } from "#/components/Discovery/WatchingNowCarousel";
 import { Button } from "flowbite-react";
+import { useState } from "react";
 
 export const DiscoverPage = () => {
+  const [PopularModalOpen, setPopularModalOpen] = useState(false);
+
   return (
     <>
       <InterestingCarousel />
       <div className="grid grid-cols-2 gap-4 my-4 lg:grid-cols-4">
-        <Button size="xl" color="yellow">
+        <Button
+          size="xl"
+          color="yellow"
+          onClick={() => setPopularModalOpen(true)}
+        >
           <span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--fire"></span>
           <span>Популярное</span>
         </Button>
@@ -32,6 +40,8 @@ export const DiscoverPage = () => {
       <DiscussingToday />
       <WatchingNowCarousel />
       <CollectionsOfTheWeek />
+
+      <PopularModal isOpen={PopularModalOpen} setIsOpen={setPopularModalOpen} />
     </>
   );
 };

app/pages/IndexFilters.ts

@@ -22,7 +22,7 @@ export const ListFinished = {
 
 export const ListFilms = {
   name: "Фильмы",
-  filter: { ...FilterDefault, category_id: 2, status_id: null },
+  filter: { ...FilterDefault, category_id: 2 },
 };
 
 export const slugToFilter = {