From c990e744d336a7549f951ba6d72f49ec747f111c Mon Sep 17 00:00:00 2001
From: DAREKON <63023042+DAREK0N@users.noreply.github.com>
Date: Mon, 1 Apr 2024 20:30:27 +0200
Subject: [PATCH 1/3] GUI Hardsubs

---
 .../DownloadSelector/DownloadSelector.tsx     | 62 +++++++++----------
 .../src/components/reusable/MultiSelect.tsx   |  2 +-
 2 files changed, 32 insertions(+), 32 deletions(-)

diff --git a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
index d1d5ed4..b052e85 100644
--- a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
+++ b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Box, Button, Divider, InputBase, Link, MenuItem, Select, TextField, Tooltip, Typography } from '@mui/material';
+import React, { ChangeEvent } from 'react';
+import { Box, Button, Divider, FormControl, InputBase, InputLabel, Link, MenuItem, Select, TextField, Tooltip, Typography } from '@mui/material';
 import useStore from '../../../hooks/useStore';
 import MultiSelect from '../../reusable/MultiSelect';
 import { messageChannelContext } from '../../../provider/MessageChannel';
@@ -123,14 +123,15 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
       <Button sx={{ textTransform: 'none'}} onClick={() => dispatch({ type: 'downloadOptions', payload: { ...store.downloadOptions, novids: !store.downloadOptions.novids } })} variant={store.downloadOptions.novids ? 'contained' : 'outlined'}>Skip Video</Button>
       </Box>
       <Button sx={{ textTransform: 'none'}} onClick={() => dispatch({ type: 'downloadOptions', payload: { ...store.downloadOptions, dlVideoOnce: !store.downloadOptions.dlVideoOnce } })} variant={store.downloadOptions.dlVideoOnce ? 'contained' : 'outlined'}>Skip Unnecessary</Button>
-      <Tooltip title={
-        <Typography>
-          Currently only supported on Hidive
-        </Typography>
-      }
-      arrow
-      placement='top'>
-      <Button sx={{ textTransform: 'none'}} onClick={() => dispatch({ type: 'downloadOptions', payload: { ...store.downloadOptions, simul: !store.downloadOptions.simul } })} variant={store.downloadOptions.simul ? 'contained' : 'outlined'}>Download Simulcast ver.</Button>
+      <Tooltip title={store.service == 'hidive' ? '' :
+      <Typography>
+      Simulcast is only supported on Hidive
+      </Typography>}
+      arrow placement='top'
+      >
+      <Box>
+      <Button sx={{ textTransform: 'none'}} disabled={store.service != 'hidive'} onClick={() => dispatch({ type: 'downloadOptions', payload: { ...store.downloadOptions, simul: !store.downloadOptions.simul } })} variant={store.downloadOptions.simul ? 'contained' : 'outlined'}>Download Simulcast ver.</Button>
+      </Box>
       </Tooltip>
       </Box>
     <Box sx={{
@@ -212,11 +213,11 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
           });
         }}
       />
-      <Tooltip title={
+      <Tooltip title={store.service == 'crunchy' ? '' :
             <Typography>
-              Comming Soon™
+              Hardsubs are only supported on Crunchyroll
             </Typography>
-          }
+      }
           arrow placement='top'>
       <Box sx={{
       display: 'flex',
@@ -227,27 +228,18 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
     }}>
       
       <Box sx={{
-          borderColor: '#595959',
-          borderStyle: 'solid',
-          borderWidth: '1px',
           borderRadius: '5px',
           //backgroundColor: '#ff4567',
           width: '15rem',
           height: '3.5rem',
           display: 'flex',
-          '&:hover' : {
-            borderColor: '#ffffff',
-          },
         }}>
-          
-          <Button sx={{ textTransform: 'none' }} variant='outlined' disabled={true}>Hardsub</Button>
-          <Divider orientation='vertical'/>
-          <Select sx={{
-            flex: 1
-          }}
-          title='Hardsub lang.'
-          placeholder='Hardsub lang.'
-          disabled={true}
+          <FormControl fullWidth>
+            <InputLabel id='hsLabel'>Hardsub Language</InputLabel>
+          <Select
+          labelId='hsLabel'
+          label='Hardsub Language'
+          disabled={store.service != 'crunchy'}
           value={store.downloadOptions.hslang}
           onChange={(e) => {
             dispatch({
@@ -256,12 +248,20 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
             });
           }}
           >
