mirror of
https://github.com/Radiquum/AniX.git
synced 2025-09-04 13:35:36 +05:00
anix/feat: add discussing releases to discovery page
This commit is contained in:
parent
01e2903e7b
commit
b25bb4d6e9
3 changed files with 63 additions and 4 deletions
|
@ -77,5 +77,6 @@ export const ENDPOINTS = {
|
|||
},
|
||||
discover: {
|
||||
interesting: `${API_PREFIX}/discover/interesting`,
|
||||
discussing: `${API_PREFIX}/discover/discussing`,
|
||||
}
|
||||
};
|
||||
|
|
52
app/components/Discovery/DiscussingTodayCarousel.tsx
Normal file
52
app/components/Discovery/DiscussingTodayCarousel.tsx
Normal file
|
@ -0,0 +1,52 @@
|
|||
"use client";
|
||||
|
||||
import { ENDPOINTS } from "#/api/config";
|
||||
import { useSWRfetcher } from "#/api/utils";
|
||||
import { useUserStore } from "#/store/auth";
|
||||
import Link from "next/link";
|
||||
import { PosterWithStuff } from "../ReleasePoster/PosterWithStuff";
|
||||
import useSWR from "swr";
|
||||
|
||||
export const DiscussingTodayCarousel = () => {
|
||||
const token = useUserStore((state) => state.token);
|
||||
const { data, isLoading, error } = useSWR(
|
||||
`${ENDPOINTS.discover.discussing}${token ? `?token=${token}` : ""}`,
|
||||
useSWRfetcher,
|
||||
{
|
||||
revalidateOnFocus: false,
|
||||
revalidateIfStale: false,
|
||||
revalidateOnReconnect: false,
|
||||
}
|
||||
);
|
||||
|
||||
if (error)
|
||||
return (
|
||||
<div className="flex flex-col justify-between w-full p-4 border border-red-200 rounded-md md:flex-row bg-red-50 dark:bg-red-700 dark:border-red-600">
|
||||
<div className="mb-4 md:mb-0 md:me-4">
|
||||
<p>Произошла ошибка загрузки обсуждаемых релизов</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
if (isLoading) return <></>;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p className="mb-2 text-lg font-bold">Обсуждаемое сегодня</p>
|
||||
<div className="grid grid-cols-2 gap-2 sm:grid-cols-3 xl:grid-cols-5">
|
||||
{data.content.map((item) => {
|
||||
return (
|
||||
<Link
|
||||
key={`discover-discussing-${item.id}`}
|
||||
href={`/release/${item.id}`}
|
||||
>
|
||||
<PosterWithStuff
|
||||
settings={{ showDescription: false, showGenres: false }}
|
||||
{...item}
|
||||
/>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
|
@ -1,4 +1,5 @@
|
|||
"use client";
|
||||
import { DiscussingTodayCarousel } from "#/components/Discovery/DiscussingTodayCarousel";
|
||||
import { InterestingCarousel } from "#/components/Discovery/InterestingCarousel";
|
||||
import { Button } from "flowbite-react";
|
||||
|
||||
|
@ -8,18 +9,23 @@ export const DiscoverPage = () => {
|
|||
<InterestingCarousel />
|
||||
<div className="grid grid-cols-2 gap-4 my-4 lg:grid-cols-4">
|
||||
<Button size="xl" color="yellow">
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--fire"></span><span>Популярное</span>
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--fire"></span>
|
||||
<span>Популярное</span>
|
||||
</Button>
|
||||
<Button size="xl" color="blue">
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--calendar-month"></span><span>Расписание</span>
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--calendar-month"></span>
|
||||
<span>Расписание</span>
|
||||
</Button>
|
||||
<Button size="xl" color="purple">
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--collections-bookmark"></span><span>Коллекции</span>
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--collections-bookmark"></span>
|
||||
<span>Коллекции</span>
|
||||
</Button>
|
||||
<Button size="xl" color="green">
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--mixer-settings"></span><span>Фильтр</span>
|
||||
<span className="flex-shrink-0 inline-block w-8 h-8 mr-2 iconify mdi--mixer-settings"></span>
|
||||
<span>Фильтр</span>
|
||||
</Button>
|
||||
</div>
|
||||
<DiscussingTodayCarousel />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue