sovonegr/TorrServerJellyfin
1
0
Fork 0
mirror of https://github.com/Ernous/TorrServerJellyfin.git synced 2025-12-19 13:36:09 +05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #74 from YouROK/use-auto-dark-palette-and-About

Browse Source 
Use auto dark palette and about
This commit is contained in:
dancheskus
2021-06-18 13:40:55 +03:00
committed by GitHub
parent 91fc0a3579 ba0e121b5d
commit 2a46b3df66
10 changed files with 399 additions and 339 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
build-all.sh
View File

@@ -56,7 +56,7 @@ for PLATFORM in "${PLATFORMS[@]}"; do
set_goarm "$GOARCH" set_goarm "$GOARCH"
BIN_FILENAME="${OUTPUT}-${GOOS}-${GOARCH}${GOARM}" BIN_FILENAME="${OUTPUT}-${GOOS}-${GOARCH}${GOARM}"
if [[ "${GOOS}" == "windows" ]]; then BIN_FILENAME="${BIN_FILENAME}.exe"; fi if [[ "${GOOS}" == "windows" ]]; then BIN_FILENAME="${BIN_FILENAME}.exe"; fi
CMD="GOOS=${GOOS} GOARCH=${GOARCH} ${GO_ARM} CGO_ENABLED=1 ${GOBIN} build ${BUILD_FLAGS} -o ${BIN_FILENAME} ./cmd" CMD="GOOS=${GOOS} GOARCH=${GOARCH} ${GO_ARM} ${GOBIN} build ${BUILD_FLAGS} -o ${BIN_FILENAME} ./cmd"
echo "${CMD}" echo "${CMD}"
eval "$CMD" || FAILURES="${FAILURES} ${GOOS}/${GOARCH}${GOARM}" eval "$CMD" || FAILURES="${FAILURES} ${GOOS}/${GOARCH}${GOARM}"
done done

72
web/src/components/About.jsx
View File

@@ -11,6 +11,8 @@ import ListItemIcon from '@material-ui/core/ListItemIcon'
import ListItemText from '@material-ui/core/ListItemText' import ListItemText from '@material-ui/core/ListItemText'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { echoHost } from 'utils/Hosts' import { echoHost } from 'utils/Hosts'
import { ThemeProvider } from '@material-ui/core/styles'
import { lightTheme } from 'components/App'
export default function AboutDialog() { export default function AboutDialog() {
const { t } = useTranslation() const { t } = useTranslation()
@@ -29,39 +31,55 @@ export default function AboutDialog() {
<ListItemText primary={t('About')} /> <ListItemText primary={t('About')} />
</ListItem> </ListItem>
<Dialog open={open} onClose={() => setOpen(false)} aria-labelledby='form-dialog-title' fullWidth maxWidth='lg'> <ThemeProvider theme={lightTheme}>
<DialogTitle id='form-dialog-title'>{t('About')}</DialogTitle> <Dialog open={open} onClose={() => setOpen(false)} aria-labelledby='form-dialog-title' fullWidth maxWidth='sm'>
<DialogTitle id='form-dialog-title'>{t('About')}</DialogTitle>
<DialogContent>
<center>
<h2>TorrServer {torrServerVersion}</h2>
<a href='https://github.com/YouROK/TorrServer'>https://github.com/YouROK/TorrServer</a>
</center>
<DialogContent> <DialogContent>
<center> <center>
<h2>{t('ThanksToEveryone')}</h2> <h2>TorrServer {torrServerVersion}</h2>
<a style={{ color: '#00a572' }} href='https://github.com/YouROK/TorrServer'>
https://github.com/YouROK/TorrServer
</a>
</center> </center>
<br /> <DialogContent>
<h2>{t('SpecialThanks')}</h2> <center>
<b>anacrolix Matt Joiner</b> <a href='https://github.com/anacrolix/'>github.com/anacrolix</a> <h2>{t('ThanksToEveryone')}</h2>
<br /> </center>
<b>nikk</b> <a href='https://github.com/tsynik'>github.com/tsynik</a> <br />
<br /> <h2>{t('SpecialThanks')}</h2>
<b>dancheskus</b> <a href='https://github.com/dancheskus'>github.com/dancheskus</a> <b>anacrolix Matt Joiner</b>&nbsp;
<br /> <a style={{ color: '#00a572' }} href='https://github.com/anacrolix/'>
<b>tw1cker Руслан Пахнев</b> <a href='https://github.com/Nemiroff'>github.com/Nemiroff</a> github.com/anacrolix
<br /> </a>
<b>SpAwN_LMG</b> <br />
<br /> <b>nikk</b>&nbsp;
<a style={{ color: '#00a572' }} href='https://github.com/tsynik'>
github.com/tsynik
</a>
<br />
<b>dancheskus</b>&nbsp;
<a style={{ color: '#00a572' }} href='https://github.com/dancheskus'>
github.com/dancheskus
</a>
<br />
<b>tw1cker Руслан Пахнев</b>&nbsp;
<a style={{ color: '#00a572' }} href='https://github.com/Nemiroff'>
github.com/Nemiroff
</a>
<br />
<b>SpAwN_LMG</b>
<br />
</DialogContent>
</DialogContent> </DialogContent>
</DialogContent>
<DialogActions> <DialogActions>
<Button onClick={() => setOpen(false)} color='primary' variant='outlined' autoFocus> <Button onClick={() => setOpen(false)} color='primary' variant='outlined' autoFocus>
{t('Close')} {t('Close')}
</Button> </Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
</ThemeProvider>
</div> </div>
) )
} }

