nik/navidrome
1
0
Fork 0
mirror of https://github.com/navidrome/navidrome.git synced 2026-05-03 06:51:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor share URLs section into accordion in ShareEdit

Browse Source 
Replaces the static display of share URLs and embed code with an expandable Accordion component for improved UI organization and user experience in the ShareEdit form.
This commit is contained in:
Sora 2026-01-19 13:48:01 +08:00
parent 1baadd8293
commit bb54195955
1 changed files with 36 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
ui/src/share/ShareEdit.jsx
View File

@ -8,10 +8,11 @@ import {
useTranslate,
} from 'react-admin'
import { sharePlayerUrl, shareAPlayerUrl } from '../utils'
import { Link, Box, Typography, Divider } from '@material-ui/core'
import { Link, Box, Typography, Divider, Accordion, AccordionSummary, AccordionDetails } from '@material-ui/core'
import { DateField } from '../common'
import config from '../config'
import { EmbedCodeField } from './EmbedCodeField'
import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
export const ShareEdit = (props) => {
const { id, basePath, hasCreate, ...rest } = props
@ -21,29 +22,6 @@ export const ShareEdit = (props) => {
return (
<Edit {...props}>
<SimpleForm {...rest}>
<Box mb={2}>
<Typography variant="body2" color="textSecondary" gutterBottom>
{translate('message.shareUrl')}
</Typography>
<Link href={url} target="_blank" rel="noopener noreferrer">
{url}
</Link>
</Box>
<Box mb={2}>
<Typography variant="body2" color="textSecondary" gutterBottom>
{translate('message.aplayerEmbedUrl')}
</Typography>
<Link href={aplayerUrl} target="_blank" rel="noopener noreferrer">
{aplayerUrl}
</Link>
</Box>
<Box mb={3}>
<Divider />
</Box>
<EmbedCodeField url={aplayerUrl} title={translate('message.navidromeMusicPlayer')} />
<Box mb={3}>
<Divider />
</Box>
<TextInput source="description" />
{config.enableDownloads && <BooleanInput source="downloadable" />}
<DateTimeInput source="expiresAt" />
@ -54,6 +32,40 @@ export const ShareEdit = (props) => {
<NumberField source="visitCount" disabled />
<DateField source="lastVisitedAt" disabled showTime />
<DateField source="createdAt" disabled showTime />
<Accordion>
<AccordionSummary
expandIcon={<ExpandMoreIcon />}
aria-controls="share-urls-content"
id="share-urls-header"
>
<Typography variant="body2" color="textSecondary">
{translate('message.shareUrl')} & {translate('message.aplayerEmbedUrl')}
</Typography>
</AccordionSummary>
<AccordionDetails>
<Box mb={2}>
<Typography variant="body2" color="textSecondary" gutterBottom>
{translate('message.shareUrl')}
</Typography>
<Link href={url} target="_blank" rel="noopener noreferrer">
{url}
</Link>
</Box>
<Box mb={2}>
<Typography variant="body2" color="textSecondary" gutterBottom>
{translate('message.aplayerEmbedUrl')}
</Typography>
<Link href={aplayerUrl} target="_blank" rel="noopener noreferrer">
{aplayerUrl}
</Link>
</Box>
<Box mb={3}>
<Divider />
</Box>
<EmbedCodeField url={aplayerUrl} title={translate('message.navidromeMusicPlayer')} />
</AccordionDetails>
</Accordion>
</SimpleForm>
</Edit>
)