Localize translation config notice

This commit is contained in:
Deluan 2020-04-29 11:58:42 -04:00 committed by Deluan Quintão
parent c816ca4525
commit 716de24f1e
4 changed files with 95 additions and 77 deletions

View File

@ -60,6 +60,17 @@ export default deepmerge(englishMessages, {
passwordDoesNotMatch: 'Password does not match',
},
},
message: {
note: 'NOTE',
transcodingDisabled:
'Changing the transcoding configuration through the web interface is disabled for security ' +
'reasons. If you would like to change (edit or add) transcoding options, restart the server with ' +
'the %{config} configuration option.',
transcodingEnabled:
'Navidrome is currently running with %{config}, making it possible to run system ' +
'commands from the transcoding settings using the web interface. We recommend to disable it for security reasons ' +
'and only enable it when configuring Transcoding options.',
},
menu: {
library: 'Library',
settings: 'Settings',

View File

@ -1,14 +1,14 @@
import React from 'react'
import {
TextInput,
SelectInput,
Edit,
required,
SelectInput,
SimpleForm,
TextInput,
useTranslate,
} from 'react-admin'
import { Card, CardContent, Typography, Box } from '@material-ui/core'
import { Title } from '../common'
import { TranscodingNote } from './TranscodingNote'
const TranscodingTitle = ({ record }) => {
const translate = useTranslate()
@ -18,49 +18,36 @@ const TranscodingTitle = ({ record }) => {
return <Title subTitle={`${resourceName} ${record ? record.name : ''}`} />
}
const TranscodingEdit = (props) => (
<>
<Card>
<CardContent>
<Typography>
<Box fontWeight="fontWeightBold" component={'span'}>
NOTE:
</Box>{' '}
Navidrome is currently running with the{' '}
<Box fontFamily="Monospace" component={'span'}>
ND_ENABLETRANSCODINGCONFIG=true
</Box>
, making it possible to run system commands from the transcoding
settings using the web interface. We recommend to disable it for
security reasons and only enable it when configuring Transcoding
options.
</Typography>
</CardContent>
</Card>
<Edit title={<TranscodingTitle />} {...props}>
<SimpleForm>
<TextInput source="name" validate={[required()]} />
<TextInput source="targetFormat" validate={[required()]} />
<SelectInput
source="defaultBitRate"
choices={[
{ id: 32, name: '32' },
{ id: 48, name: '48' },
{ id: 64, name: '64' },
{ id: 80, name: '80' },
{ id: 96, name: '96' },
{ id: 112, name: '112' },
{ id: 128, name: '128' },
{ id: 160, name: '160' },
{ id: 192, name: '192' },
{ id: 256, name: '256' },
{ id: 320, name: '320' },
]}
/>
<TextInput source="command" fullWidth validate={[required()]} />
</SimpleForm>
</Edit>
</>
)
const TranscodingEdit = (props) => {
return (
<>
<TranscodingNote message={'message.transcodingEnabled'} />
<Edit title={<TranscodingTitle />} {...props}>
<SimpleForm>
<TextInput source="name" validate={[required()]} />
<TextInput source="targetFormat" validate={[required()]} />
<SelectInput
source="defaultBitRate"
choices={[
{ id: 32, name: '32' },
{ id: 48, name: '48' },
{ id: 64, name: '64' },
{ id: 80, name: '80' },
{ id: 96, name: '96' },
{ id: 112, name: '112' },
{ id: 128, name: '128' },
{ id: 160, name: '160' },
{ id: 192, name: '192' },
{ id: 256, name: '256' },
{ id: 320, name: '320' },
]}
/>
<TextInput source="command" fullWidth validate={[required()]} />
</SimpleForm>
</Edit>
</>
)
}
export default TranscodingEdit

View File

@ -0,0 +1,33 @@
import React from 'react'
import { Card, CardContent, Typography, Box } from '@material-ui/core'
import { useTranslate } from 'react-admin'
export const Interpolate = ({ message, field, children }) => {
const split = message.split(`%{${field}}`)
return (
<span>
{split[0]}
{children}
{split[1]}
</span>
)
}
export const TranscodingNote = ({ message }) => {
const translate = useTranslate()
return (
<Card>
<CardContent>
<Typography>
<Box fontWeight="fontWeightBold" component={'span'}>
{translate('message.note')}:
</Box>{' '}
<Interpolate message={translate(message)} field={'config'}>
<Box fontFamily="Monospace" component={'span'}>
ND_ENABLETRANSCODINGCONFIG=true
</Box>
</Interpolate>
</Typography>
</CardContent>
</Card>
)
}

View File

@ -1,40 +1,27 @@
import React from 'react'
import { TextField, Show, SimpleShowLayout } from 'react-admin'
import { Card, CardContent, Typography, Box } from '@material-ui/core'
import { Show, SimpleShowLayout, TextField } from 'react-admin'
import { Title } from '../common'
import { TranscodingNote } from './TranscodingNote'
const TranscodingTitle = ({ record }) => {
return <Title subTitle={`Transcoding ${record ? record.name : ''}`} />
}
const TranscodingShow = (props) => (
<>
<Card>
<CardContent>
<Typography>
<Box fontWeight="fontWeightBold" component={'span'}>
NOTE:
</Box>{' '}
Changing the transcoding configuration through the web interface is
disabled for security reasons. If you would like to change (edit or
add) transcoding options, restart the server with the{' '}
<Box fontFamily="Monospace" component={'span'}>
ND_ENABLETRANSCODINGCONFIG=true
</Box>{' '}
configuration option.
</Typography>
</CardContent>
</Card>
const TranscodingShow = (props) => {
return (
<>
<TranscodingNote message={'message.transcodingDisabled'} />
<Show title={<TranscodingTitle />} {...props}>
<SimpleShowLayout>
<TextField source="name" />
<TextField source="targetFormat" />
<TextField source="defaultBitRate" />
<TextField source="command" />
</SimpleShowLayout>
</Show>
</>
)
<Show title={<TranscodingTitle />} {...props}>
<SimpleShowLayout>
<TextField source="name" />
<TextField source="targetFormat" />
<TextField source="defaultBitRate" />
<TextField source="command" />
</SimpleShowLayout>
</Show>
</>
)
}
export default TranscodingShow