124
web/src/components/Add/AddDialog.jsx
View File

@@ -12,6 +12,8 @@ import usePreviousState from 'utils/usePreviousState'
import { useQuery } from 'react-query' import { useQuery } from 'react-query'
import { getTorrents } from 'utils/Utils' import { getTorrents } from 'utils/Utils'
import parseTorrent from 'parse-torrent' import parseTorrent from 'parse-torrent'
import { ThemeProvider } from '@material-ui/core/styles'
import { lightTheme } from 'components/App'
import { checkImageURL, getMoviePosters, chechTorrentSource, parseTorrentTitle } from './helpers' import { checkImageURL, getMoviePosters, chechTorrentSource, parseTorrentTitle } from './helpers'
import { ButtonWrapper, Content, Header } from './style' import { ButtonWrapper, Content, Header } from './style'
@@ -204,69 +206,75 @@ export default function AddDialog({
} }
return ( return (
<Dialog <ThemeProvider theme={lightTheme}>
open <Dialog
onClose={handleClose} open
aria-labelledby='form-dialog-title' onClose={handleClose}
fullScreen={fullScreen} aria-labelledby='form-dialog-title'
fullWidth fullScreen={fullScreen}
maxWidth='md' fullWidth
> maxWidth='md'
<Header>{t(isEditMode ? 'EditTorrent' : 'AddNewTorrent')}</Header> >
<Header>{t(isEditMode ? 'EditTorrent' : 'AddNewTorrent')}</Header>
<Content isEditMode={isEditMode}> <Content isEditMode={isEditMode}>
{!isEditMode && ( {!isEditMode && (
<LeftSideComponent <LeftSideComponent
setIsUserInteractedWithPoster={setIsUserInteractedWithPoster}
setSelectedFile={setSelectedFile}
torrentSource={torrentSource}
setTorrentSource={setTorrentSource}
selectedFile={selectedFile}
/>
)}
<RightSideComponent
originalTorrentTitle={originalTorrentTitle}
setTitle={setTitle}
setPosterUrl={setPosterUrl}
setIsPosterUrlCorrect={setIsPosterUrlCorrect}
setIsUserInteractedWithPoster={setIsUserInteractedWithPoster} setIsUserInteractedWithPoster={setIsUserInteractedWithPoster}
setSelectedFile={setSelectedFile} setPosterList={setPosterList}
isTorrentSourceCorrect={isTorrentSourceCorrect}
isHashAlreadyExists={isHashAlreadyExists}
title={title}
parsedTitle={parsedTitle}
posterUrl={posterUrl}
isPosterUrlCorrect={isPosterUrlCorrect}
posterList={posterList}
currentLang={currentLang}
posterSearchLanguage={posterSearchLanguage}
setPosterSearchLanguage={setPosterSearchLanguage}
posterSearch={posterSearch}
removePoster={removePoster}
updateTitleFromSource={updateTitleFromSource}
torrentSource={torrentSource} torrentSource={torrentSource}
setTorrentSource={setTorrentSource} isCustomTitleEnabled={isCustomTitleEnabled}
selectedFile={selectedFile} setIsCustomTitleEnabled={setIsCustomTitleEnabled}
isEditMode={isEditMode}
/> />
)} </Content>
<RightSideComponent <ButtonWrapper>
originalTorrentTitle={originalTorrentTitle} <Button onClick={handleClose} color='primary' variant='outlined'>
setTitle={setTitle} {t('Cancel')}
setPosterUrl={setPosterUrl} </Button>
setIsPosterUrlCorrect={setIsPosterUrlCorrect}
setIsUserInteractedWithPoster={setIsUserInteractedWithPoster}
setPosterList={setPosterList}
isTorrentSourceCorrect={isTorrentSourceCorrect}
isHashAlreadyExists={isHashAlreadyExists}
title={title}
parsedTitle={parsedTitle}
posterUrl={posterUrl}
isPosterUrlCorrect={isPosterUrlCorrect}
posterList={posterList}
currentLang={currentLang}
posterSearchLanguage={posterSearchLanguage}
setPosterSearchLanguage={setPosterSearchLanguage}
posterSearch={posterSearch}
removePoster={removePoster}
updateTitleFromSource={updateTitleFromSource}
torrentSource={torrentSource}
isCustomTitleEnabled={isCustomTitleEnabled}
setIsCustomTitleEnabled={setIsCustomTitleEnabled}
isEditMode={isEditMode}
/>
</Content>
<ButtonWrapper> <Button
<Button onClick={handleClose} color='primary' variant='outlined'> variant='contained'
{t('Cancel')} style={{ minWidth: '110px' }}
</Button> disabled={!torrentSource || (isHashAlreadyExists && !isEditMode) || !isTorrentSourceCorrect}
onClick={handleSave}
<Button color='primary'
variant='contained' >
style={{ minWidth: '110px' }} {isLoadingButton ? (
disabled={!torrentSource || (isHashAlreadyExists && !isEditMode) || !isTorrentSourceCorrect} <CircularProgress style={{ color: 'white' }} size={20} />
onClick={handleSave} ) : (
color='primary' t(isEditMode ? 'Save' : 'Add')
> )}
{isLoadingButton ? <CircularProgress style={{ color: 'white' }} size={20} /> : t(isEditMode ? 'Save' : 'Add')} </Button>
</Button> </ButtonWrapper>
</ButtonWrapper> </Dialog>
</Dialog> </ThemeProvider>
) )
} }

