Merge branch 'next' into hide-user-status-auth

2026-07-02 11:55:34 +08:00 · 2018-01-11 13:57:21 -07:00
parent d837562089 1e85894a0c
commit eec7d0fb63
12 changed files with 47 additions and 34 deletions
@@ -13,20 +13,30 @@ const buildUserHistory = (userState = {}) => {
    .map((k) => userState.status[k].history)), 'created_at', 'desc');
 };

-const buildActionResponse = (typename, status) => {
-  const actionResponses = {
-    'UsernameStatusHistory' : `Username Status: ${status}`,
-    'BannedStatusHistory': status ? 'User banned' : 'Ban removed',
-    'SuspensionStatusHistory': status ? 'Account Suspended' : 'Suspension removed'
-  };
+const buildActionResponse = (typename, until, status) => {
+  switch (typename) {
+  case 'UsernameStatusHistory':
+    return `Username ${status}`;
+  case 'BannedStatusHistory':
+    return status ? 'User banned' : 'Ban removed';
+  case 'SuspensionStatusHistory':
+    return until ? 'Account Suspended' : 'Suspension removed' ;
+  default:
+    return '-';
+  }
+};

-  return actionResponses[typename];
+const getModerationValue = (userId, assignedBy = {}) => {
+  if (assignedBy && userId !== assignedBy.id) {
+    return assignedBy.username;
+  }
+  return 'SYSTEM';
 };

 class AccountHistory extends React.Component {
  render() {
-    const {userState} = this.props;
-    const userHistory = buildUserHistory(userState);
+    const {user} = this.props;
+    const userHistory = buildUserHistory(user.state);
    return (
      <div>
        <div className={cn(styles.table, 'talk-admin-account-history')}>
@@ -36,16 +46,16 @@ class AccountHistory extends React.Component {
            <div className={styles.headerRowItem}>Moderation</div>
          </div>
          {
-            userHistory.map((h) => (
-              <div className={cn(styles.row, 'talk-admin-account-history-row')} key={`${h.__typename}_${murmur3(h.created_at)}`}>
+            userHistory.map(({__typename, created_at, assigned_by, until, status}) => (
+              <div className={cn(styles.row, 'talk-admin-account-history-row')} key={`${__typename}_${murmur3(created_at)}`}>
                <div className={cn(styles.item, 'talk-admin-account-history-row-date')}>
-                  {moment(new Date(h.created_at)).format('MMM DD, YYYY')}
+                  {moment(new Date(created_at)).format('MMM DD, YYYY')}
                </div>
                <div className={cn(styles.item, styles.action, 'talk-admin-account-history-row-status')}>
-                  {buildActionResponse(h.__typename, h.status)}
+                  {buildActionResponse(__typename, until, status)}
                </div>
                <div className={cn(styles.item, 'talk-admin-account-history-row-assigned-by')}>
-                  {h.assigned_by ? h.assigned_by.username : 'SYSTEM'}
+                  {getModerationValue(user.id, assigned_by)}
                </div>
              </div>
            ))
@@ -57,8 +67,7 @@ class AccountHistory extends React.Component {
 }

 AccountHistory.propTypes = {
-  history: PropTypes.array,
-  userState: PropTypes.object,
+  user: PropTypes.object.isRequired,
 };

 export default AccountHistory;
@@ -5,7 +5,7 @@

 .moreDetail {
  position: absolute;
-  font-size: 12px;
+  font-size: 13px;
  font-weight: 500;
  color: black;
  right: 16px;
@@ -207,7 +207,7 @@

  .toastify__body {
    color: white;
-    overflow-x: scroll;
+    overflow-x: auto;
    font-size: 15px;
    font-weight: 400;
  }
@@ -272,9 +272,7 @@ class UserDetail extends React.Component {
              />
            </TabPane>
            <TabPane tabId={'history'} className={'talk-admin-user-detail-history-tab-pane'}>
-              <AccountHistory
-                userState={user.state}
-              />
+              <AccountHistory user={user} />
            </TabPane>
          </TabContent>
        </Drawer>
@@ -171,6 +171,7 @@ export const withUserDetailQuery = withQuery(gql`
              until
              created_at
              assigned_by {
+                id
                username
              }
            }
@@ -180,6 +181,7 @@ export const withUserDetailQuery = withQuery(gql`
            history {
              status
              assigned_by {
+                id
                username
              }
              created_at
@@ -190,6 +192,7 @@ export const withUserDetailQuery = withQuery(gql`
            history {
              status
              assigned_by {
+                id
                username
              }
              created_at
@@ -35,6 +35,9 @@ export default withFragments({
      editing {
        edited
      }
+      status_history {
+        type
+      }
      ...${getDefinitionName(CommentLabels.fragments.comment)}
      ...${getDefinitionName(CommentDetails.fragments.comment)}
    }
@@ -20,7 +20,7 @@

 .mainContent {
  width: calc(100% - 300px);
-  padding: 10px 14px 80px 14px;
+  padding: 10px 14px 120px 14px;
  box-sizing: border-box;
  max-width: 718px;
 }
@@ -176,7 +176,7 @@ class Moderation extends Component {
            hasNextPage={comments.hasNextPage}
            activeTab={activeTab}
            singleView={moderation.singleView}
-            selectedCommentId={this.state.selectedCommentId}
+            selectedCommentId={moderation.selectedCommentId}
            acceptComment={props.acceptComment}
            rejectComment={props.rejectComment}
            loadMore={this.loadMore}
@@ -12,18 +12,18 @@
  margin: 0;
  font-weight: 500;
  display: inline-block;
-  font-size: 12px;
+  font-size: 13px;
  line-height: 12px;
  margin-right: 7px;
 }

 .info {
-  font-size: 12px;
+  font-size: 13px;
 }

 .details {
  padding: 0 20px 16px;
-  font-size: 12px;
+  font-size: 13px;

  &:empty {
    display: none;
@@ -32,6 +32,6 @@

 .icon {
  vertical-align: middle;
-  font-size: 12px;
+  font-size: 13px;
  margin-right: 7px;
 }
@@ -4,7 +4,7 @@
  list-style: none;
  display: inline-block;
  padding: 0;
-  font-size: 12px;
+  font-size: 13px;
  margin: 0;
 }

@@ -12,7 +12,7 @@
  margin: 0;
  padding: 0;
  list-style: none;
-  font-size: 12px;
+  font-size: 13px;
  font-weight: 500;
 }

@@ -20,7 +20,7 @@
  margin-left:10px;
  padding: 0;
  list-style: none;
-  font-size: 12px;
+  font-size: 13px;
  font-weight: normal;
  color: #888;
 }
@@ -4,7 +4,7 @@
  list-style: none;
  display: inline-block;
  padding: 0;
-  font-size: 12px;
+  font-size: 13px;
  margin: 0;
 }

@@ -12,7 +12,7 @@
  margin: 0;
  padding: 0;
  list-style: none;
-  font-size: 12px;
+  font-size: 13px;
  font-weight: 500;
 }

@@ -20,7 +20,7 @@
  margin-left:10px;
  padding: 0;
  list-style: none;
-  font-size: 12px;
+  font-size: 13px;
  font-weight: normal;
  color: #888;
 }
@@ -1,6 +1,6 @@
 en:
  talk-plugin-flag-details:
-    flags: Flags
+    flags: Reports
 es:
  talk-plugin-flag-details:
    flags: Reportes