Skip to content

Commit cdde002

Browse files
authored
Merge pull request #7271 from viown/fix-tuner-device-list
2 parents 7491722 + fb7a153 commit cdde002

File tree

2 files changed

+63
-51
lines changed

2 files changed

+63
-51
lines changed

src/apps/dashboard/features/livetv/components/TunerDeviceCard.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,6 @@ const TunerDeviceCard = ({ tunerHost }: TunerDeviceCardProps) => {
7878
title={tunerHost.FriendlyName || getTunerName(tunerHost.Type) || ''}
7979
text={tunerHost.Url || ''}
8080
icon={<DvrIcon sx={{ fontSize: 70 }} />}
81-
width={340}
8281
action={true}
8382
actionRef={actionRef}
8483
onActionClick={onActionClick}

src/apps/dashboard/routes/livetv/index.tsx

Lines changed: 63 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import useLiveTasks from 'apps/dashboard/features/tasks/hooks/useLiveTasks';
1212
import Button from '@mui/material/Button';
1313
import RefreshIcon from '@mui/icons-material/Refresh';
1414
import AddIcon from '@mui/icons-material/Add';
15-
import { Form, Link, useNavigate } from 'react-router-dom';
15+
import { Link, useNavigate } from 'react-router-dom';
1616
import { useStartTask } from 'apps/dashboard/features/tasks/api/useStartTask';
1717
import { TaskState } from '@jellyfin/sdk/lib/generated-client/models/task-state';
1818
import TaskProgress from 'apps/dashboard/features/tasks/components/TaskProgress';
@@ -22,6 +22,7 @@ import ListItemText from '@mui/material/ListItemText';
2222
import Alert from '@mui/material/Alert';
2323
import List from '@mui/material/List';
2424
import Provider from 'apps/dashboard/features/livetv/components/Provider';
25+
import Grid from '@mui/material/Grid';
2526

2627
const CONFIG_KEY = 'livetv';
2728

@@ -81,33 +82,44 @@ export const Component = () => {
8182
className='mainAnimatedPage type-interior'
8283
>
8384
<Box className='content-primary'>
84-
<Form>
85-
{(isConfigError || isTasksError) ? (
86-
<Alert severity='error'>{globalize.translate('HeaderError')}</Alert>
87-
) : (
88-
<Stack spacing={3}>
89-
<Typography variant='h2'>{globalize.translate('HeaderTunerDevices')}</Typography>
90-
91-
<Button
92-
sx={{ alignSelf: 'flex-start' }}
93-
startIcon={<AddIcon />}
94-
component={Link}
95-
to='/dashboard/livetv/tuner'
96-
>
97-
{globalize.translate('ButtonAddTunerDevice')}
98-
</Button>
99-
100-
<Stack direction='row' spacing={2}>
101-
{ config.TunerHosts?.map(tunerHost => (
102-
<TunerDeviceCard
85+
{(isConfigError || isTasksError) ? (
86+
<Alert severity='error'>{globalize.translate('HeaderError')}</Alert>
87+
) : (
88+
<Stack spacing={3}>
89+
<Typography variant='h2'>{globalize.translate('HeaderTunerDevices')}</Typography>
90+
91+
<Button
92+
sx={{ alignSelf: 'flex-start' }}
93+
startIcon={<AddIcon />}
94+
component={Link}
95+
to='/dashboard/livetv/tuner'
96+
>
97+
{globalize.translate('ButtonAddTunerDevice')}
98+
</Button>
99+
100+
<Box>
101+
<Grid container spacing={2}>
102+
{config.TunerHosts?.map(tunerHost => (
103+
<Grid
103104
key={tunerHost.Id}
104-
tunerHost={tunerHost}
105-
/>
106-
)) }
107-
</Stack>
105+
item
106+
xs={12}
107+
sm={6}
108+
md={3}
109+
lg={2.4}
110+
>
111+
<TunerDeviceCard
112+
key={tunerHost.Id}
113+
tunerHost={tunerHost}
114+
/>
115+
</Grid>
116+
))}
117+
</Grid>
118+
</Box>
108119

109-
<Typography variant='h2'>{globalize.translate('HeaderGuideProviders')}</Typography>
120+
<Typography variant='h2'>{globalize.translate('HeaderGuideProviders')}</Typography>
110121

122+
<Stack sx={{ alignSelf: 'flex-start' }} spacing={2}>
111123
<Stack direction='row' spacing={1.5}>
112124
<Button
113125
sx={{ alignSelf: 'flex-start' }}
@@ -132,32 +144,33 @@ export const Component = () => {
132144
{(refreshGuideTask && refreshGuideTask.State === TaskState.Running) && (
133145
<TaskProgress task={refreshGuideTask} />
134146
)}
135-
<Menu
136-
anchorEl={anchorEl}
137-
open={isMenuOpen}
138-
onClose={onMenuClose}
139-
>
140-
<MenuItem onClick={navigateToSchedulesDirect}>
141-
<ListItemText>Schedules Direct</ListItemText>
142-
</MenuItem>
143-
<MenuItem onClick={navigateToXMLTV}>
144-
<ListItemText>XMLTV</ListItemText>
145-
</MenuItem>
146-
</Menu>
147-
148-
{(config.ListingProviders && config.ListingProviders?.length > 0) && (
149-
<List sx={{ backgroundColor: 'background.paper' }}>
150-
{config.ListingProviders?.map(provider => (
151-
<Provider
152-
key={provider.Id}
153-
provider={provider}
154-
/>
155-
))}
156-
</List>
157-
)}
158147
</Stack>
159-
)}
160-
</Form>
148+
149+
<Menu
150+
anchorEl={anchorEl}
151+
open={isMenuOpen}
152+
onClose={onMenuClose}
153+
>
154+
<MenuItem onClick={navigateToSchedulesDirect}>
155+
<ListItemText>Schedules Direct</ListItemText>
156+
</MenuItem>
157+
<MenuItem onClick={navigateToXMLTV}>
158+
<ListItemText>XMLTV</ListItemText>
159+
</MenuItem>
160+
</Menu>
161+
162+
{(config.ListingProviders && config.ListingProviders?.length > 0) && (
163+
<List sx={{ backgroundColor: 'background.paper' }}>
164+
{config.ListingProviders?.map(provider => (
165+
<Provider
166+
key={provider.Id}
167+
provider={provider}
168+
/>
169+
))}
170+
</List>
171+
)}
172+
</Stack>
173+
)}
161174
</Box>
162175
</Page>
163176
);

0 commit comments

Comments
 (0)