From 6e62179416d3814146dc193a7bbf64164db3afd4 Mon Sep 17 00:00:00 2001 From: kappa118 Date: Wed, 26 Feb 2025 21:45:16 -0500 Subject: [PATCH] now proxying api requests through dev react server, no need for api configuration --- dispatcharr/urls.py | 1 - docker/docker-compose.yml | 4 +-- frontend/package.json | 3 +- frontend/src/App.js | 4 +-- frontend/src/api.js | 3 +- .../src/components/tables/ChannelsTable.js | 2 +- frontend/src/components/tables/EPGsTable.js | 4 +-- frontend/src/components/tables/M3UsTable.js | 4 +-- .../components/tables/StreamProfilesTable.js | 4 +-- .../src/components/tables/StreamsTable.js | 2 +- .../src/components/tables/UserAgentsTable.js | 4 +-- frontend/src/pages/Channels.js | 36 +++++++++---------- frontend/src/pages/Guide.js | 16 ++++++--- frontend/src/pages/Guide2.js | 0 14 files changed, 47 insertions(+), 40 deletions(-) delete mode 100644 frontend/src/pages/Guide2.js diff --git a/dispatcharr/urls.py b/dispatcharr/urls.py index 346a8c5e..d0bc5def 100644 --- a/dispatcharr/urls.py +++ b/dispatcharr/urls.py @@ -26,7 +26,6 @@ urlpatterns = [ path('api/', include(('apps.api.urls', 'api'), namespace='api')), # Admin - path('grappelli/', include('grappelli.urls')), # Grappelli admin path('admin/', admin.site.urls), # Swagger UI diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml index 1d69fe9b..648b9c77 100644 --- a/docker/docker-compose.yml +++ b/docker/docker-compose.yml @@ -6,6 +6,7 @@ services: container_name: dispatcharr_web ports: - "9191:9191" + - "3031:3031" depends_on: - db - redis @@ -25,11 +26,10 @@ services: ui: image: alpine container_name: dispatcharr_ui + network_mode: service:web volumes: - ../frontend:/app entrypoint: ["/bin/sh", "/app/entrypoint.sh"] - ports: - - 3031:3031 celery: build: diff --git a/frontend/package.json b/frontend/package.json index 3809d0a8..8845f0fd 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -48,5 +48,6 @@ "last 1 firefox version", "last 1 safari version" ] - } + }, + "proxy": "http://127.0.0.1:9191" } diff --git a/frontend/src/App.js b/frontend/src/App.js index 812e54a3..0220e64b 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -22,7 +22,7 @@ import { } from '@mui/material'; import theme from './theme'; import EPG from './pages/EPG'; -// import Guide from './pages/Guide'; +import Guide from './pages/Guide'; import StreamProfiles from './pages/StreamProfiles'; import useAuthStore from './store/auth'; import logo from './images/logo.png'; @@ -150,7 +150,7 @@ const App = () => { path="/stream-profiles" element={} /> - {/* } /> */} + } /> ) : ( } /> diff --git a/frontend/src/api.js b/frontend/src/api.js index 4f8629eb..d2b4836e 100644 --- a/frontend/src/api.js +++ b/frontend/src/api.js @@ -10,8 +10,7 @@ import useStreamProfilesStore from './store/streamProfiles'; // withCredentials: true, // }); -const host = 'http://127.0.0.1:9191'; -// const host = ''; +const host = ''; const getAuthToken = async () => { const token = await useAuthStore.getState().getToken(); // Assuming token is stored in Zustand store diff --git a/frontend/src/components/tables/ChannelsTable.js b/frontend/src/components/tables/ChannelsTable.js index 7c458aba..3610d361 100644 --- a/frontend/src/components/tables/ChannelsTable.js +++ b/frontend/src/components/tables/ChannelsTable.js @@ -217,7 +217,7 @@ const Example = () => { ), muiTableContainerProps: { sx: { - height: 'calc(100vh - 90px)', // Subtract padding to avoid cutoff + height: 'calc(100vh - 75px)', // Subtract padding to avoid cutoff overflowY: 'auto', // Internal scrolling for the table }, }, diff --git a/frontend/src/components/tables/EPGsTable.js b/frontend/src/components/tables/EPGsTable.js index 3a1cd986..cb204ab4 100644 --- a/frontend/src/components/tables/EPGsTable.js +++ b/frontend/src/components/tables/EPGsTable.js @@ -149,7 +149,7 @@ const EPGsTable = () => { ), muiTableContainerProps: { sx: { - height: 'calc(42vh - 0px)', + height: 'calc(43vh - 0px)', }, }, renderTopToolbarCustomActions: ({ table }) => ( @@ -177,7 +177,7 @@ const EPGsTable = () => { return ( diff --git a/frontend/src/components/tables/M3UsTable.js b/frontend/src/components/tables/M3UsTable.js index e2b5aa16..7447411d 100644 --- a/frontend/src/components/tables/M3UsTable.js +++ b/frontend/src/components/tables/M3UsTable.js @@ -193,7 +193,7 @@ const Example = () => { ), muiTableContainerProps: { sx: { - height: 'calc(42vh - 0px)', + height: 'calc(43vh - 0px)', }, }, renderTopToolbarCustomActions: ({ table }) => ( @@ -221,7 +221,7 @@ const Example = () => { return ( diff --git a/frontend/src/components/tables/StreamProfilesTable.js b/frontend/src/components/tables/StreamProfilesTable.js index 266f9d96..a00256d1 100644 --- a/frontend/src/components/tables/StreamProfilesTable.js +++ b/frontend/src/components/tables/StreamProfilesTable.js @@ -173,7 +173,7 @@ const StreamProfiles = () => { ), muiTableContainerProps: { sx: { - height: 'calc(100vh - 100px)', // Subtract padding to avoid cutoff + height: 'calc(100vh - 73px)', // Subtract padding to avoid cutoff overflowY: 'auto', // Internal scrolling for the table }, }, @@ -202,7 +202,7 @@ const StreamProfiles = () => { return ( diff --git a/frontend/src/components/tables/StreamsTable.js b/frontend/src/components/tables/StreamsTable.js index 891c4800..dcfffdac 100644 --- a/frontend/src/components/tables/StreamsTable.js +++ b/frontend/src/components/tables/StreamsTable.js @@ -160,7 +160,7 @@ const Example = () => { ), muiTableContainerProps: { sx: { - height: 'calc(100vh - 90px)', // Subtract padding to avoid cutoff + height: 'calc(100vh - 75px)', // Subtract padding to avoid cutoff overflowY: 'auto', // Internal scrolling for the table }, }, diff --git a/frontend/src/components/tables/UserAgentsTable.js b/frontend/src/components/tables/UserAgentsTable.js index afbdcce2..d546a734 100644 --- a/frontend/src/components/tables/UserAgentsTable.js +++ b/frontend/src/components/tables/UserAgentsTable.js @@ -173,7 +173,7 @@ const UserAgentsTable = () => { ), muiTableContainerProps: { sx: { - height: 'calc(42vh - 10px)', + height: 'calc(42vh + 5px)', }, }, renderTopToolbarCustomActions: ({ table }) => ( @@ -202,7 +202,7 @@ const UserAgentsTable = () => { <> diff --git a/frontend/src/pages/Channels.js b/frontend/src/pages/Channels.js index 99a1652e..68a32df1 100644 --- a/frontend/src/pages/Channels.js +++ b/frontend/src/pages/Channels.js @@ -1,7 +1,7 @@ -import React from "react"; -import ChannelsTable from "../components/tables/ChannelsTable"; -import StreamsTable from "../components/tables/StreamsTable"; -import { Grid2, Box } from "@mui/material"; +import React from 'react'; +import ChannelsTable from '../components/tables/ChannelsTable'; +import StreamsTable from '../components/tables/StreamsTable'; +import { Grid2, Box } from '@mui/material'; const ChannelsPage = () => { return ( @@ -9,13 +9,13 @@ const ChannelsPage = () => { @@ -24,13 +24,13 @@ const ChannelsPage = () => { diff --git a/frontend/src/pages/Guide.js b/frontend/src/pages/Guide.js index 2b72ee6c..e9fd294b 100644 --- a/frontend/src/pages/Guide.js +++ b/frontend/src/pages/Guide.js @@ -3,6 +3,7 @@ import { Box, Typography, Avatar, Paper, Tooltip, Stack } from '@mui/material'; import dayjs from 'dayjs'; import API from '../api'; import useChannelsStore from '../store/channels'; +import logo from '../images/logo.png'; const CHANNEL_WIDTH = 100; const PROGRAM_HEIGHT = 80; @@ -13,6 +14,7 @@ const TVChannelGuide = ({ startDate, endDate }) => { const [programs, setPrograms] = useState([]); const [guideChannels, setGuideChannels] = useState([]); + const [now, setNow] = useState(dayjs()); const guideRef = useRef(null); @@ -36,8 +38,6 @@ const TVChannelGuide = ({ startDate, endDate }) => { fetchPrograms(); }, [channels]); - const now = dayjs(); - const latestHalfHour = new Date(); // Round down the minutes to the nearest half hour @@ -126,6 +126,14 @@ const TVChannelGuide = ({ startDate, endDate }) => { ); }; + useEffect(() => { + const interval = setInterval(() => { + setNow(dayjs()); + }, 60000); // Update every minute + + return () => clearInterval(interval); + }, []); + const nowPosition = useMemo(() => { if (now.isBefore(start) || now.isAfter(end)) return -1; const totalMinutes = end.diff(start, 'minute'); @@ -175,7 +183,7 @@ const TVChannelGuide = ({ startDate, endDate }) => { }} > {/* @@ -188,7 +196,7 @@ const TVChannelGuide = ({ startDate, endDate }) => { {/* Timeline and Lineup */} - +