-            <MenuItem>Deutsch</MenuItem>
+            <MenuItem value=''>No Hardsub</MenuItem>
+            {availableSubs.map((lang) => {
+              if(lang === 'all' || lang === 'none')
+                return undefined
+              return <MenuItem value={lang}>{lang}</MenuItem>
+            })}
             </Select>
-        </Box>
+            </FormControl>
+            </Box>
+            
+        
         <Tooltip title={
         <Typography>
-           Burns the selected subtitle <b>PERMANENTLY</b> onto the video<br/>You can choose only <b>1</b> subtitle per video
+           Downloads the hardsub version of the selected subtitle.<br/>Subtitels are displayed <b>PERMANENTLY!</b><br/>You can choose only <b>1</b> subtitle per video!
            </Typography>
       } arrow placement='top'>
         <InfoOutlinedIcon sx={{
diff --git a/gui/react/src/components/reusable/MultiSelect.tsx b/gui/react/src/components/reusable/MultiSelect.tsx
index 2bcd527..5e3b272 100644
--- a/gui/react/src/components/reusable/MultiSelect.tsx
+++ b/gui/react/src/components/reusable/MultiSelect.tsx
@@ -33,7 +33,7 @@ const MultiSelect: React.FC<MultiSelectProps> = (props) => {
   const theme = useTheme();
 
   return <div>
-    <FormControl sx={{ m: 1, width: 300 }}>
+    <FormControl sx={{ width: 300 }}>
       <InputLabel id="multi-select-label">{props.title}</InputLabel>
       <Select
         labelId="multi-select-label"

From 0f3cf5fbb8b7ecfd195de0dce131a5cc57162729 Mon Sep 17 00:00:00 2001
From: DAREKON <63023042+DAREK0N@users.noreply.github.com>
Date: Mon, 1 Apr 2024 20:59:53 +0200
Subject: [PATCH 2/3] GUI Hardsubs

---
 .../AddToQueue/DownloadSelector/DownloadSelector.tsx   | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
index b052e85..5aa6c9e 100644
--- a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
+++ b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
@@ -18,6 +18,8 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
   const [availableSubs, setAvailableSubs ] = React.useState<string[]>([]);
   const [ loading, setLoading ] = React.useState(false);
   const { enqueueSnackbar } = useSnackbar();
+  const ITEM_HEIGHT = 48;
+  const ITEM_PADDING_TOP = 8;
 
   React.useEffect(() => {
     (async () => {
@@ -237,6 +239,14 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
           <FormControl fullWidth>
             <InputLabel id='hsLabel'>Hardsub Language</InputLabel>
           <Select
+          MenuProps={{
+            PaperProps: {
+              style: {
+                maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP,
+                width: 250
+              }
+            }
+          }}
           labelId='hsLabel'
           label='Hardsub Language'
           disabled={store.service != 'crunchy'}

From a852cb37c5df8197b764912e601d12808372a7d7 Mon Sep 17 00:00:00 2001
From: DAREKON <63023042+DAREK0N@users.noreply.github.com>
Date: Mon, 1 Apr 2024 22:22:34 +0200
Subject: [PATCH 3/3] GUI Fixed spelling

---
 .../components/AddToQueue/DownloadSelector/DownloadSelector.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
index 5aa6c9e..9707dc6 100644
--- a/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
+++ b/gui/react/src/components/AddToQueue/DownloadSelector/DownloadSelector.tsx
@@ -271,7 +271,7 @@ const DownloadSelector: React.FC<DownloadSelectorProps> = ({ onFinish }) => {
         
         <Tooltip title={
         <Typography>
-           Downloads the hardsub version of the selected subtitle.<br/>Subtitels are displayed <b>PERMANENTLY!</b><br/>You can choose only <b>1</b> subtitle per video!
+           Downloads the hardsub version of the selected subtitle.<br/>Subtitles are displayed <b>PERMANENTLY!</b><br/>You can choose only <b>1</b> subtitle per video!
            </Typography>
       } arrow placement='top'>
         <InfoOutlinedIcon sx={{