Update manage repositories button and use legacy grid

This commit is contained in:
Bill Thornton
2025-07-25 17:30:13 -04:00
parent 93821aed8c
commit 4fd2a4041f
3 changed files with 66 additions and 33 deletions

View File

@@ -361,7 +361,15 @@ export default tseslint.config(
} }
} }
], ],
'@typescript-eslint/no-deprecated': 'warn', '@typescript-eslint/no-deprecated': [
'warn',
{
allow: [
// Allow the deprecated Grid component from mui since JMP does not support CSS gap on some OSs
{ from: '@mui/material/Grid', name: 'Grid' }
]
}
],
'@typescript-eslint/no-floating-promises': 'error', '@typescript-eslint/no-floating-promises': 'error',
'@typescript-eslint/prefer-string-starts-ends-with': 'error' '@typescript-eslint/prefer-string-starts-ends-with': 'error'
} }

View File

@@ -1,10 +1,9 @@
import Settings from '@mui/icons-material/Settings';
import Alert from '@mui/material/Alert'; import Alert from '@mui/material/Alert';
import Box from '@mui/material/Box'; import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import Chip from '@mui/material/Chip'; import Chip from '@mui/material/Chip';
import Divider from '@mui/material/Divider'; import Divider from '@mui/material/Divider';
import Grid from '@mui/material/Grid2'; import Grid from '@mui/material/Grid';
import IconButton from '@mui/material/IconButton/IconButton';
import Stack from '@mui/material/Stack'; import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import React, { useCallback, useMemo, useState } from 'react'; import React, { useCallback, useMemo, useState } from 'react';
@@ -20,7 +19,6 @@ import { PluginStatusOption } from 'apps/dashboard/features/plugins/constants/pl
import Loading from 'components/loading/LoadingComponent'; import Loading from 'components/loading/LoadingComponent';
import Page from 'components/Page'; import Page from 'components/Page';
import globalize from 'lib/globalize'; import globalize from 'lib/globalize';
/** /**
* The list of primary/main categories. * The list of primary/main categories.
* Any category not in this list will be added to the "other" category. * Any category not in this list will be added to the "other" category.
@@ -101,35 +99,53 @@ export const Component = () => {
</Alert> </Alert>
) : ( ) : (
<Stack spacing={2}> <Stack spacing={2}>
<Grid <Stack
container direction='row'
spacing={2} sx={{
flexWrap: {
xs: 'wrap',
sm: 'nowrap'
}
}}
> >
<Grid size={{ xs: 12, sm: 8 }}> <Typography
<Typography variant='h1'
variant='h1' component='span'
component='span' sx={{
sx={{ flexGrow: 1,
marginRight: 2, verticalAlign: 'middle'
verticalAlign: 'middle' }}
}} >
> {globalize.translate('TabPlugins')}
{globalize.translate('TabPlugins')} </Typography>
</Typography>
<IconButton <Button
component={Link} component={Link}
to='/dashboard/plugins/repositories' to='/dashboard/plugins/repositories'
> variant='outlined'
<Settings /> sx={{
</IconButton> marginLeft: 2
</Grid> }}
>
{globalize.translate('ManageRepositories')}
</Button>
<Grid <Box
size={{ xs: 12, sm: 4 }}
sx={{ sx={{
display: 'flex', display: 'flex',
justifyContent: 'end' justifyContent: 'end',
marginTop: {
xs: 2,
sm: 0
},
marginLeft: {
xs: 0,
sm: 2
},
width: {
xs: '100%',
sm: 'auto'
}
}} }}
> >
<SearchInput <SearchInput
@@ -137,8 +153,8 @@ export const Component = () => {
value={searchQuery} value={searchQuery}
onChange={onSearchChange} onChange={onSearchChange}
/> />
</Grid> </Box>
</Grid> </Stack>
<Box> <Box>
<Stack <Stack
@@ -201,9 +217,17 @@ export const Component = () => {
<Box> <Box>
{filteredPlugins.length > 0 ? ( {filteredPlugins.length > 0 ? (
<Grid container spacing={2} columns={{ xs: 1, sm: 4, md: 9, lg: 8, xl: 10 }}> <Grid container spacing={2}>
{filteredPlugins.map(plugin => ( {filteredPlugins.map(plugin => (
<Grid key={plugin.id} size={{ xs: 1, sm: 2, md: 3, lg: 2 }}> <Grid
key={plugin.id}
item
xs={12}
sm={6}
md={4}
lg={3}
xl={2}
>
<PluginCard <PluginCard
plugin={plugin} plugin={plugin}
/> />

View File

@@ -1075,6 +1075,7 @@
"LyricDownloadersHelp": "Enable and rank your preferred lyric downloaders in order of priority.", "LyricDownloadersHelp": "Enable and rank your preferred lyric downloaders in order of priority.",
"ManageLibrary": "Manage library", "ManageLibrary": "Manage library",
"ManageRecording": "Manage recording", "ManageRecording": "Manage recording",
"ManageRepositories": "Manage Repositories",
"MapChannels": "Map Channels", "MapChannels": "Map Channels",
"MarkPlayed": "Mark played", "MarkPlayed": "Mark played",
"MarkUnplayed": "Mark unplayed", "MarkUnplayed": "Mark unplayed",