From 4066a6d5e379817f6bd7cb404aee1102dd4ae571 Mon Sep 17 00:00:00 2001
From: marcobaobao <marco.piovanello@gmail.com>
Date: Fri, 14 Jun 2024 10:42:25 +0200
Subject: [PATCH] frontend code refactoring

---
 frontend/package.json                                     | 2 +-
 frontend/src/components/Downloads.tsx                     | 4 ++--
 .../{DownloadsCardView.tsx => DownloadsGridView.tsx}      | 8 +++-----
 frontend/src/components/DownloadsTableView.tsx            | 4 +---
 frontend/src/components/Footer.tsx                        | 2 +-
 frontend/src/components/HomeSpeedDial.tsx                 | 4 +---
 frontend/src/types/index.ts                               | 5 ++---
 frontend/src/views/Archive.tsx                            | 2 --
 8 files changed, 11 insertions(+), 20 deletions(-)
 rename frontend/src/components/{DownloadsCardView.tsx => DownloadsGridView.tsx} (83%)

diff --git a/frontend/package.json b/frontend/package.json
index 748fe81..215f699 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "yt-dlp-webui",
-  "version": "3.0.9",
+  "version": "3.1.0",
   "description": "Frontend compontent of yt-dlp-webui",
   "scripts": {
     "dev": "vite",
diff --git a/frontend/src/components/Downloads.tsx b/frontend/src/components/Downloads.tsx
index d04b5b4..5caa3ec 100644
--- a/frontend/src/components/Downloads.tsx
+++ b/frontend/src/components/Downloads.tsx
@@ -3,7 +3,7 @@ import { useRecoilState, useRecoilValue } from 'recoil'
 import { loadingDownloadsState } from '../atoms/downloads'
 import { listViewState } from '../atoms/settings'
 import { loadingAtom } from '../atoms/ui'
-import DownloadsCardView from './DownloadsCardView'
+import DownloadsGridView from './DownloadsGridView'
 import DownloadsTableView from './DownloadsTableView'
 
 const Downloads: React.FC = () => {
@@ -21,7 +21,7 @@ const Downloads: React.FC = () => {
 
   if (tableView) return <DownloadsTableView />
 
-  return <DownloadsCardView />
+  return <DownloadsGridView />
 }
 
 export default Downloads
\ No newline at end of file
diff --git a/frontend/src/components/DownloadsCardView.tsx b/frontend/src/components/DownloadsGridView.tsx
similarity index 83%
rename from frontend/src/components/DownloadsCardView.tsx
rename to frontend/src/components/DownloadsGridView.tsx
index 222041d..b54d7e7 100644
--- a/frontend/src/components/DownloadsCardView.tsx
+++ b/frontend/src/components/DownloadsGridView.tsx
@@ -6,15 +6,13 @@ import { useI18n } from '../hooks/useI18n'
 import { useRPC } from '../hooks/useRPC'
 import DownloadCard from './DownloadCard'
 
-const DownloadsCardView: React.FC = () => {
+const DownloadsGridView: React.FC = () => {
   const downloads = useRecoilValue(activeDownloadsState)
 
   const { i18n } = useI18n()
   const { client } = useRPC()
   const { pushMessage } = useToast()
 
-  const abort = (id: string) => client.kill(id)
-
   return (
     <Grid container spacing={{ xs: 2, md: 2 }} columns={{ xs: 4, sm: 8, md: 12, xl: 12 }} pt={2}>
       {
@@ -22,7 +20,7 @@ const DownloadsCardView: React.FC = () => {
           <Grid item xs={4} sm={8} md={6} xl={4} key={download.id}>
             <DownloadCard
               download={download}
-              onStop={() => abort(download.id)}
+              onStop={() => client.kill(download.id)}
               onCopy={() => pushMessage(i18n.t('clipboardAction'), 'info')}
             />
           </Grid>
@@ -32,4 +30,4 @@ const DownloadsCardView: React.FC = () => {
   )
 }
 
-export default DownloadsCardView
\ No newline at end of file
+export default DownloadsGridView
\ No newline at end of file
diff --git a/frontend/src/components/DownloadsTableView.tsx b/frontend/src/components/DownloadsTableView.tsx
index 886964f..85ab27e 100644
--- a/frontend/src/components/DownloadsTableView.tsx
+++ b/frontend/src/components/DownloadsTableView.tsx
@@ -123,8 +123,6 @@ const DownloadsTableView: React.FC = () => {
   const serverAddr = useRecoilValue(serverURL)
   const { client } = useRPC()
 
-  const abort = (id: string) => client.kill(id)
-
   const viewFile = (path: string) => {
     const encoded = base64URLEncode(path)
     window.open(`${serverAddr}/archive/v/${encoded}?token=${localStorage.getItem('token')}`)
@@ -170,7 +168,7 @@ const DownloadsTableView: React.FC = () => {
           <ButtonGroup>
             <IconButton
               size="small"
-              onClick={() => abort(download.id)}
+              onClick={() => client.kill(download.id)}
             >
               {download.progress.percentage === '-1' ? <DeleteIcon /> : <StopCircleIcon />}
 
diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx
index 32422ec..45a30a8 100644
--- a/frontend/src/components/Footer.tsx
+++ b/frontend/src/components/Footer.tsx
@@ -35,7 +35,7 @@ const Footer: React.FC = () => {
         display: 'flex', gap: 1, justifyContent: 'space-between'
       }}>
         <div style={{ display: 'flex', gap: 4, alignItems: 'center' }}>
-          <Chip label="RPC v3.0.9" variant="outlined" size="small" />
+          <Chip label="RPC v3.1.0" variant="outlined" size="small" />
           <VersionIndicator />
         </div>
         <div style={{ display: 'flex', gap: 4, 'alignItems': 'center' }}>
diff --git a/frontend/src/components/HomeSpeedDial.tsx b/frontend/src/components/HomeSpeedDial.tsx
index 2fd9940..f53ad50 100644
--- a/frontend/src/components/HomeSpeedDial.tsx
+++ b/frontend/src/components/HomeSpeedDial.tsx
@@ -26,8 +26,6 @@ const HomeSpeedDial: React.FC<Props> = ({ onDownloadOpen, onEditorOpen }) => {
   const { i18n } = useI18n()
   const { client } = useRPC()
 
-  const abort = () => client.killAll()
-
   return (
     <SpeedDial
       ariaLabel="Home speed dial"
@@ -47,7 +45,7 @@ const HomeSpeedDial: React.FC<Props> = ({ onDownloadOpen, onEditorOpen }) => {
       <SpeedDialAction
         icon={<DeleteForeverIcon />}
         tooltipTitle={i18n.t('abortAllButton')}
-        onClick={abort}
+        onClick={() => client.killAll()}
       />
       <SpeedDialAction
         icon={<BuildCircleIcon />}
diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts
index 2b263f4..932804b 100644
--- a/frontend/src/types/index.ts
+++ b/frontend/src/types/index.ts
@@ -76,15 +76,14 @@ export type DirectoryEntry = {
   name: string
   path: string
   size: number
-  shaSum: string
   modTime: string
   isVideo: boolean
   isDirectory: boolean
 }
 
-export type DeleteRequest = Pick<DirectoryEntry, 'path' | 'shaSum'>
+export type DeleteRequest = Pick<DirectoryEntry, 'path'>
 
-export type PlayRequest = Pick<DirectoryEntry, 'path'>
+export type PlayRequest = DeleteRequest
 
 export type CustomTemplate = {
   id: string
diff --git a/frontend/src/views/Archive.tsx b/frontend/src/views/Archive.tsx
index 194af4f..ba675bd 100644
--- a/frontend/src/views/Archive.tsx
+++ b/frontend/src/views/Archive.tsx
@@ -113,7 +113,6 @@ export default function Downloaded() {
             modTime: '',
             name: '..',
             path: upperLevel,
-            shaSum: '',
             size: 0,
           }, ...r.filter(f => f.name !== '')]
           : r.filter(f => f.name !== '')
@@ -144,7 +143,6 @@ export default function Downloaded() {
       method: 'POST',
       body: JSON.stringify({
         path: entry.path,
-        shaSum: entry.shaSum,
       })
     }),
     matchW(