From 79b5e696b65b1281496a0ee184171054ad47175f Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Tue, 20 Jun 2023 00:58:40 +0200
Subject: [PATCH] Fix/setting buttons unclickable area (#379)

* Move "onClick" handler to "ListItemButton" - LibrarySettings "global update categories"

Clicks were only handled on the button content leading to a small area around the content to not handle the clicks, thus, not opening the dialog

* Move "onClick" handler to "ListItemButton" - Settings "manga item width"

Clicks were only handled on the button content leading to a small area around the content to not handle the clicks, thus, not opening the dialog
---
 src/screens/Settings.tsx                 | 14 ++++++--------
 src/screens/settings/LibrarySettings.tsx |  3 +--
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/src/screens/Settings.tsx b/src/screens/Settings.tsx
index 85425c25..b2aaa353 100644
--- a/src/screens/Settings.tsx
+++ b/src/screens/Settings.tsx
@@ -139,17 +139,15 @@ export default function Settings() {
                     </ListItemSecondaryAction>
                 </ListItem>
                 <SearchSettings />
-                <ListItemButton>
+                <ListItemButton
+                    onClick={() => {
+                        handleDialogOpenItemWidth();
+                    }}
+                >
                     <ListItemIcon>
                         <ViewModuleIcon />
                     </ListItemIcon>
-                    <ListItemText
-                        primary={t('settings.label.manga_item_width')}
-                        secondary={`px:${ItemWidth}`}
-                        onClick={() => {
-                            handleDialogOpenItemWidth();
-                        }}
-                    />
+                    <ListItemText primary={t('settings.label.manga_item_width')} secondary={`px:${ItemWidth}`} />
                 </ListItemButton>
                 <ListItem>
                     <ListItemIcon>
diff --git a/src/screens/settings/LibrarySettings.tsx b/src/screens/settings/LibrarySettings.tsx
index 91d4e62c..a4f509ff 100644
--- a/src/screens/settings/LibrarySettings.tsx
+++ b/src/screens/settings/LibrarySettings.tsx
@@ -145,7 +145,7 @@ export default function LibrarySettings() {
                     </ListSubheader>
                 }
             >
-                <ListItemButton>
+                <ListItemButton onClick={() => setIsDialogOpen(true)}>
                     <ListItemText
                         primary={t('category.title.categories')}
                         secondary={
@@ -163,7 +163,6 @@ export default function LibrarySettings() {
                             </>
                         }
                         secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
-                        onClick={() => setIsDialogOpen(true)}
                     />
                 </ListItemButton>
             </List>