From 75dd8d83bd875dbddc59f2ecde75d2ed205be5a0 Mon Sep 17 00:00:00 2001 From: Kentai Radiquum Date: Tue, 30 Apr 2024 05:19:42 +0500 Subject: [PATCH] feat(frontend): add a release page add a video player to a release page without release info with ability to save and view wathed episodes --- backend/modules/release/release.py | 45 ++++---- frontend/app/api/config.js | 1 + frontend/app/release/[id]/page.js | 162 +++++++++++++++++++++++++++++ frontend/app/store/user-store.js | 6 +- 4 files changed, 187 insertions(+), 27 deletions(-) create mode 100644 frontend/app/release/[id]/page.js diff --git a/backend/modules/release/release.py b/backend/modules/release/release.py index 70e8491..1e60a39 100644 --- a/backend/modules/release/release.py +++ b/backend/modules/release/release.py @@ -1,7 +1,9 @@ +import requests from fastapi import APIRouter from fastapi import Request from modules.proxy import apiRequest from modules.proxy import ENDPOINTS +from modules.proxy import USER_AGENT router = APIRouter() @@ -33,40 +35,39 @@ async def GetReleaseVoiceoverPlayer( summary="Get available episodes for selected voiceover and a player of a release", ) async def GetReleaseEpisodes( - request: Request, release_id: str, voiceover_id: str, source_id: str + request: Request, + release_id: str, + voiceover_id: str, + source_id: str, + token: str = "", ): return await apiRequest( request, ENDPOINTS["release"]["episode"], f"{release_id}/{voiceover_id}/{source_id}", + query=f"?token={token}", ) @router.get( - "/{release_id}/{episode}/markWatched", - summary="mark episode of a selected voiceover as watched", + "/{release_id}/{source_id}/{episode}/saveToHistory", + summary="mark episode of a selected voiceover as watched and save it to watch history", ) async def MarkEpisodeAsWatched( request: Request, release_id: str, source_id: str, episode: str, token: str ): - return await apiRequest( - request, - ENDPOINTS["statistic"]["markWatched"], - f"${release_id}/${source_id}/${episode}", - query=f"?token={token}", + headers = { + "User-Agent": USER_AGENT, + "Content-Type": "application/json; charset=UTF-8", + } + + requests.get( + f"{ENDPOINTS['statistic']['markWatched']}/{release_id}/{source_id}/{episode}?token={token}", + headers=headers, + ) + requests.get( + f"{ENDPOINTS['statistic']['addHistory']}/{release_id}/{source_id}/{episode}?token={token}", + headers=headers, ) - -@router.get( - "/{release_id}/{episode}/addHistory", - summary="add episode of a selected voiceover to history", -) -async def AddEpisodeToHistory( - request: Request, release_id: str, source_id: str, episode: str, token: str -): - return await apiRequest( - request, - ENDPOINTS["statistic"]["addHistory"], - f"${release_id}/${source_id}/${episode}", - query=f"?token={token}", - ) + return {"success"} diff --git a/frontend/app/api/config.js b/frontend/app/api/config.js index e594b01..7588893 100644 --- a/frontend/app/api/config.js +++ b/frontend/app/api/config.js @@ -20,4 +20,5 @@ export const endpoints = { abandoned: `${API_URL}/favorites/abandoned`, }, }, + release: `${API_URL}/release`, }; diff --git a/frontend/app/release/[id]/page.js b/frontend/app/release/[id]/page.js new file mode 100644 index 0000000..43359bd --- /dev/null +++ b/frontend/app/release/[id]/page.js @@ -0,0 +1,162 @@ +"use client"; + +import { useEffect, useState } from "react"; +import { getData } from "@/app/api/api-utils"; +import { endpoints } from "@/app/api/config"; +import { useUserStore } from "@/app/store/user-store"; +import { useSettingsStore } from "@/app/store/settings-store"; + +export default function Release(props) { + const userStore = useUserStore(); + const settingsStore = useSettingsStore(); + const [releaseInfo, setReleaseInfo] = useState(); + const [voiceoverInfo, setVoiceoverInfo] = useState(); + const [selectedVoiceover, setSelectedVoiceover] = useState(); + const [sourcesInfo, setSourcesInfo] = useState(); + const [selectedSources, setSelectedSources] = useState(); + const [episodeInfo, setEpisodeInfo] = useState(); + const [selectedEpisode, setSelectedEpisode] = useState(); + const [episodeURL, setEpisodeURL] = useState(); + + useEffect(() => { + async function _fetchInfo() { + const release = await getData(`${endpoints.release}/${props.params.id}`); + const voiceover = await getData( + `${endpoints.release}/${props.params.id}/voiceover`, + ); + setReleaseInfo(release); + setVoiceoverInfo(voiceover); + setSelectedVoiceover(voiceover.types[0].id); + } + if (props.params.id) { + _fetchInfo(); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + useEffect(() => { + async function _fetchInfo() { + const sources = await getData( + `${endpoints.release}/${props.params.id}/${selectedVoiceover}`, + ); + setSourcesInfo(sources); + setSelectedSources(sources.sources[0].id); + } + if (selectedVoiceover) { + _fetchInfo(); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [selectedVoiceover]); + + useEffect(() => { + async function _fetchInfo() { + let url = `${endpoints.release}/${props.params.id}/${selectedVoiceover}/${selectedSources}`; + if (userStore.token) { + url = `${endpoints.release}/${props.params.id}/${selectedVoiceover}/${selectedSources}?token=${userStore.token}`; + } + + const episodes = await getData(url); + + setEpisodeInfo(episodes); + setSelectedEpisode(episodes.episodes[0].position); + setEpisodeURL(episodes.episodes[0].url); + } + if (selectedSources) { + _fetchInfo(); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [selectedSources, userStore.token]); + + useEffect(() => { + async function _markAsWatched() { + const url = `${endpoints.release}/${props.params.id}/${selectedSources}/${selectedEpisode}`; + await getData(`${url}/saveToHistory?token=${userStore.token}`); + } + if (userStore.token && settingsStore.saveToHistory) { + _markAsWatched(); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [selectedEpisode]); + + return ( +
+