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

refactor

Browse Source
This commit is contained in:
Daniel Shleifman
2021-06-02 21:14:24 +03:00
parent e472b8b59a
commit 6dbd3aec4d
4 changed files with 36 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/App/index.jsx
View File

@@ -4,11 +4,12 @@ import { useEffect, useState } from 'react'
import Typography from '@material-ui/core/Typography'
import IconButton from '@material-ui/core/IconButton'
import { Menu as MenuIcon, Close as CloseIcon } from '@material-ui/icons'
import { getTorrServerHost } from 'utils/Hosts'
import { echoHost } from 'utils/Hosts'
import TorrentList from 'components/TorrentList'
import DonateSnackbar from 'components/Donate'
import DonateDialog from 'components/Donate/DonateDialog'
import Div100vh from 'react-div-100vh'
import axios from 'axios'
import { AppWrapper, AppHeader } from './style'
import Sidebar from './Sidebar'
@@ -21,15 +22,11 @@ const baseTheme = createMuiTheme({
export default function App() {
const [isDrawerOpen, setIsDrawerOpen] = useState(false)
const [isDonationDialogOpen, setIsDonationDialogOpen] = useState(false)
const [tsVersion, setTSVersion] = useState('')
const [torrServerVersion, setTorrServerVersion] = useState('')
useEffect(() => {
fetch(`${getTorrServerHost()}/echo`)
.then(resp => resp.text())
.then(txt => {
if (!txt.startsWith('<!DOCTYPE html>')) setTSVersion(txt)
})
}, [isDrawerOpen])
axios.get(echoHost()).then(({ data }) => setTorrServerVersion(data))
}, [])
return (
<MuiThemeProvider theme={baseTheme}>
@@ -49,7 +46,7 @@ export default function App() {
</IconButton>
<Typography variant='h6' noWrap>
TorrServer {tsVersion}
TorrServer {torrServerVersion}
</Typography>
</AppHeader>

7
web/src/App/style.js
View File

@@ -9,6 +9,13 @@ export const AppWrapper = styled.div`
'head head'
'side content';
`
export const CenteredGrid = styled.div`
height: 100%;
display: grid;
place-items: center;
`
export const AppHeader = styled.div`
background: #3fb57a;
color: rgba(0, 0, 0, 0.87);

27
web/src/components/TorrentList.jsx
View File

@@ -1,17 +1,10 @@
import styled from 'styled-components'
import { useEffect, useRef, useState } from 'react'
import { Typography } from '@material-ui/core'
import { torrentsHost } from 'utils/Hosts'
import TorrentCard from 'components/TorrentCard'
import axios from 'axios'
import CircularProgress from '@material-ui/core/CircularProgress'
import { TorrentListWrapper } from 'App/style'
const CenteredGrid = styled.div`
height: 100%;
display: grid;
place-items: center;
`
import { TorrentListWrapper, CenteredGrid } from 'App/style'
export default function TorrentList() {
const [torrents, setTorrents] = useState([])
@@ -40,19 +33,21 @@ export default function TorrentList() {
return () => clearInterval(timerID.current)
}, [])
return isLoading ? (
if (isLoading || isOffline || !torrents.length) {
return (
<CenteredGrid>
{isLoading ? (
<CircularProgress />
</CenteredGrid>
) : isOffline ? (
<CenteredGrid>
<Typography>Offline</Typography>
</CenteredGrid>
) : !torrents.length ? (
<CenteredGrid>
<Typography>No torrents added</Typography>
</CenteredGrid>
) : (
!torrents.length && <Typography>No torrents added</Typography>
)}
</CenteredGrid>
)
}
return (
<TorrentListWrapper>
{torrents.map(torrent => (
<TorrentCard key={torrent.hash} torrent={torrent} />

32
web/src/components/Upload.jsx
View File

@@ -3,40 +3,22 @@ import ListItemText from '@material-ui/core/ListItemText'
import ListItem from '@material-ui/core/ListItem'
import PublishIcon from '@material-ui/icons/Publish'
import { torrentUploadHost } from 'utils/Hosts'
const classes = {
input: {
display: 'none',
},
}
import axios from 'axios'
export default function UploadDialog() {
const handleCapture = ({ target }) => {
const handleCapture = ({ target: { files } }) => {
const [file] = files
const data = new FormData()
data.append('save', 'true')
for (let i = 0; i < target.files.length; i++) {
data.append(`file${i}`, target.files[i])
}
fetch(torrentUploadHost(), {
method: 'POST',
body: data,
})
data.append('file', file)
axios.post(torrentUploadHost(), data)
}
return (
<div>
<label htmlFor='raised-button-file'>
<input
onChange={handleCapture}
accept='*/*'
type='file'
className={classes.input}
style={{ display: 'none' }}
id='raised-button-file'
multiple
/>
<input onChange={handleCapture} accept='*/*' type='file' style={{ display: 'none' }} id='raised-button-file' />
<ListItem button variant='raised' type='submit' component='span' className={classes.button} key='Upload file'>
<ListItem button variant='raised' type='submit' component='span' key='Upload file'>
<ListItemIcon>
<PublishIcon />
</ListItemIcon>