fix-style-bug (#2734)

Fix style bug in group dialogs.

frontend/src/components/dialog/rename-group-dialog.js

@@ -9,7 +9,7 @@ class RenameGroupDialog extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      newGroupName: '',
+      newGroupName: this.props.currentGroupName,
     };
   }
 
@@ -65,6 +65,7 @@ const RenameGroupDialogPropTypes = {
   loadGroup: PropTypes.func.isRequired,
   groupID: PropTypes.string.isRequired,
   onGroupChanged: PropTypes.func.isRequired,
+  currentGroupName: PropTypes.string.isRequired,
 };
 
 RenameGroupDialog.propTypes = RenameGroupDialogPropTypes;

frontend/src/css/manage-members-dialog.css

@@ -36,6 +36,9 @@
   justify-content: space-between;
 }
 
-.group-transfer-select {
-  width: 82%;
+.group-transfer .group-transfer-select {
+  width: 385px;
+}
+.group-transfer .btn {
+  width: 75px;
 }

frontend/src/pages/groups/group-view.js

@@ -245,19 +245,22 @@ class GroupView extends React.Component {
 
   toggleDismissGroupDialog = () => {
     this.setState({
-      showDismissGroupDialog: !this.state.showDismissGroupDialog
+      showDismissGroupDialog: !this.state.showDismissGroupDialog,
+      showGroupDropdown: false,
     });
   }
 
   toggleRenameGroupDialog = () => {
     this.setState({
-      showRenameGroupDialog: !this.state.showRenameGroupDialog
+      showRenameGroupDialog: !this.state.showRenameGroupDialog,
+      showGroupDropdown: false,
     });
   }
 
   toggleTransferGroupDialog = () => {
     this.setState({
-      showTransferGroupDialog: !this.state.showTransferGroupDialog
+      showTransferGroupDialog: !this.state.showTransferGroupDialog,
+      showGroupDropdown: false,
     });
   }
 
@@ -269,7 +272,8 @@ class GroupView extends React.Component {
 
   toggleManageMembersDialog = () => {
     this.setState({
-      showManageMembersDialog: !this.state.showManageMembersDialog
+      showManageMembersDialog: !this.state.showManageMembersDialog,
+      showGroupDropdown: false,
     });
   }
 
@@ -430,6 +434,7 @@ class GroupView extends React.Component {
             loadGroup={this.loadGroup}
             groupID={this.props.groupID}
             onGroupChanged={this.props.onGroupChanged}
+            currentGroupName={currentGroup.name}
           />
         }
         {this.state.showDismissGroupDialog &&