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

add torrents sort icon

Browse Source
This commit is contained in:
nikk gitanes
2023-03-09 01:02:08 +03:00
parent e55a80963f
commit 97ba2e573f
2 changed files with 21 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -7,6 +7,8 @@ import {
Brightness4 as Brightness4Icon, Brightness4 as Brightness4Icon,
Brightness5 as Brightness5Icon, Brightness5 as Brightness5Icon,
BrightnessAuto as BrightnessAutoIcon, BrightnessAuto as BrightnessAutoIcon,
Sort as SortIcon,
SortByAlpha as SortByAlphaIcon,
} from '@material-ui/icons' } from '@material-ui/icons'
import { echoHost } from 'utils/Hosts' import { echoHost } from 'utils/Hosts'
import Div100vh from 'react-div-100vh' import Div100vh from 'react-div-100vh'
@@ -47,6 +49,9 @@ export default function App() {
onError: () => setIsOffline(true), onError: () => setIsOffline(true),
onSuccess: () => setIsOffline(false), onSuccess: () => setIsOffline(false),
}) })
const [sortABC, setSortABC] = useState(false)
const handleClickSortABC = () => setSortABC(true)
const handleClickSortDate = () => setSortABC(false)
useEffect(() => { useEffect(() => {
axios.get(echoHost()).then(({ data }) => setTorrServerVersion(data)) axios.get(echoHost()).then(({ data }) => setTorrServerVersion(data))
@@ -76,8 +81,12 @@ export default function App() {
</Typography> </Typography>
<div <div
style={{ justifySelf: 'end', display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: '10px' }} style={{ justifySelf: 'end', display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: '10px' }}
> >
<HeaderToggle onClick={() => (sortABC === true ? handleClickSortDate() : handleClickSortABC())}>
{sortABC === true ? <SortByAlphaIcon /> : <SortIcon />}
</HeaderToggle>
<HeaderToggle <HeaderToggle
onClick={() => { onClick={() => {
if (currentThemeMode === THEME_MODES.LIGHT) updateThemeMode(THEME_MODES.DARK) if (currentThemeMode === THEME_MODES.LIGHT) updateThemeMode(THEME_MODES.DARK)
@@ -115,7 +124,7 @@ export default function App() {
setIsDonationDialogOpen={setIsDonationDialogOpen} setIsDonationDialogOpen={setIsDonationDialogOpen}
/> />
<TorrentList isOffline={isOffline} torrents={torrents} isLoading={isLoading} /> <TorrentList isOffline={isOffline} torrents={torrents} isLoading={isLoading} sortABC={sortABC} />
<PWAFooter <PWAFooter
isOffline={isOffline} isOffline={isOffline}

12
web/src/components/TorrentList/index.jsx
View File

@@ -5,7 +5,7 @@ import { TorrentListWrapper, CenteredGrid } from 'components/App/style'
import NoServerConnection from './NoServerConnection' import NoServerConnection from './NoServerConnection'
import AddFirstTorrent from './AddFirstTorrent' import AddFirstTorrent from './AddFirstTorrent'
export default function TorrentList({ isOffline, isLoading, torrents }) { export default function TorrentList({ isOffline, isLoading, sortABC, torrents }) {
if (isLoading || isOffline || !torrents.length) { if (isLoading || isOffline || !torrents.length) {
return ( return (
<CenteredGrid> <CenteredGrid>
@@ -20,7 +20,15 @@ export default function TorrentList({ isOffline, isLoading, torrents }) {
) )
} }
return ( return sortABC ? (
<TorrentListWrapper>
{torrents
.sort((a, b) => a.title > b.title)
.map(torrent => (
<TorrentCard key={torrent.hash} torrent={torrent} />
))}
</TorrentListWrapper>
) : (
<TorrentListWrapper> <TorrentListWrapper>
{torrents.map(torrent => ( {torrents.map(torrent => (
<TorrentCard key={torrent.hash} torrent={torrent} /> <TorrentCard key={torrent.hash} torrent={torrent} />