Mirrors/Dispatcharr
1
0
Fork 1
mirror of https://github.com/Dispatcharr/Dispatcharr.git synced 2026-01-23 02:35:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Lazy-loading button modals

Browse source
This commit is contained in:
Nick Sandstrom 2025-12-24 23:13:07 -08:00
parent ca96adf781
commit a5688605cd
1 changed files with 32 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

51
frontend/src/pages/Guide.jsx
View file

@ -5,6 +5,7 @@ import React, {
useEffect, useEffect,
useRef, useRef,
useCallback, useCallback,
Suspense,
} from 'react'; } from 'react';
import useChannelsStore from '../store/channels'; import useChannelsStore from '../store/channels';
import useLogosStore from '../store/logos'; import useLogosStore from '../store/logos';
@ -16,6 +17,7 @@ import {
Button, Button,
Flex, Flex,
Group, Group,
LoadingOverlay,
Paper, Paper,
Select, Select,
Text, Text,
@ -77,9 +79,12 @@ import {
} from '../utils/dateTimeUtils.js'; } from '../utils/dateTimeUtils.js';
import GuideRow from '../components/GuideRow.jsx'; import GuideRow from '../components/GuideRow.jsx';
import HourTimeline from '../components/HourTimeline'; import HourTimeline from '../components/HourTimeline';
import ProgramRecordingModal from '../components/forms/ProgramRecordingModal'; const ProgramRecordingModal = React.lazy(() =>
import SeriesRecordingModal from '../components/forms/SeriesRecordingModal'; import('../components/forms/ProgramRecordingModal'));
const SeriesRecordingModal = React.lazy(() =>
import('../components/forms/SeriesRecordingModal'));
import { showNotification } from '../utils/notificationUtils.js'; import { showNotification } from '../utils/notificationUtils.js';
import ErrorBoundary from '../components/ErrorBoundary.jsx';
export default function TVChannelGuide({ startDate, endDate }) { export default function TVChannelGuide({ startDate, endDate }) {
const channels = useChannelsStore((s) => s.channels); const channels = useChannelsStore((s) => s.channels);
@ -1219,27 +1224,35 @@ export default function TVChannelGuide({ startDate, endDate }) {
</Box> </Box>
{/* Record choice modal */} {/* Record choice modal */}
{recordChoiceOpen && recordChoiceProgram && ( {recordChoiceOpen && recordChoiceProgram && (
<ProgramRecordingModal <ErrorBoundary>
opened={recordChoiceOpen} <Suspense fallback={<LoadingOverlay />}>
onClose={() => setRecordChoiceOpen(false)} <ProgramRecordingModal
program={recordChoiceProgram} opened={recordChoiceOpen}
recording={recordingForProgram} onClose={() => setRecordChoiceOpen(false)}
existingRuleMode={existingRuleMode} program={recordChoiceProgram}
onRecordOne={() => recordOne(recordChoiceProgram)} recording={recordingForProgram}
onRecordSeriesAll={() => saveSeriesRule(recordChoiceProgram, 'all')} existingRuleMode={existingRuleMode}
onRecordSeriesNew={() => saveSeriesRule(recordChoiceProgram, 'new')} onRecordOne={() => recordOne(recordChoiceProgram)}
onExistingRuleModeChange={setExistingRuleMode} onRecordSeriesAll={() => saveSeriesRule(recordChoiceProgram, 'all')}
/> onRecordSeriesNew={() => saveSeriesRule(recordChoiceProgram, 'new')}
onExistingRuleModeChange={setExistingRuleMode}
/>
</Suspense>
</ErrorBoundary>
)} )}
{/* Series rules modal */} {/* Series rules modal */}
{rulesOpen && ( {rulesOpen && (
<SeriesRecordingModal <ErrorBoundary>
opened={rulesOpen} <Suspense fallback={<LoadingOverlay />}>
onClose={() => setRulesOpen(false)} <SeriesRecordingModal
rules={rules} opened={rulesOpen}
onRulesUpdate={setRules} onClose={() => setRulesOpen(false)}
/> rules={rules}
onRulesUpdate={setRules}
/>
</Suspense>
</ErrorBoundary>
)} )}
</Box> </Box>
); );