diff --git a/frontend/src/components/EmbeddableVideoPlayer.tsx b/frontend/src/components/EmbeddableVideoPlayer.tsx index 726607c2..de393fe5 100644 --- a/frontend/src/components/EmbeddableVideoPlayer.tsx +++ b/frontend/src/components/EmbeddableVideoPlayer.tsx @@ -12,6 +12,7 @@ import formatNumbers from '../functions/formatNumbers'; import { Link, useSearchParams } from 'react-router-dom'; import Routes from '../configuration/routes/RouteList'; import loadPlaylistById from '../api/loader/loadPlaylistById'; +import { useAppSettingsStore } from '../stores/AppSettingsStore'; type Playlist = { id: string; @@ -25,6 +26,7 @@ type EmbeddableVideoPlayerProps = { const EmbeddableVideoPlayer = ({ videoId }: EmbeddableVideoPlayerProps) => { const inlinePlayerRef = useRef(null); + const { appSettingsConfig } = useAppSettingsStore(); const [, setSearchParams] = useSearchParams(); @@ -35,10 +37,10 @@ const EmbeddableVideoPlayer = ({ videoId }: EmbeddableVideoPlayerProps) => { useEffect(() => { (async () => { - if (refresh || videoId !== videoResponse?.data.youtube_id) { + if (refresh || videoId !== videoResponse?.youtube_id) { const videoResponse = await loadVideoById(videoId); - const playlistIds = videoResponse.data.playlist; + const playlistIds = videoResponse.playlist; if (playlistIds !== undefined) { const playlists = await Promise.all( playlistIds.map(async playlistid => { @@ -80,7 +82,7 @@ const EmbeddableVideoPlayer = ({ videoId }: EmbeddableVideoPlayerProps) => { return
; } - const video = videoResponse.data; + const video = videoResponse; const name = video.title; const channelId = video.channel.channel_id; const channelName = video.channel.channel_name; @@ -89,10 +91,10 @@ const EmbeddableVideoPlayer = ({ videoId }: EmbeddableVideoPlayerProps) => { const views = formatNumbers(video.stats.view_count); const hasLikes = video.stats.like_count; const likes = formatNumbers(video.stats.like_count); - const hasDislikes = video.stats.dislike_count > 0 && videoResponse.config.downloads.integrate_ryd; + const hasDislikes = video.stats.dislike_count > 0 && appSettingsConfig.downloads.integrate_ryd; const dislikes = formatNumbers(video.stats.dislike_count); - const config = videoResponse.config; - const cast = config.enable_cast; + // const config = videoResponse.config; + const cast = false; // config.enable_cast; return ( <> diff --git a/frontend/src/components/VideoPlayer.tsx b/frontend/src/components/VideoPlayer.tsx index a613e57c..3ed13360 100644 --- a/frontend/src/components/VideoPlayer.tsx +++ b/frontend/src/components/VideoPlayer.tsx @@ -141,15 +141,14 @@ const VideoPlayer = ({ const arrowRightPressed = useKeyPress('ArrowRight'); const arrowLeftPressed = useKeyPress('ArrowLeft'); - const videoId = video.data.youtube_id; - const videoUrl = video.data.media_url; - const videoThumbUrl = video.data.vid_thumb_url; - const watched = video.data.player.watched; - const duration = video.data.player.duration; - const videoSubtitles = video.data.subtitles; + const videoId = video.youtube_id; + const videoUrl = video.media_url; + const videoThumbUrl = video.vid_thumb_url; + const watched = video.player.watched; + const duration = video.player.duration; + const videoSubtitles = video.subtitles; - let videoSrcProgress = - Number(video.data.player?.position) > 0 ? Number(video.data.player?.position) : ''; + let videoSrcProgress = Number(video.player?.position) > 0 ? Number(video.player?.position) : ''; if (searchParamVideoProgress !== null) { videoSrcProgress = searchParamVideoProgress; diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 04fede50..a7d5ad94 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -26,6 +26,7 @@ import ChannelPlaylist from './pages/ChannelPlaylist'; import ChannelAbout from './pages/ChannelAbout'; import Download from './pages/Download'; import loadUserAccount from './api/loader/loadUserAccount'; +import loadAppsettingsConfig from './api/loader/loadAppsettingsConfig'; const router = createBrowserRouter( [ @@ -43,8 +44,9 @@ const router = createBrowserRouter( const userConfig = await loadUserMeConfig(); const userAccount = await loadUserAccount(); + const appSettings = await loadAppsettingsConfig(); - return { userConfig, userAccount, auth: authData }; + return { userConfig, userAccount, appSettings, auth: authData }; }, element: , errorElement: , diff --git a/frontend/src/pages/Base.tsx b/frontend/src/pages/Base.tsx index cb304805..8b3b7228 100644 --- a/frontend/src/pages/Base.tsx +++ b/frontend/src/pages/Base.tsx @@ -8,6 +8,8 @@ import { useAuthStore } from '../stores/AuthDataStore'; import { useUserConfigStore } from '../stores/UserConfigStore'; import { useUserAccountStore } from '../stores/UserAccountStore'; import { UserAccountType } from '../api/loader/loadUserAccount'; +import { useAppSettingsStore } from '../stores/AppSettingsStore'; +import { AppSettingsConfigType } from '../api/loader/loadAppsettingsConfig'; type TaUpdateType = { version?: string; @@ -24,6 +26,7 @@ export type AuthenticationType = { type BaseLoaderData = { userConfig: UserConfigType; userAccount: UserAccountType; + appSettings: AppSettingsConfigType; auth: AuthenticationType; }; @@ -36,7 +39,9 @@ const Base = () => { const { setAuth } = useAuthStore(); const { setUserConfig } = useUserConfigStore(); const { setUserAccount } = useUserAccountStore(); - const { userConfig, userAccount, auth } = useLoaderData() as BaseLoaderData; + const { setAppSettingsConfig } = useAppSettingsStore(); + + const { userConfig, userAccount, appSettings, auth } = useLoaderData() as BaseLoaderData; const location = useLocation(); @@ -51,6 +56,8 @@ const Base = () => { setAuth(auth); setUserConfig(userConfig); setUserAccount(userAccount); + setAppSettingsConfig(appSettings); + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); diff --git a/frontend/src/pages/ChannelAbout.tsx b/frontend/src/pages/ChannelAbout.tsx index c87fca3c..df8fe453 100644 --- a/frontend/src/pages/ChannelAbout.tsx +++ b/frontend/src/pages/ChannelAbout.tsx @@ -55,7 +55,7 @@ const ChannelAbout = () => { const [pageSizeShorts, setPageSizeShorts] = useState(null); const [pageSizeStreams, setPageSizeStreams] = useState(null); - const channel = channelResponse?.data; + const channel = channelResponse; useEffect(() => { (async () => { diff --git a/frontend/src/pages/ChannelBase.tsx b/frontend/src/pages/ChannelBase.tsx index 2b98d116..2da7c552 100644 --- a/frontend/src/pages/ChannelBase.tsx +++ b/frontend/src/pages/ChannelBase.tsx @@ -1,7 +1,6 @@ import { Link, Outlet, useOutletContext, useParams } from 'react-router-dom'; import Routes from '../configuration/routes/RouteList'; import { ChannelType } from './Channels'; -import { ConfigType } from './Home'; import { OutletContextType } from './Base'; import Notifications from '../components/Notifications'; import { useEffect, useState } from 'react'; @@ -14,10 +13,7 @@ type ChannelParams = { channelId: string; }; -export type ChannelResponseType = { - data: ChannelType; - config: ConfigType; -}; +export type ChannelResponseType = ChannelType; const ChannelBase = () => { const { channelId } = useParams() as ChannelParams; @@ -28,7 +24,7 @@ const ChannelBase = () => { const [channelNav, setChannelNav] = useState(); const [startNotification, setStartNotification] = useState(false); - const channel = channelResponse?.data; + const channel = channelResponse; const { has_streams, has_shorts, has_playlists, has_pending } = channelNav || {}; useEffect(() => { diff --git a/frontend/src/pages/ChannelVideo.tsx b/frontend/src/pages/ChannelVideo.tsx index f735f64d..39141e99 100644 --- a/frontend/src/pages/ChannelVideo.tsx +++ b/frontend/src/pages/ChannelVideo.tsx @@ -42,7 +42,7 @@ const ChannelVideo = ({ videoType }: ChannelVideoProps) => { const [videoResponse, setVideoReponse] = useState(); const [videoAggsResponse, setVideoAggsResponse] = useState(); - const channel = channelResponse?.data; + const channel = channelResponse; const videoList = videoResponse?.data; const pagination = videoResponse?.paginate; diff --git a/frontend/src/pages/Playlist.tsx b/frontend/src/pages/Playlist.tsx index 497d8acb..7f229ca8 100644 --- a/frontend/src/pages/Playlist.tsx +++ b/frontend/src/pages/Playlist.tsx @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import { Link, useNavigate, useOutletContext, useParams, useSearchParams } from 'react-router-dom'; import loadPlaylistById from '../api/loader/loadPlaylistById'; import { OutletContextType } from './Base'; -import { ConfigType, VideoType } from './Home'; +import { VideoType } from './Home'; import Filterbar from '../components/Filterbar'; import { PlaylistEntryType } from './Playlists'; import loadChannelById from '../api/loader/loadChannelById'; @@ -41,14 +41,10 @@ export type PlaylistType = { _score: number; }; -export type PlaylistResponseType = { - data?: PlaylistType; - config?: ConfigType; -}; +export type PlaylistResponseType = PlaylistType; export type VideoResponseType = { data?: VideoType[]; - config?: ConfigType; paginate?: PaginationType; }; @@ -71,12 +67,12 @@ const Playlist = () => { const [channelResponse, setChannelResponse] = useState(); const [videoResponse, setVideoResponse] = useState(); - const playlist = playlistResponse?.data; - const channel = channelResponse?.data; + const playlist = playlistResponse; + const channel = channelResponse; const videos = videoResponse?.data; const pagination = videoResponse?.paginate; - const palylistEntries = playlistResponse?.data?.playlist_entries; + const palylistEntries = playlistResponse?.playlist_entries; const videoArchivedCount = Number(palylistEntries?.filter(video => video.downloaded).length); const videoInPlaylistCount = pagination?.total_hits; const showEmbeddedVideo = videoId !== null; diff --git a/frontend/src/pages/Playlists.tsx b/frontend/src/pages/Playlists.tsx index db14e5da..f7bb80af 100644 --- a/frontend/src/pages/Playlists.tsx +++ b/frontend/src/pages/Playlists.tsx @@ -7,7 +7,6 @@ import iconListView from '/img/icon-listview.svg'; import { OutletContextType } from './Base'; import loadPlaylistList from '../api/loader/loadPlaylistList'; -import { ConfigType } from './Home'; import Pagination, { PaginationType } from '../components/Pagination'; import PlaylistList from '../components/PlaylistList'; import { PlaylistType } from './Playlist'; @@ -30,7 +29,6 @@ export type PlaylistEntryType = { export type PlaylistsResponseType = { data?: PlaylistType[]; - config?: ConfigType; paginate?: PaginationType; }; diff --git a/frontend/src/pages/Video.tsx b/frontend/src/pages/Video.tsx index 1e9f1b5b..14be57b2 100644 --- a/frontend/src/pages/Video.tsx +++ b/frontend/src/pages/Video.tsx @@ -39,6 +39,7 @@ import getApiUrl from '../configuration/getApiUrl'; import loadVideoNav, { VideoNavResponseType } from '../api/loader/loadVideoNav'; import useIsAdmin from '../functions/useIsAdmin'; import ToggleConfig from '../components/ToggleConfig'; +// import { useAppSettingsStore } from '../stores/AppSettingsStore'; const isInPlaylist = (videoId: string, playlist: PlaylistType) => { return playlist.playlist_entries.some(entry => { @@ -100,15 +101,9 @@ export type SimilarVideosResponseType = { config: ConfigType; }; -export type VideoResponseType = { - data: VideoType; - config: ConfigType; -}; +export type VideoResponseType = VideoType; -type CommentsResponseType = { - data: CommentsType[]; - config: ConfigType; -}; +type CommentsResponseType = CommentsType[]; export type VideoCommentsResponseType = { data: VideoType; @@ -120,6 +115,7 @@ const Video = () => { const { videoId } = useParams() as VideoParams; const navigate = useNavigate(); const isAdmin = useIsAdmin(); + // const { appSettingsConfig } = useAppSettingsStore(); const [videoEnded, setVideoEnded] = useState(false); const [playlistAutoplay, setPlaylistAutoplay] = useState( @@ -142,18 +138,24 @@ const Video = () => { useEffect(() => { (async () => { - if (refreshVideoList || videoId !== videoResponse?.data?.youtube_id) { + if (refreshVideoList || videoId !== videoResponse?.youtube_id) { const videoByIdResponse = await loadVideoById(videoId); const simmilarVideosResponse = await loadSimmilarVideosById(videoId); const customPlaylistsResponse = await loadPlaylistList({ type: 'custom' }); - const commentsResponse = await loadCommentsbyVideoId(videoId); const videoNavResponse = await loadVideoNav(videoId); + try { + const commentsResponse = await loadCommentsbyVideoId(videoId); + setCommentsResponse(commentsResponse); + } catch (e) { + console.log('Comments not found', e); + } + setVideoResponse(videoByIdResponse); setSimmilarVideos(simmilarVideosResponse); setVideoPlaylistNav(videoNavResponse); setCustomPlaylistsResponse(customPlaylistsResponse); - setCommentsResponse(commentsResponse); + setRefreshVideoList(false); } })(); @@ -194,18 +196,18 @@ const Video = () => { return []; } - const video = videoResponse.data; - const watched = videoResponse.data.player.watched; - const config = videoResponse.config; + const video = videoResponse; + const watched = videoResponse.player.watched; + // const config = appSettingsConfig; const playlistNav = videoPlaylistNav; - const sponsorBlock = videoResponse.data.sponsorblock; + const sponsorBlock = videoResponse.sponsorblock; const customPlaylists = customPlaylistsResponse?.data; const starRating = convertStarRating(video?.stats?.average_rating); - const comments = commentsResponse?.data; + const comments = commentsResponse; console.log('playlistNav', playlistNav); - const cast = config.enable_cast; + const cast = false; // config.enable_cast; return ( <> diff --git a/frontend/src/stores/AppSettingsStore.ts b/frontend/src/stores/AppSettingsStore.ts new file mode 100644 index 00000000..72012f9b --- /dev/null +++ b/frontend/src/stores/AppSettingsStore.ts @@ -0,0 +1,42 @@ +import { create } from 'zustand'; +import { AppSettingsConfigType } from '../api/loader/loadAppsettingsConfig'; + +interface AppSettingsState { + appSettingsConfig: AppSettingsConfigType; + setAppSettingsConfig: (appSettingsConfig: AppSettingsConfigType) => void; +} + +export const useAppSettingsStore = create(set => ({ + appSettingsConfig: { + subscriptions: { + channel_size: null, + live_channel_size: null, + shorts_channel_size: null, + auto_start: false, + }, + downloads: { + limit_speed: null, + sleep_interval: null, + autodelete_days: null, + format: null, + format_sort: null, + add_metadata: false, + add_thumbnail: false, + subtitle: null, + subtitle_source: null, + subtitle_index: false, + comment_max: null, + comment_sort: 'asc', + cookie_import: false, + potoken: false, + throttledratelimit: null, + extractor_lang: null, + integrate_ryd: false, + integrate_sponsorblock: false, + }, + application: { + enable_snapshot: false, + }, + }, + setAppSettingsConfig: appSettingsConfig => set({ appSettingsConfig }), +}));