From a8fb9834c3a783300706566bc963a9d7d5c34886 Mon Sep 17 00:00:00 2001
From: Jesse Chan <jc@linux.com>
Date: Wed, 30 Jun 2021 19:35:22 +0800
Subject: [PATCH] TorrentListCell: passthrough clicks

TorrentListCell elements can block click events of TorrentListRow,
and prevents users from opening the details panel when they double
click. This is especially visible with large elements like percentage
bar.

This change declares the cell as unclickable, so events can be processed.
---
 .../javascript/components/torrent-list/TorrentListCell.tsx   | 1 +
 .../components/torrent-list/TorrentListRowExpanded.tsx       | 2 +-
 client/src/sass/components/_torrent.scss                     | 5 -----
 3 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/client/src/javascript/components/torrent-list/TorrentListCell.tsx b/client/src/javascript/components/torrent-list/TorrentListCell.tsx
index 96525cfb..d5f3c6ca 100644
--- a/client/src/javascript/components/torrent-list/TorrentListCell.tsx
+++ b/client/src/javascript/components/torrent-list/TorrentListCell.tsx
@@ -170,6 +170,7 @@ const TorrentListCell: FC<TorrentListCellProps> = observer(
         className={
           classNameOverride ? className : classnames('torrent__detail', `torrent__detail--${column}`, className)
         }
+        css={{pointerEvents: 'none', userSelect: 'none'}}
         role="cell"
         style={{width: `${width}px`}}>
         {icon}
diff --git a/client/src/javascript/components/torrent-list/TorrentListRowExpanded.tsx b/client/src/javascript/components/torrent-list/TorrentListRowExpanded.tsx
index f8e5cdcd..8c1f76dc 100644
--- a/client/src/javascript/components/torrent-list/TorrentListRowExpanded.tsx
+++ b/client/src/javascript/components/torrent-list/TorrentListRowExpanded.tsx
@@ -121,7 +121,7 @@ const TorrentListRowExpanded = observer(
           onTouchEnd={handleTouchEnd}
           onKeyPress={handleKeyPress}
           ref={ref}>
-          <div className="torrent__details__section__wrapper">
+          <div css={{alignItems: 'center', display: 'flex'}}>
             {primarySection}
             <div className="torrent__details__section torrent__details__section--secondary">{secondarySection}</div>
           </div>
diff --git a/client/src/sass/components/_torrent.scss b/client/src/sass/components/_torrent.scss
index 5557c2c0..3d7668f1 100644
--- a/client/src/sass/components/_torrent.scss
+++ b/client/src/sass/components/_torrent.scss
@@ -374,11 +374,6 @@ $more-info--border: floating-action.$textbox-repeater--button--border;
               }
             }
           }
-
-          &__wrapper {
-            align-items: center;
-            display: flex;
-          }
         }
       }