12
web/src/components/App/Sidebar.jsx
View File

@@ -21,29 +21,19 @@ const Sidebar = ({ isDrawerOpen, setIsDonationDialogOpen, isOffline, isLoading }
<AppSidebarStyle isDrawerOpen={isDrawerOpen}> <AppSidebarStyle isDrawerOpen={isDrawerOpen}>
<List> <List>
<AddDialogButton isOffline={isOffline} isLoading={isLoading} /> <AddDialogButton isOffline={isOffline} isLoading={isLoading} />
<RemoveAll isOffline={isOffline} isLoading={isLoading} /> <RemoveAll isOffline={isOffline} isLoading={isLoading} />
</List> </List>
<Divider /> <Divider />
<List> <List>
<SettingsDialog /> <SettingsDialog />
<CloseServer isOffline={isOffline} isLoading={isLoading} />
</List>
<Divider />
<List>
<AboutDialog /> <AboutDialog />
<ListItem button onClick={() => setIsDonationDialogOpen(true)}> <ListItem button onClick={() => setIsDonationDialogOpen(true)}>
<ListItemIcon> <ListItemIcon>
<CreditCardIcon /> <CreditCardIcon />
</ListItemIcon> </ListItemIcon>
<ListItemText primary={t('Donate')} /> <ListItemText primary={t('Donate')} />
</ListItem> </ListItem>
<CloseServer isOffline={isOffline} isLoading={isLoading} />
</List> </List>
</AppSidebarStyle> </AppSidebarStyle>
) )

