From 1a443c2d04123b9d3aa6aae91d233eb97866f45c Mon Sep 17 00:00:00 2001
From: llj <lingjun.li1@gmail.com>
Date: Wed, 10 Jul 2024 14:44:53 +0800
Subject: [PATCH] ['group members' dialog] display a scrollbar in the dialog
 when it needs (#6324)

---
 frontend/src/components/dialog/group-members-dialog.js | 2 +-
 frontend/src/css/group-view.css                        | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/dialog/group-members-dialog.js b/frontend/src/components/dialog/group-members-dialog.js
index b6b3e9dc83..6b13ab21c5 100644
--- a/frontend/src/components/dialog/group-members-dialog.js
+++ b/frontend/src/components/dialog/group-members-dialog.js
@@ -15,7 +15,7 @@ class GroupMembers extends React.Component {
     return (
       <Modal isOpen={true} toggle={this.props.toggleDialog}>
         <ModalHeader toggle={this.props.toggleDialog}>{`${gettext('Group members')} (${members.length})`}</ModalHeader>
-        <ModalBody className="px-0">
+        <ModalBody className="px-0 group-members-container">
           <ul className="list-unstyled">
             {members.map((item, index) => {
               return <li key={index} className="group-member px-4 py-2 d-flex align-items-center">
diff --git a/frontend/src/css/group-view.css b/frontend/src/css/group-view.css
index d31de1937d..3abdd129e6 100644
--- a/frontend/src/css/group-view.css
+++ b/frontend/src/css/group-view.css
@@ -1,3 +1,8 @@
+.group-members-container {
+  max-height: 500px;
+  overflow: auto;
+}
+
 .group-member:hover {
   background: #f5f5f5;
 }