Radiquum/AniX
1
0
Fork 0
mirror of https://github.com/Radiquum/AniX.git synced 2025-04-05 07:44:38 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: add skip to the category page setting for home and bookmark pages

Browse source
This commit is contained in:
Kentai Radiquum 2024-11-21 18:33:19 +05:00
parent 487ae9a1e4
commit e985b65252
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
5 changed files with 184 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

124
app/components/SettingsModal/SettingsModal.tsx
View file

@ -1,9 +1,32 @@
"use client";
import { usePreferencesStore } from "#/store/preferences";
import { Modal, Button, useThemeMode, ToggleSwitch, HR } from "flowbite-react";
import {
Modal,
Button,
useThemeMode,
ToggleSwitch,
HR,
Dropdown,
} from "flowbite-react";
import Link from "next/link";
const HomeCategory = {
last: "Последние релизы",
finished: "Завершенные релизы",
ongoing: "Выходит",
announce: "Анонсированные релизы",
films: "Фильмы",
};
const BookmarksCategory = {
watching: "Смотрю",
planned: "В планах",
watched: "Просмотрено",
delayed: "Отложено",
abandoned: "Заброшено",
};
export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
const preferenceStore = usePreferencesStore();
@ -58,6 +81,87 @@ export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
checked={preferenceStore.flags.showChangelog}
/>
</div>
<div className="flex items-center justify-between">
<p className="font-bold dark:text-white max-w-96">
Пропускать страницу выбора категорий на страницах Домашняя и
Закладки
</p>
<ToggleSwitch
color="blue"
theme={{
toggle: {
checked: {
color: {
blue: "border-blue-700 bg-blue-700",
},
},
},
}}
onChange={() =>
preferenceStore.setParams({
skipToCategory: {
...preferenceStore.params.skipToCategory,
enabled: !preferenceStore.params.skipToCategory.enabled,
},
})
}
checked={preferenceStore.params.skipToCategory.enabled}
/>
</div>
{preferenceStore.params.skipToCategory.enabled ? (
<>
<div className="flex items-center justify-between">
<p className="font-bold dark:text-white max-w-96">
Категория домашней страницы
</p>
<Dropdown color="blue" label={HomeCategory[preferenceStore.params.skipToCategory.homeCategory]}>
{Object.keys(HomeCategory).map((key) => {
return (
<Dropdown.Item
key={key}
onClick={() =>
preferenceStore.setParams({
skipToCategory: {
...preferenceStore.params.skipToCategory,
homeCategory: key,
},
})
}
>
{HomeCategory[key]}
</Dropdown.Item>
);
})}
</Dropdown>
</div>
<div className="flex items-center justify-between">
<p className="font-bold dark:text-white max-w-96">
Категория страницы закладок
</p>
<Dropdown color="blue" label={BookmarksCategory[preferenceStore.params.skipToCategory.bookmarksCategory]}>
{Object.keys(BookmarksCategory).map((key) => {
return (
<Dropdown.Item
key={key}
onClick={() =>
preferenceStore.setParams({
skipToCategory: {
...preferenceStore.params.skipToCategory,
bookmarksCategory: key,
},
})
}
>
{BookmarksCategory[key]}
</Dropdown.Item>
);
})}
</Dropdown>
</div>
</>
) : (
""
)}
<div className="flex items-center justify-between">
<div>
<p className="font-bold dark:text-white">Отправка аналитики</p>
@ -87,18 +191,28 @@ export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
</div>
<HR className="my-4 dark:bg-slate-400" />
<div>
<Link href={"https://t.me/anix_web"} className="flex items-center gap-2 p-2 text-left rounded-md hover:bg-gray-100 dark:hover:bg-gray-900">
<Link
href={"https://t.me/anix_web"}
className="flex items-center gap-2 p-2 text-left rounded-md hover:bg-gray-100 dark:hover:bg-gray-900"
>
<span className="w-8 h-8 iconify fa6-brands--telegram"></span>
<div>
<p>Телеграм канал</p>
<p className="text-sm text-gray-400 dark:text-gray-200">@anix_web</p>
<p className="text-sm text-gray-400 dark:text-gray-200">
@anix_web
</p>
</div>
</Link>
<Link href={"https://wah.su/radiquum"} className="flex items-center gap-2 p-2 text-left rounded-md hover:bg-gray-100 dark:hover:bg-gray-900">
<Link
href={"https://wah.su/radiquum"}
className="flex items-center gap-2 p-2 text-left rounded-md hover:bg-gray-100 dark:hover:bg-gray-900"
>
<span className="w-8 h-8 iconify mdi--code"></span>
<div>
<p>Разработчик</p>
<p className="text-sm text-gray-400 dark:text-gray-200">Radiquum</p>
<p className="text-sm text-gray-400 dark:text-gray-200">
Radiquum
</p>
</div>
</Link>
</div>

