emit download errors

src/ui/App.tsx

@@ -64,7 +64,7 @@ class App extends React.Component<IProps, IState> {
         {
           // Mini downloads section
           this.state.miniDownloadsOpen ? 
-            <MiniDialog closeFn={() => {
+            <MiniDialog title="Downloads" closeFn={() => {
               this.setState({ miniDownloadsOpen: false })
             }}>
               <DownloadList downloadManager={downloadHandler} />

src/ui/components/MiniDialog.tsx

@@ -5,6 +5,7 @@ import './MiniDialog.css'
 
 interface IProps {
   children: React.ReactNode[] | React.ReactNode;
+  title?: string;
   closeFn: () => void;
 }
 
@@ -17,7 +18,7 @@ export default class MiniDialog extends React.Component<IProps, never> {
     return (
       <div className="MiniDialog">
         <div className="MiniDialogTop" onClick={this.props.closeFn}>
-          <div></div>
+          <span>{this.props?.title}</span>
           <img src={Close} className="MiniDialogClose" />
         </div>
         <div className="MiniDialogInner">

src/ui/components/common/DownloadList.css

@@ -0,0 +1,7 @@
+.DownloadList {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow-y: auto;
+  padding: 10px;
+}

src/ui/components/common/DownloadList.tsx

@@ -14,14 +14,17 @@ export default class DownloadList extends React.Component<IProps, never> {
   }
 
   render() {
+    const list = this.props.downloadManager.getDownloads().map((download) => {
+      return (
+        <DownloadSection key={download.path} downloadName={download.path} downloadManager={this.props.downloadManager} />
+      )
+    })
+
+
     return (
       <div className="DownloadList">
         {
-          this.props.downloadManager.getDownloads().map((download) => {
-            return (
-              <DownloadSection key={download.path} downloadName={download.path} downloadManager={this.props.downloadManager} />
-            )
-          })
+          list.length > 0 ? list : 'No downloads present'
         }
       </div>
     )

src/ui/components/common/ProgressBar.tsx

@@ -33,9 +33,8 @@ export default class ProgressBar extends React.Component<IProps, IState> {
         total: prog?.total || 0,
       })
 
-      if (this.state.status === 'finished' /* || this.state.status === 'error' */) {
+      if (this.state.status === 'finished' || this.state.status === 'error') {
         // Ensure progress is 100%
-
         clearInterval(intv)
       }
     }, 500)

src/utils/download.ts

@@ -8,6 +8,7 @@ export default class DownloadHandler {
     progress: number,
     total: number,
     status: string,
+    error?: string,
   }[]
 
   // Pass tauri invoke function
@@ -35,6 +36,19 @@ export default class DownloadHandler {
       const index = this.downloads.findIndex(download => download.path === filename)
       this.downloads[index].status = 'finished'
     })
+
+    listen('download_error', (...payload) => {
+      // @ts-expect-error shut up typescript
+      const errorData: {
+        path: string,
+        error: string,
+      } = payload[0]?.payload
+
+      // Set download to error
+      const index = this.downloads.findIndex(download => download.path === errorData.path)
+      this.downloads[index].status = 'error'
+      this.downloads[index].error = errorData.error
+    })
   }
 
   getDownloads() {