From ab2e036047a8321185fa18dab0824f2c6c0f864b Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 18 Sep 2017 15:49:23 -0300
Subject: [PATCH] withFragments and parent withQuery added

---
 .../routes/Community/components/Community.js  | 12 ++---
 .../Community/components/FlaggedAccounts.js   |  2 +
 .../routes/Community/containers/Community.js  | 22 +++++++--
 .../Community/containers/FlaggedAccounts.js   | 48 ++++++++-----------
 4 files changed, 45 insertions(+), 39 deletions(-)

diff --git a/client/coral-admin/src/routes/Community/components/Community.js b/client/coral-admin/src/routes/Community/components/Community.js
index 1b3e4ac72..94f064ff6 100644
--- a/client/coral-admin/src/routes/Community/components/Community.js
+++ b/client/coral-admin/src/routes/Community/components/Community.js
@@ -74,9 +74,11 @@ export default class Community extends Component {
       );
     }
 
+    // console.log('Community Container', this.props);
+
     return (
       <div>
-        <FlaggedAccounts />
+        <FlaggedAccounts {...this.props} />
         <RejectUsernameDialog
           open={community.rejectUsernameDialog}
           handleClose={props.hideRejectUsernameDialog}
@@ -94,12 +96,8 @@ export default class Community extends Component {
 
     return (
       <div>
-        <CommunityMenu
-          flaggedUsernamesCount={flaggedUsernamesCount}
-        />
-        <div>
-          { tab }
-        </div>
+        <CommunityMenu flaggedUsernamesCount={flaggedUsernamesCount} />
+        <div>{tab}</div>
       </div>
     );
   }
diff --git a/client/coral-admin/src/routes/Community/components/FlaggedAccounts.js b/client/coral-admin/src/routes/Community/components/FlaggedAccounts.js
index 1d78c015a..578dc2d82 100644
--- a/client/coral-admin/src/routes/Community/components/FlaggedAccounts.js
+++ b/client/coral-admin/src/routes/Community/components/FlaggedAccounts.js
@@ -19,6 +19,8 @@ class FlaggedAccounts extends React.Component {
       me,
       viewUserDetail,
     } = this.props;
+    
+    console.log('Flagged Accounts ROOT', this.props.root);
 
     const hasResults = users.nodes && !!users.nodes.length;
 
diff --git a/client/coral-admin/src/routes/Community/containers/Community.js b/client/coral-admin/src/routes/Community/containers/Community.js
index cc4b3b343..46ae43a40 100644
--- a/client/coral-admin/src/routes/Community/containers/Community.js
+++ b/client/coral-admin/src/routes/Community/containers/Community.js
@@ -4,7 +4,12 @@ import {bindActionCreators} from 'redux';
 import {compose, gql} from 'react-apollo';
 import withQuery from 'coral-framework/hocs/withQuery';
 
+import FlaggedAccounts from '../containers/FlaggedAccounts';
+import FlaggedUser from '../containers/FlaggedUser';
+
 import {withSetUserStatus, withRejectUsername} from 'coral-framework/graphql/mutations';
+import {getDefinitionName} from 'coral-framework/utils';
+
 import {
   fetchAccounts,
   updateSorting,
@@ -21,9 +26,7 @@ class CommunityContainer extends Component {
   }
 
   render() {
-    return (
-      <Community {...this.props} />
-    );
+    return <Community {...this.props} />
   }
 }
 const mapStateToProps = (state) => ({
@@ -31,12 +34,21 @@ const mapStateToProps = (state) => ({
 });
 
 
-const withFlaggedUsernamesCount = withQuery(gql`
+const withData = withQuery(gql`
     query TalkAdmin_FlaggedUsernamesCount {
       flaggedUsernamesCount: userCount(query: {
         action_type: FLAG
       })
+      ...${getDefinitionName(FlaggedAccounts.fragments.root)}
+      ...${getDefinitionName(FlaggedUser.fragments.root)}
+      me {
+        ...${getDefinitionName(FlaggedUser.fragments.me)}
+        __typename
+      }
     }
+    ${FlaggedAccounts.fragments.root}
+    ${FlaggedUser.fragments.root}
+    ${FlaggedUser.fragments.me}
   `, {
   options: {
     fetchPolicy: 'network-only',
@@ -55,5 +67,5 @@ export default compose(
   connect(mapStateToProps, mapDispatchToProps),
   withSetUserStatus,
   withRejectUsername,
-  withFlaggedUsernamesCount,
+  withData,
 )(CommunityContainer);
diff --git a/client/coral-admin/src/routes/Community/containers/FlaggedAccounts.js b/client/coral-admin/src/routes/Community/containers/FlaggedAccounts.js
index 00c6fdf33..ad824b4af 100644
--- a/client/coral-admin/src/routes/Community/containers/FlaggedAccounts.js
+++ b/client/coral-admin/src/routes/Community/containers/FlaggedAccounts.js
@@ -2,7 +2,7 @@ import React, {Component} from 'react';
 import {connect} from 'react-redux';
 import {bindActionCreators} from 'redux';
 import {compose, gql} from 'react-apollo';
-import withQuery from 'coral-framework/hocs/withQuery';
+import {withFragments} from 'plugin-api/beta/client/hocs';
 import {Spinner} from 'coral-ui';
 
 import {withSetUserStatus} from 'coral-framework/graphql/mutations';
@@ -50,6 +50,8 @@ class FlaggedAccountsContainer extends Component {
   };
 
   render() {
+    console.log('Flagged AccountsContainer', this.props);
+
     if (this.props.data.error) {
       return <div>{this.props.data.error.message}</div>;
     }
@@ -88,31 +90,6 @@ const LOAD_MORE_QUERY = gql`
   ${FlaggedUser.fragments.user}
 `;
 
-export const withFlaggedAccountsyQuery = withQuery(gql`
-  query TalkAdmin_FlaggedAccounts {
-    ...${getDefinitionName(FlaggedUser.fragments.root)}
-    users(query:{action_type: FLAG, statuses: [PENDING], limit: 10}){
-      hasNextPage
-      endCursor
-      nodes {
-        __typename
-        ...${getDefinitionName(FlaggedUser.fragments.user)}
-      }
-    }
-    me {
-      __typename
-      ...${getDefinitionName(FlaggedUser.fragments.me)}
-    }
-  }
-  ${FlaggedUser.fragments.root}
-  ${FlaggedUser.fragments.user}
-  ${FlaggedUser.fragments.me}
-`, {
-  options: {
-    fetchPolicy: 'network-only',
-  },
-});
-
 const mapDispatchToProps = (dispatch) =>
   bindActionCreators({
     showBanUserDialog,
@@ -123,6 +100,23 @@ const mapDispatchToProps = (dispatch) =>
 
 export default compose(
   connect(null, mapDispatchToProps),
-  withFlaggedAccountsyQuery,
   withSetUserStatus,
+  withFragments({
+    root: gql`
+      fragment TalkAdminCommunity_FlaggedAccounts_root on RootQuery {
+        users(query:{action_type: FLAG, statuses: [PENDING], limit: 10}){
+          hasNextPage
+          endCursor
+          nodes {
+            __typename
+            ...${getDefinitionName(FlaggedUser.fragments.user)}
+          }
+        }
+        me {
+          id
+        }
+      }
+      ${FlaggedUser.fragments.user}
+    `,
+  }),
 )(FlaggedAccountsContainer);