54
app/pages/Bookmarks.tsx
View file

@ -5,6 +5,7 @@ import { Spinner } from "#/components/Spinner/Spinner";
const fetcher = (...args: any) =>
fetch([...args] as any).then((res) => res.json());
import { useUserStore } from "#/store/auth";
import { usePreferencesStore } from "#/store/preferences";
import { BookmarksList } from "#/api/utils";
import { ENDPOINTS } from "#/api/config";
import { useRouter } from "next/navigation";
@ -14,31 +15,42 @@ export function BookmarksPage(props: { profile_id?: number }) {
const token = useUserStore((state) => state.token);
const authState = useUserStore((state) => state.state);
const router = useRouter();
const preferenceStore = usePreferencesStore();
useEffect(() => {
if (preferenceStore.params.skipToCategory.enabled) {
if (props.profile_id) {
router.push(
`/profile/${props.profile_id}/bookmarks/${preferenceStore.params.skipToCategory.bookmarksCategory}`
);
} else {
router.push(
`/bookmarks/${preferenceStore.params.skipToCategory.bookmarksCategory}`
);
}
}
}, []);
function useFetchReleases(listName: string) {
let url: string;
if (!preferenceStore.params.skipToCategory.enabled) {
if (props.profile_id) {
url = `${ENDPOINTS.user.bookmark}/all/${props.profile_id}/${BookmarksList[listName]}/0?sort=1`;
if (token) {
url += `&token=${token}`;
}
} else {
if (token) {
url = `${ENDPOINTS.user.bookmark}/all/${BookmarksList[listName]}/0?sort=1&token=${token}`;
}
}
if (props.profile_id) {
url = `${ENDPOINTS.user.bookmark}/all/${props.profile_id}/${BookmarksList[listName]}/0?sort=1`;
if (token) {
url += `&token=${token}`;
}
} else {
if (token) {
url = `${ENDPOINTS.user.bookmark}/all/${BookmarksList[listName]}/0?sort=1&token=${token}`;
}
const { data } = useSWR(url, fetcher);
return [data];
}
const { data } = useSWR(url, fetcher);
return [data];
return [null];
}
const [watchingData] = useFetchReleases("watching");
const [plannedData] = useFetchReleases("planned");
const [watchedData] = useFetchReleases("watched");
const [delayedData] = useFetchReleases("delayed");
const [abandonedData] = useFetchReleases("abandoned");
useEffect(() => {
if (authState === "finished" && !token && !props.profile_id) {
router.push("/login?redirect=/bookmarks");
@ -46,6 +58,12 @@ export function BookmarksPage(props: { profile_id?: number }) {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [authState, token]);
const [watchingData] = useFetchReleases("watching");
const [plannedData] = useFetchReleases("planned");
const [watchedData] = useFetchReleases("watched");
const [delayedData] = useFetchReleases("delayed");
const [abandonedData] = useFetchReleases("abandoned");
return (
<>
{authState === "loading" &&

10
app/pages/BookmarksCategory.tsx
View file

@ -144,11 +144,11 @@ export function BookmarksCategoryPage(props: any) {
</form>
<div className="m-4 overflow-auto">
<Button.Group>
<Button className="whitespace-nowrap" disabled={props.slug == "watching"} color="light" onClick={() => router.push("/bookmarks/watching")}>{props.SectionTitleMapping["watching"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "planned"} color="light" onClick={() => router.push("/bookmarks/planned")}>{props.SectionTitleMapping["planned"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "watched"} color="light" onClick={() => router.push("/bookmarks/watched")}>{props.SectionTitleMapping["watched"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "delayed"} color="light" onClick={() => router.push("/bookmarks/delayed")}>{props.SectionTitleMapping["delayed"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "abandoned"} color="light" onClick={() => router.push("/bookmarks/abandoned")}>{props.SectionTitleMapping["abandoned"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "watching"} color="light" onClick={() => router.push(props.profile_id ? `/profile/${props.profile_id}/bookmarks/watching` : "/bookmarks/watching")}>{props.SectionTitleMapping["watching"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "planned"} color="light" onClick={() => router.push(props.profile_id ? `/profile/${props.profile_id}/bookmarks/planned` : "/bookmarks/planned")}>{props.SectionTitleMapping["planned"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "watched"} color="light" onClick={() => router.push(props.profile_id ? `/profile/${props.profile_id}/bookmarks/watched` : "/bookmarks/watched")}>{props.SectionTitleMapping["watched"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "delayed"} color="light" onClick={() => router.push(props.profile_id ? `/profile/${props.profile_id}/bookmarks/delayed` : "/bookmarks/delayed")}>{props.SectionTitleMapping["delayed"]}</Button>
<Button className="whitespace-nowrap" disabled={props.slug == "abandoned"} color="light" onClick={() => router.push(props.profile_id ? `/profile/${props.profile_id}/bookmarks/abandoned` : "/bookmarks/abandoned")}>{props.SectionTitleMapping["abandoned"]}</Button>
</Button.Group>
</div>
<div className="flex items-center justify-between px-4 py-2 border-b-2 border-black dark:border-white">

15
app/pages/Index.tsx
View file

@ -5,8 +5,13 @@ import { useUserStore } from "#/store/auth";
import { useState, useEffect } from "react";
import { _FetchHomePageReleases } from "#/api/utils";
import { usePreferencesStore } from "#/store/preferences";
import { useRouter } from "next/navigation";
export function IndexPage() {
const token = useUserStore((state) => state.token);
const preferenceStore = usePreferencesStore();
const router = useRouter()
const [isLoading, setIsLoading] = useState(true);
const [lastReleasesData, setLastReleasesData] = useState(null);
const [ongoingReleasesData, setOngoingReleasesData] = useState(null);
@ -14,6 +19,12 @@ export function IndexPage() {
const [announceReleasesData, setAnnounceReleasesData] = useState(null);
const [filmsReleasesData, setFilmsReleasesData] = useState(null);
useEffect(() => {
if (preferenceStore.params.skipToCategory.enabled) {
router.push(`/home/${preferenceStore.params.skipToCategory.homeCategory}`);
}
}, []);
useEffect(() => {
async function _loadReleases() {
setIsLoading(true);
@ -36,7 +47,9 @@ export function IndexPage() {
setFilmsReleasesData(filmsReleases);
setIsLoading(false);
}
_loadReleases();
if (!preferenceStore.params.skipToCategory.enabled) {
_loadReleases();
}
}, [token]);
return (

10
app/store/preferences.ts
View file

@ -14,6 +14,11 @@ interface preferencesState {
params: {
isFirstLaunch?: boolean;
version?: string;
skipToCategory?: {
enabled: boolean;
homeCategory: string;
bookmarksCategory: string;
}
// color: {
// primary: string;
// secondary: string;
@ -38,6 +43,11 @@ export const usePreferencesStore = create<preferencesState>()(
params: {
isFirstLaunch: true,
version: "3.0.0",
skipToCategory: {
enabled: false,
homeCategory: "last",
bookmarksCategory: "watching",
}
},
setHasHydrated: (state) => {
set({