swig to api

src/client/js/app.js

@@ -330,8 +330,6 @@ if (adminRebuildSearchElem != null) {
 
 const adminUserGroupPageElem = document.getElementById('admin-user-group-page');
 if (adminUserGroupPageElem != null) {
-  const userGroups = JSON.parse(adminUserGroupPageElem.getAttribute('data-user-groups'));
-  const userGroupRelations = JSON.parse(adminUserGroupPageElem.getAttribute('data-user-group-relations'));
   const isAclEnabled = adminUserGroupPageElem.getAttribute('data-isAclEnabled') === 'true';
 
   ReactDOM.render(
@@ -339,8 +337,6 @@ if (adminUserGroupPageElem != null) {
       <I18nextProvider i18n={i18n}>
         <UserGroupPage
           crowi={appContainer}
-          userGroups={userGroups}
-          userGroupRelations={userGroupRelations}
           isAclEnabled={isAclEnabled}
         />
       </I18nextProvider>

src/client/js/components/Admin/UserGroup/UserGroupPage.jsx

@@ -15,8 +15,8 @@ class UserGroupPage extends React.Component {
     super(props);
 
     this.state = {
-      userGroups: props.userGroups,
-      userGroupRelations: props.userGroupRelations,
+      userGroups: [],
+      userGroupRelations: {},
       selectedUserGroup: undefined, // not null but undefined (to use defaultProps in UserGroupDeleteModal)
       isDeleteModalShow: false,
     };
@@ -29,6 +29,10 @@ class UserGroupPage extends React.Component {
     this.deleteUserGroupById = this.deleteUserGroupById.bind(this);
   }
 
+  async componentDidMount() {
+    await this.syncUserGroupAndRelations();
+  }
+
   async showDeleteModal(group) {
     try {
       await this.syncUserGroupAndRelations();
@@ -153,8 +157,6 @@ const UserGroupPageWrapper = (props) => {
 UserGroupPage.propTypes = {
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
 
-  userGroups: PropTypes.arrayOf(PropTypes.object).isRequired,
-  userGroupRelations: PropTypes.object.isRequired,
   isAclEnabled: PropTypes.bool,
 };
 

src/server/views/admin/user-groups.html

@@ -19,8 +19,6 @@
     <div
       id ="admin-user-group-page"
       class="col-md-9"
-      data-user-groups="{{ userGroups|json }}"
-      data-user-group-relations="{{ userGroupRelations|json }}"
       data-isAclEnabled="{{ isAclEnabled }}"
     >
       <!-- Reactify Paginator start -->