reorganize

src/client/js/components/Admin/UserGroupDetail/UserGroupDetailPage.jsx

@@ -20,12 +20,16 @@ class UserGroupDetailPage extends React.Component {
           <i className="icon-fw ti-arrow-left" aria-hidden="true"></i>
         グループ一覧に戻る
         </a>
-        <UserGroupEditForm />
+        <div className="m-t-20 form-box">
+          <UserGroupEditForm />
+        </div>
         <legend className="m-t-20">{ t('User List') }</legend>
         <UserGroupUserTable />
         <UserGroupUserModal />
         <legend className="m-t-20">{ t('Page') }</legend>
-        <UserGroupPageList />
+        <div className="page-list">
+          <UserGroupPageList />
+        </div>
       </div>
     );
   }

src/client/js/components/Admin/UserGroupDetail/UserGroupEditForm.jsx

@@ -58,35 +58,33 @@ class UserGroupEditForm extends React.Component {
     const { t, userGroupDetailContainer } = this.props;
 
     return (
-      <div className="m-t-20 form-box">
-        <form className="form-horizontal" onSubmit={this.handleSubmit}>
-          <fieldset>
-            <legend>基本情報</legend>
-            <div className="form-group">
-              <label htmlFor="name" className="col-sm-2 control-label">{ t('Name') }</label>
-              <div className="col-sm-4">
-                <input className="form-control" type="text" name="name" value={this.state.name} onChange={this.changeUserGroupName} />
-              </div>
+      <form className="form-horizontal" onSubmit={this.handleSubmit}>
+        <fieldset>
+          <legend>基本情報</legend>
+          <div className="form-group">
+            <label htmlFor="name" className="col-sm-2 control-label">{ t('Name') }</label>
+            <div className="col-sm-4">
+              <input className="form-control" type="text" name="name" value={this.state.name} onChange={this.changeUserGroupName} />
             </div>
-            <div className="form-group">
-              <label className="col-sm-2 control-label">{ t('Created') }</label>
-              <div className="col-sm-4">
-                <input
-                  type="text"
-                  className="form-control"
-                  value={dateFnsFormat(new Date(userGroupDetailContainer.state.userGroup.createdAt), 'YYYY-MM-DD')}
-                  disabled
-                />
-              </div>
+          </div>
+          <div className="form-group">
+            <label className="col-sm-2 control-label">{ t('Created') }</label>
+            <div className="col-sm-4">
+              <input
+                type="text"
+                className="form-control"
+                value={dateFnsFormat(new Date(userGroupDetailContainer.state.userGroup.createdAt), 'YYYY-MM-DD')}
+                disabled
+              />
             </div>
-            <div className="form-group">
-              <div className="col-sm-offset-2 col-sm-10">
-                <button type="submit" className="btn btn-primary" disabled={!this.validateForm()}>{ t('Update') }</button>
-              </div>
+          </div>
+          <div className="form-group">
+            <div className="col-sm-offset-2 col-sm-10">
+              <button type="submit" className="btn btn-primary" disabled={!this.validateForm()}>{ t('Update') }</button>
             </div>
-          </fieldset>
-        </form>
-      </div>
+          </div>
+        </fieldset>
+      </form>
     );
   }
 

src/client/js/components/Admin/UserGroupDetail/UserGroupPageList.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
 
@@ -13,12 +13,12 @@ class UserGroupPageList extends React.Component {
     const { t, userGroupDetailContainer } = this.props;
 
     return (
-      <div className="page-list">
+      <Fragment>
         <ul className="page-list-ul page-list-ul-flat">
           {userGroupDetailContainer.state.relatedPages.map((page) => { return <Page key={page._id} page={page} /> })}
         </ul>
         {userGroupDetailContainer.state.relatedPages.length === 0 ? <p>{ t('user_group_management.no_pages') }</p> : null}
-      </div>
+      </Fragment>
     );
   }
 

src/client/js/components/Admin/UserGroupDetail/UserGroupUserFormByClick.jsx

@@ -44,11 +44,7 @@ class UserGroupUserFormByClick extends React.Component {
             })}
         </ul>
 
-        {userGroupDetailContainer.state.unrelatedUsers.length === 0 ? (
-          <Fragment>
-              No users available.
-          </Fragment>
-          ) : null}
+        {userGroupDetailContainer.state.unrelatedUsers.length === 0 ? 'No users available.' : null}
       </Fragment>
     );
   }