From 3c96053b7f8507cf233c4c8a7a99c4bc00a5820e Mon Sep 17 00:00:00 2001
From: ajnart <ajnart@pm.me>
Date: Mon, 30 May 2022 09:19:49 +0200
Subject: [PATCH] :sparkles: Add a ScrollArea to the Downloads module

---
 .../modules/downloads/DownloadsModule.tsx     | 23 ++++++++++++++-----
 1 file changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/modules/downloads/DownloadsModule.tsx b/src/components/modules/downloads/DownloadsModule.tsx
index 3516ab89c..f8f55fd26 100644
--- a/src/components/modules/downloads/DownloadsModule.tsx
+++ b/src/components/modules/downloads/DownloadsModule.tsx
@@ -1,4 +1,13 @@
-import { Table, Text, Tooltip, Title, Group, Progress, Skeleton } from '@mantine/core';
+import {
+  Table,
+  Text,
+  Tooltip,
+  Title,
+  Group,
+  Progress,
+  Skeleton,
+  ScrollArea,
+} from '@mantine/core';
 import { IconDownload as Download } from '@tabler/icons';
 import { useEffect, useState } from 'react';
 import axios from 'axios';
@@ -129,12 +138,14 @@ export default function DownloadComponent() {
     );
   });
   return (
-    <Group noWrap direction="column">
+    <Group noWrap grow direction="column">
       <Title order={4}>Your torrents</Title>
-      <Table highlightOnHover>
-        <thead>{ths}</thead>
-        <tbody>{rows}</tbody>
-      </Table>
+      <ScrollArea sx={{ height: 300 }}>
+        <Table highlightOnHover>
+          <thead>{ths}</thead>
+          <tbody>{rows}</tbody>
+        </Table>
+      </ScrollArea>
     </Group>
   );
 }