1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
jellyfin-web/src/components/common/Shuffle.tsx

46 lines
1.4 KiB
TypeScript
Raw Normal View History

import type { BaseItemDtoQueryResult } from '@jellyfin/sdk/lib/generated-client';
2022-10-02 19:07:42 +03:00
import React, { FC, useCallback, useEffect, useRef } from 'react';
2022-08-06 01:36:13 +03:00
2022-10-27 00:59:46 +03:00
import { playbackManager } from '../playback/playbackmanager';
2022-08-06 01:36:13 +03:00
import IconButtonElement from '../../elements/IconButtonElement';
2022-10-14 02:07:54 +03:00
interface ShuffleProps {
2022-08-06 01:36:13 +03:00
itemsResult?: BaseItemDtoQueryResult;
topParentId: string | null;
}
2022-10-14 02:07:54 +03:00
const Shuffle: FC<ShuffleProps> = ({ itemsResult = {}, topParentId }) => {
2022-08-06 01:36:13 +03:00
const element = useRef<HTMLDivElement>(null);
const shuffle = useCallback(() => {
window.ApiClient.getItem(
window.ApiClient.getCurrentUserId(),
topParentId as string
).then((item) => {
playbackManager.shuffle(item);
2023-05-02 11:24:53 -04:00
}).catch(err => {
console.error('[Shuffle] failed to fetch items', err);
2022-08-06 01:36:13 +03:00
});
}, [topParentId]);
useEffect(() => {
2022-08-21 03:09:22 +03:00
const btnShuffle = element.current?.querySelector('.btnShuffle');
2022-08-06 01:36:13 +03:00
if (btnShuffle) {
btnShuffle.addEventListener('click', shuffle);
}
}, [itemsResult.TotalRecordCount, shuffle]);
return (
<div ref={element}>
<IconButtonElement
is='paper-icon-button-light'
2022-08-21 03:09:22 +03:00
className='btnShuffle autoSize'
2022-08-06 01:36:13 +03:00
title='Shuffle'
icon='material-icons shuffle'
/>
</div>
);
};
export default Shuffle;