Add checks for player type

src/renderer/features/now-playing/components/play-queue-list-controls.tsx

@@ -13,7 +13,8 @@ import {
 } from 'react-icons/ri';
 import { Song } from '/@/renderer/api/types';
 import { useQueueControls } from '/@/renderer/store';
-import { TableType } from '/@/renderer/types';
+import { PlaybackType, TableType } from '/@/renderer/types';
+import { usePlayerType } from '/@/renderer/store/settings.store';
 
 const mpvPlayer = isElectron() ? window.electron.mpvPlayer : null;
 
@@ -26,13 +27,18 @@ export const PlayQueueListControls = ({ type, tableRef }: PlayQueueListOptionsPr
   const { clearQueue, moveToBottomOfQueue, moveToTopOfQueue, shuffleQueue, removeFromQueue } =
     useQueueControls();
 
+  const playerType = usePlayerType();
+
   const handleMoveToBottom = () => {
     const selectedRows = tableRef?.current?.grid.api.getSelectedRows();
     const uniqueIds = selectedRows?.map((row) => row.uniqueId);
     if (!uniqueIds?.length) return;
 
     const playerData = moveToBottomOfQueue(uniqueIds);
-    mpvPlayer.setQueueNext(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueueNext(playerData);
+    }
   };
 
   const handleMoveToTop = () => {
@@ -41,7 +47,10 @@ export const PlayQueueListControls = ({ type, tableRef }: PlayQueueListOptionsPr
     if (!uniqueIds?.length) return;
 
     const playerData = moveToTopOfQueue(uniqueIds);
-    mpvPlayer.setQueueNext(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueueNext(playerData);
+    }
   };
 
   const handleRemoveSelected = () => {
@@ -50,24 +59,34 @@ export const PlayQueueListControls = ({ type, tableRef }: PlayQueueListOptionsPr
     if (!uniqueIds?.length) return;
 
     const playerData = removeFromQueue(uniqueIds);
-    mpvPlayer.setQueueNext(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueueNext(playerData);
+    }
   };
 
   const handleClearQueue = () => {
     const playerData = clearQueue();
-    mpvPlayer.setQueue(playerData);
-    mpvPlayer.stop();
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueue(playerData);
+      mpvPlayer.stop();
+    }
   };
 
   const handleShuffleQueue = () => {
     const playerData = shuffleQueue();
-    mpvPlayer.setQueueNext(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueueNext(playerData);
+    }
   };
 
   return (
     <Group
       position="apart"
       px="1rem"
+      py="1rem"
       sx={{ alignItems: 'center' }}
     >
       <Group>

src/renderer/features/now-playing/components/play-queue.tsx

@@ -22,6 +22,7 @@ import {
   useQueueControls,
 } from '/@/renderer/store';
 import {
+  usePlayerType,
   useSettingsStore,
   useSettingsStoreActions,
   useTableSettings,
@@ -31,7 +32,7 @@ import isElectron from 'is-electron';
 import { ErrorBoundary } from 'react-error-boundary';
 import { VirtualTable } from '/@/renderer/components/virtual-table';
 import { ErrorFallback } from '/@/renderer/features/action-required';
-import { TableType } from '/@/renderer/types';
+import { PlaybackType, TableType } from '/@/renderer/types';
 import { QueueSong } from '/@/renderer/api/types';
 
 const mpvPlayer = isElectron() ? window.electron.mpvPlayer : null;
@@ -51,6 +52,7 @@ export const PlayQueue = forwardRef(({ type }: QueueProps, ref: Ref<any>) => {
   const { setAppStore } = useAppStoreActions();
   const tableConfig = useTableSettings(type);
   const [gridApi, setGridApi] = useState<AgGridReactType | undefined>();
+  const playerType = usePlayerType();
 
   useEffect(() => {
     if (tableRef.current) {
@@ -73,9 +75,12 @@ export const PlayQueue = forwardRef(({ type }: QueueProps, ref: Ref<any>) => {
     };
   }, []);
 
-  const handlePlayByRowClick = (e: CellDoubleClickedEvent) => {
+  const handleDoubleClick = (e: CellDoubleClickedEvent) => {
     const playerData = setCurrentTrack(e.data.uniqueId);
-    mpvPlayer.setQueue(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueue(playerData);
+    }
   };
 
   const handleDragStart = () => {
@@ -92,7 +97,10 @@ export const PlayQueue = forwardRef(({ type }: QueueProps, ref: Ref<any>) => {
       .filter((e) => e !== undefined);
 
     const playerData = reorderQueue(selectedUniqueIds as string[], e.overNode?.data?.uniqueId);
-    mpvPlayer.setQueueNext(playerData);
+
+    if (playerType === PlaybackType.LOCAL) {
+      mpvPlayer.setQueueNext(playerData);
+    }
 
     if (type === 'sideDrawerQueue') {
       setAppStore({ isReorderingQueue: false });
@@ -223,7 +231,7 @@ export const PlayQueue = forwardRef(({ type }: QueueProps, ref: Ref<any>) => {
             rowData={queue}
             rowHeight={tableConfig.rowHeight || 40}
             rowSelection="multiple"
-            onCellDoubleClicked={handlePlayByRowClick}
+            onCellDoubleClicked={handleDoubleClick}
             onColumnMoved={handleColumnChange}
             onColumnResized={handleColumnChange}
             onDragStarted={handleDragStart}