59
web/src/components/App/index.jsx
View File

@@ -1,6 +1,7 @@
import CssBaseline from '@material-ui/core/CssBaseline' import useMediaQuery from '@material-ui/core/useMediaQuery'
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core' import { createMuiTheme, MuiThemeProvider } from '@material-ui/core'
import { useEffect, useState } from 'react' import CssBaseline from '@material-ui/core/CssBaseline'
import { useEffect, useMemo, useState } from 'react'
import Typography from '@material-ui/core/Typography' import Typography from '@material-ui/core/Typography'
import IconButton from '@material-ui/core/IconButton' import IconButton from '@material-ui/core/IconButton'
import { Menu as MenuIcon, Close as CloseIcon } from '@material-ui/icons' import { Menu as MenuIcon, Close as CloseIcon } from '@material-ui/icons'
@@ -11,21 +12,50 @@ import TorrentList from 'components/TorrentList'
import DonateSnackbar from 'components/Donate' import DonateSnackbar from 'components/Donate'
import DonateDialog from 'components/Donate/DonateDialog' import DonateDialog from 'components/Donate/DonateDialog'
import useChangeLanguage from 'utils/useChangeLanguage' import useChangeLanguage from 'utils/useChangeLanguage'
import { ThemeProvider } from '@material-ui/core/styles'
import { useQuery } from 'react-query' import { useQuery } from 'react-query'
import { getTorrents } from 'utils/Utils' import { getTorrents } from 'utils/Utils'
import { AppWrapper, AppHeader, LanguageSwitch } from './style' import { AppWrapper, AppHeader, LanguageSwitch } from './style'
import Sidebar from './Sidebar' import Sidebar from './Sidebar'
const baseTheme = createMuiTheme({ // https://material-ui.com/ru/customization/default-theme/
palette: { primary: { main: '#00a572' }, secondary: { main: '#ffa724' }, tonalOffset: 0.2 }, export const darkTheme = createMuiTheme({
palette: {
type: 'dark',
primary: { main: '#00a572' },
background: { paper: '#575757' },
},
typography: { fontFamily: 'Open Sans, sans-serif' },
})
export const lightTheme = createMuiTheme({
palette: {
type: 'light',
primary: { main: '#00a572' },
background: { paper: '#f1f1f1' },
},
typography: { fontFamily: 'Open Sans, sans-serif' }, typography: { fontFamily: 'Open Sans, sans-serif' },
}) })
export default function App() { export default function App() {
const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)')
const [isDrawerOpen, setIsDrawerOpen] = useState(false) const [isDrawerOpen, setIsDrawerOpen] = useState(false)
const [isDonationDialogOpen, setIsDonationDialogOpen] = useState(false) const [isDonationDialogOpen, setIsDonationDialogOpen] = useState(false)
const [torrServerVersion, setTorrServerVersion] = useState('') const [torrServerVersion, setTorrServerVersion] = useState('')
// https://material-ui.com/ru/customization/palette/
const baseTheme = useMemo(
() =>
createMuiTheme({
palette: {
type: prefersDarkMode ? 'dark' : 'light',
primary: { main: '#00a572' },
secondary: { main: '#ffa724' },
tonalOffset: 0.2,
},
typography: { fontFamily: 'Open Sans, sans-serif' },
}),
[prefersDarkMode],
)
const [currentLang, changeLang] = useChangeLanguage() const [currentLang, changeLang] = useChangeLanguage()
const [isOffline, setIsOffline] = useState(false) const [isOffline, setIsOffline] = useState(false)
const { data: torrents, isLoading } = useQuery('torrents', getTorrents, { const { data: torrents, isLoading } = useQuery('torrents', getTorrents, {
@@ -66,17 +96,18 @@ export default function App() {
</LanguageSwitch> </LanguageSwitch>
</div> </div>
</AppHeader> </AppHeader>
<ThemeProvider theme={darkTheme}>
<Sidebar <Sidebar
isOffline={isOffline} isOffline={isOffline}
isLoading={isLoading} isLoading={isLoading}
isDrawerOpen={isDrawerOpen} isDrawerOpen={isDrawerOpen}
setIsDonationDialogOpen={setIsDonationDialogOpen} setIsDonationDialogOpen={setIsDonationDialogOpen}
/> />
</ThemeProvider>
<TorrentList isOffline={isOffline} torrents={torrents} isLoading={isLoading} /> <TorrentList isOffline={isOffline} torrents={torrents} isLoading={isLoading} />
<ThemeProvider theme={lightTheme}>
{isDonationDialogOpen && <DonateDialog onClose={() => setIsDonationDialogOpen(false)} />} {isDonationDialogOpen && <DonateDialog onClose={() => setIsDonationDialogOpen(false)} />}
</ThemeProvider>
{!JSON.parse(localStorage.getItem('snackbarIsClosed')) && <DonateSnackbar />} {!JSON.parse(localStorage.getItem('snackbarIsClosed')) && <DonateSnackbar />}
</AppWrapper> </AppWrapper>
</Div100vh> </Div100vh>

9
web/src/components/App/style.js
View File

@@ -19,14 +19,14 @@ export const CenteredGrid = styled.div`
export const AppHeader = styled.div` export const AppHeader = styled.div`
background: #00a572; background: #00a572;
color: rgba(0, 0, 0, 0.87); color: #fff;
grid-area: head; grid-area: head;
display: grid; display: grid;
grid-auto-flow: column; grid-auto-flow: column;
align-items: center; align-items: center;
grid-template-columns: repeat(2, max-content) 1fr; grid-template-columns: repeat(2, max-content) 1fr;
box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%); box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
padding: 0 24px; padding: 0 16px;
z-index: 3; z-index: 3;
` `
export const AppSidebarStyle = styled.div` export const AppSidebarStyle = styled.div`
@@ -37,7 +37,8 @@ export const AppSidebarStyle = styled.div`
overflow-x: hidden; overflow-x: hidden;
transition: width 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms; transition: width 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
border-right: 1px solid rgba(0, 0, 0, 0.12); border-right: 1px solid rgba(0, 0, 0, 0.12);
background: #eee; background: #575757;
color: #eee;
white-space: nowrap; white-space: nowrap;
`} `}
` `
@@ -76,7 +77,7 @@ export const LanguageSwitch = styled.div`
font-weight: 600; font-weight: 600;
display: grid; display: grid;
place-items: center; place-items: center;
color: #44795e; color: #fff;
:hover { :hover {
background: #7ec9a3; background: #7ec9a3;

42
web/src/components/CloseServer.jsx
View File

@@ -3,6 +3,8 @@ import { Button, Dialog, DialogActions, DialogTitle, ListItem, ListItemIcon, Lis
import { PowerSettingsNew as PowerSettingsNewIcon } from '@material-ui/icons' import { PowerSettingsNew as PowerSettingsNewIcon } from '@material-ui/icons'
import { shutdownHost } from 'utils/Hosts' import { shutdownHost } from 'utils/Hosts'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { ThemeProvider } from '@material-ui/core/styles'
import { lightTheme } from 'components/App'
export default function CloseServer({ isOffline, isLoading }) { export default function CloseServer({ isOffline, isLoading }) {
const { t } = useTranslation() const { t } = useTranslation()
@@ -20,26 +22,28 @@ export default function CloseServer({ isOffline, isLoading }) {
<ListItemText primary={t('CloseServer')} /> <ListItemText primary={t('CloseServer')} />
</ListItem> </ListItem>
<Dialog open={open} onClose={closeDialog}> <ThemeProvider theme={lightTheme}>
<DialogTitle>{t('CloseServer?')}</DialogTitle> <Dialog open={open} onClose={closeDialog}>
<DialogActions> <DialogTitle>{t('CloseServer?')}</DialogTitle>
<Button variant='outlined' onClick={closeDialog} color='primary'> <DialogActions>
{t('Cancel')} <Button variant='outlined' onClick={closeDialog} color='primary'>
</Button> {t('Cancel')}
</Button>
<Button <Button
variant='contained' variant='contained'
onClick={() => { onClick={() => {
fetch(shutdownHost()) fetch(shutdownHost())
closeDialog() closeDialog()
}} }}
color='primary' color='primary'
autoFocus autoFocus
> >
{t('TurnOff')} {t('TurnOff')}
</Button> </Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
</ThemeProvider>
</> </>
) )
} }

2
web/src/components/Donate/DonateDialog.jsx
View File

@@ -15,7 +15,7 @@ export default function DonateDialog({ onClose }) {
const { t } = useTranslation() const { t } = useTranslation()
return ( return (
<Dialog open onClose={onClose} aria-labelledby='form-dialog-title' fullWidth> <Dialog open onClose={onClose} aria-labelledby='form-dialog-title' fullWidth maxWidth='xs'>
<DialogTitle id='form-dialog-title'>{t('Donate')}</DialogTitle> <DialogTitle id='form-dialog-title'>{t('Donate')}</DialogTitle>
<DialogContent> <DialogContent>
<List> <List>

42
web/src/components/RemoveAll.jsx
View File

@@ -6,6 +6,8 @@ import DeleteIcon from '@material-ui/icons/Delete'
import { useState } from 'react' import { useState } from 'react'
import { torrentsHost } from 'utils/Hosts' import { torrentsHost } from 'utils/Hosts'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { ThemeProvider } from '@material-ui/core/styles'
import { lightTheme } from 'components/App'
const fnRemoveAll = () => { const fnRemoveAll = () => {
fetch(torrentsHost(), { fetch(torrentsHost(), {
@@ -47,26 +49,28 @@ export default function RemoveAll({ isOffline, isLoading }) {
<ListItemText primary={t('RemoveAll')} /> <ListItemText primary={t('RemoveAll')} />
</ListItem> </ListItem>
<Dialog open={open} onClose={closeDialog}> <ThemeProvider theme={lightTheme}>
<DialogTitle>{t('DeleteTorrents?')}</DialogTitle> <Dialog open={open} onClose={closeDialog}>
<DialogActions> <DialogTitle>{t('DeleteTorrents?')}</DialogTitle>
<Button variant='outlined' onClick={closeDialog} color='primary'> <DialogActions>
{t('Cancel')} <Button variant='outlined' onClick={closeDialog} color='primary'>
</Button> {t('Cancel')}
</Button>
<Button <Button
variant='contained' variant='contained'
onClick={() => { onClick={() => {
fnRemoveAll() fnRemoveAll()
closeDialog() closeDialog()
}} }}
color='primary' color='primary'
autoFocus autoFocus
> >
{t('OK')} {t('OK')}
</Button> </Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
</ThemeProvider>
</> </>
) )
} }

374
web/src/components/Settings.jsx
View File

@@ -13,6 +13,8 @@ import Button from '@material-ui/core/Button'
import { FormControlLabel, InputLabel, Select, Switch } from '@material-ui/core' import { FormControlLabel, InputLabel, Select, Switch } from '@material-ui/core'
import { settingsHost, setTorrServerHost, getTorrServerHost } from 'utils/Hosts' import { settingsHost, setTorrServerHost, getTorrServerHost } from 'utils/Hosts'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { ThemeProvider } from '@material-ui/core/styles'
import { lightTheme } from 'components/App'
export default function SettingsDialog() { export default function SettingsDialog() {
const { t } = useTranslation() const { t } = useTranslation()
@@ -100,193 +102,195 @@ export default function SettingsDialog() {
<ListItemText primary={t('Settings')} /> <ListItemText primary={t('Settings')} />
</ListItem> </ListItem>
<Dialog open={open} onClose={handleClose} aria-labelledby='form-dialog-title' fullWidth> <ThemeProvider theme={lightTheme}>
<DialogTitle id='form-dialog-title'>{t('Settings')}</DialogTitle> <Dialog open={open} onClose={handleClose} aria-labelledby='form-dialog-title' fullWidth>
<DialogContent> <DialogTitle id='form-dialog-title'>{t('Settings')}</DialogTitle>
<TextField <DialogContent>
onChange={onInputHost} <TextField
margin='dense' onChange={onInputHost}
id='TorrServerHost' margin='dense'
label={t('Host')} id='TorrServerHost'
value={tsHost} label={t('Host')}
type='url' value={tsHost}
fullWidth type='url'
/> fullWidth
{show && ( />
<> {show && (
<TextField <>
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='CacheSize' margin='dense'
label={t('CacheSize')} id='CacheSize'
value={CacheSize} label={t('CacheSize')}
type='number' value={CacheSize}
fullWidth type='number'
/> fullWidth
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='ReaderReadAHead' margin='dense'
label={t('ReaderReadAHead')} id='ReaderReadAHead'
value={ReaderReadAHead} label={t('ReaderReadAHead')}
type='number' value={ReaderReadAHead}
fullWidth type='number'
/> fullWidth
<br /> />
<FormControlLabel <br />
control={<Switch checked={PreloadBuffer} onChange={inputForm} id='PreloadBuffer' color='primary' />} <FormControlLabel
label={t('PreloadBuffer')} control={<Switch checked={PreloadBuffer} onChange={inputForm} id='PreloadBuffer' color='primary' />}
/> label={t('PreloadBuffer')}
<br /> />
<FormControlLabel <br />
control={<Switch checked={UseDisk} onChange={inputForm} id='UseDisk' color='primary' />} <FormControlLabel
label={t('UseDisk')} control={<Switch checked={UseDisk} onChange={inputForm} id='UseDisk' color='primary' />}
/> label={t('UseDisk')}
<br /> />
<small>{t('UseDiskDesc')}</small> <br />
<br /> <small>{t('UseDiskDesc')}</small>
<FormControlLabel <br />
control={ <FormControlLabel
<Switch checked={RemoveCacheOnDrop} onChange={inputForm} id='RemoveCacheOnDrop' color='primary' /> control={
} <Switch checked={RemoveCacheOnDrop} onChange={inputForm} id='RemoveCacheOnDrop' color='primary' />
label={t('RemoveCacheOnDrop')} }
/> label={t('RemoveCacheOnDrop')}
<br /> />
<small>{t('RemoveCacheOnDropDesc')}</small> <br />
<br /> <small>{t('RemoveCacheOnDropDesc')}</small>
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='TorrentsSavePath' margin='dense'
label={t('TorrentsSavePath')} id='TorrentsSavePath'
value={TorrentsSavePath} label={t('TorrentsSavePath')}
type='url' value={TorrentsSavePath}
fullWidth type='url'
/> fullWidth
<br /> />
<FormControlLabel <br />
control={<Switch checked={EnableIPv6} onChange={inputForm} id='EnableIPv6' color='primary' />} <FormControlLabel
label={t('EnableIPv6')} control={<Switch checked={EnableIPv6} onChange={inputForm} id='EnableIPv6' color='primary' />}
/> label={t('EnableIPv6')}
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisableTCP} onChange={inputForm} id='DisableTCP' color='primary' />} <FormControlLabel
label={t('TCP')} control={<Switch checked={!DisableTCP} onChange={inputForm} id='DisableTCP' color='primary' />}
/> label={t('TCP')}
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisableUTP} onChange={inputForm} id='DisableUTP' color='primary' />} <FormControlLabel
label={t('UTP')} control={<Switch checked={!DisableUTP} onChange={inputForm} id='DisableUTP' color='primary' />}
/> label={t('UTP')}
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisablePEX} onChange={inputForm} id='DisablePEX' color='primary' />} <FormControlLabel
label={t('PEX')} control={<Switch checked={!DisablePEX} onChange={inputForm} id='DisablePEX' color='primary' />}
/> label={t('PEX')}
<br /> />
<FormControlLabel <br />
control={<Switch checked={ForceEncrypt} onChange={inputForm} id='ForceEncrypt' color='primary' />} <FormControlLabel
label={t('ForceEncrypt')} control={<Switch checked={ForceEncrypt} onChange={inputForm} id='ForceEncrypt' color='primary' />}
/> label={t('ForceEncrypt')}
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='TorrentDisconnectTimeout' margin='dense'
label={t('TorrentDisconnectTimeout')} id='TorrentDisconnectTimeout'
value={TorrentDisconnectTimeout} label={t('TorrentDisconnectTimeout')}
type='number' value={TorrentDisconnectTimeout}
fullWidth type='number'
/> fullWidth
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='ConnectionsLimit' margin='dense'
label={t('ConnectionsLimit')} id='ConnectionsLimit'
value={ConnectionsLimit} label={t('ConnectionsLimit')}
type='number' value={ConnectionsLimit}
fullWidth type='number'
/> fullWidth
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisableDHT} onChange={inputForm} id='DisableDHT' color='primary' />} <FormControlLabel
label={t('DHT')} control={<Switch checked={!DisableDHT} onChange={inputForm} id='DisableDHT' color='primary' />}
/> label={t('DHT')}
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='DhtConnectionLimit' margin='dense'
label={t('DhtConnectionLimit')} id='DhtConnectionLimit'
value={DhtConnectionLimit} label={t('DhtConnectionLimit')}
type='number' value={DhtConnectionLimit}
fullWidth type='number'
/> fullWidth
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='DownloadRateLimit' margin='dense'
label={t('DownloadRateLimit')} id='DownloadRateLimit'
value={DownloadRateLimit} label={t('DownloadRateLimit')}
type='number' value={DownloadRateLimit}
fullWidth type='number'
/> fullWidth
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisableUpload} onChange={inputForm} id='DisableUpload' color='primary' />} <FormControlLabel
label={t('Upload')} control={<Switch checked={!DisableUpload} onChange={inputForm} id='DisableUpload' color='primary' />}
/> label={t('Upload')}
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='UploadRateLimit' margin='dense'
label={t('UploadRateLimit')} id='UploadRateLimit'
value={UploadRateLimit} label={t('UploadRateLimit')}
type='number' value={UploadRateLimit}
fullWidth type='number'
/> fullWidth
<br /> />
<TextField <br />
onChange={inputForm} <TextField
margin='dense' onChange={inputForm}
id='PeersListenPort' margin='dense'
label={t('PeersListenPort')} id='PeersListenPort'
value={PeersListenPort} label={t('PeersListenPort')}
type='number' value={PeersListenPort}
fullWidth type='number'
/> fullWidth
<br /> />
<FormControlLabel <br />
control={<Switch checked={!DisableUPNP} onChange={inputForm} id='DisableUPNP' color='primary' />} <FormControlLabel
label={t('UPNP')} control={<Switch checked={!DisableUPNP} onChange={inputForm} id='DisableUPNP' color='primary' />}
/> label={t('UPNP')}
<br /> />
<InputLabel htmlFor='RetrackersMode'>{t('RetrackersMode')}</InputLabel> <br />
<Select onChange={inputForm} type='number' native id='RetrackersMode' value={RetrackersMode}> <InputLabel htmlFor='RetrackersMode'>{t('RetrackersMode')}</InputLabel>
<option value={0}>{t('DontAddRetrackers')}</option> <Select onChange={inputForm} type='number' native id='RetrackersMode' value={RetrackersMode}>
<option value={1}>{t('AddRetrackers')}</option> <option value={0}>{t('DontAddRetrackers')}</option>
<option value={2}>{t('RemoveRetrackers')}</option> <option value={1}>{t('AddRetrackers')}</option>
<option value={3}>{t('ReplaceRetrackers')}</option> <option value={2}>{t('RemoveRetrackers')}</option>
</Select> <option value={3}>{t('ReplaceRetrackers')}</option>
<br /> </Select>
</> <br />
)} </>
</DialogContent> )}
</DialogContent>
<DialogActions> <DialogActions>
<Button onClick={handleClose} color='primary' variant='outlined'> <Button onClick={handleClose} color='primary' variant='outlined'>
{t('Cancel')} {t('Cancel')}
</Button> </Button>
<Button onClick={handleSave} color='primary' variant='outlined'> <Button onClick={handleSave} color='primary' variant='outlined'>
{t('Save')} {t('Save')}
</Button> </Button>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
</ThemeProvider>
</div> </div>
) )
} }