Use lazy loading for slot fragments

client/coral-framework/helpers/plugins.js

@@ -2,12 +2,12 @@ import React from 'react';
 import uniq from 'lodash/uniq';
 import pick from 'lodash/pick';
 import merge from 'lodash/merge';
-import plugins from 'pluginsConfig';
-import flatten from 'lodash/flatten';
 import flattenDeep from 'lodash/flattenDeep';
+import flatten from 'lodash/flatten';
 import {loadTranslations} from 'coral-framework/services/i18n';
 import {injectReducers, getStore} from 'coral-framework/services/store';
 import camelize from './camelize';
+import plugins from 'pluginsConfig';
 
 export function getSlotComponents(slot) {
   const pluginConfig = getStore().getState().config.plugin_config;

plugins/talk-plugin-featured-comments/client/containers/Tab.js

@@ -5,7 +5,7 @@ import Tab from '../components/Tab';
 const enhance = compose(
   withFragments({
     asset: gql`
-      fragment TalkFeatured_Tab_asset on Asset {
+      fragment TalkFeaturedComments_Tab_asset on Asset {
           featuredCommentsCount: totalCommentCount(tags: ["FEATURED"], excludeIgnored: $excludeIgnored)
       }`,
   }),

plugins/talk-plugin-featured-comments/client/containers/TabPane.js

@@ -3,8 +3,14 @@ import {bindActionCreators} from 'redux';
 import {compose, gql} from 'react-apollo';
 import TabPane from '../components/TabPane';
 import {withFragments} from 'plugin-api/beta/client/hocs';
+import {getSlotFragmentSpreads} from 'plugin-api/beta/client/utils';
+
 import {viewComment} from 'coral-embed-stream/src/actions/stream';
 
+const slots = [
+  'commentReactions',
+];
+
 const mapDispatchToProps = (dispatch) =>
   bindActionCreators({
     viewComment,
@@ -13,8 +19,14 @@ const mapDispatchToProps = (dispatch) =>
 const enhance = compose(
   connect(null, mapDispatchToProps),
   withFragments({
+    root: gql`
+      fragment TalkFeaturedComments_TabPane_root on RootQuery {
+        __typename
+        ${getSlotFragmentSpreads(slots, 'root')}
+      }
+    `,
     asset: gql`
-      fragment TalkFeatured_TabPane_asset on Asset {
+      fragment TalkFeaturedComments_TabPane_asset on Asset {
         id
         featuredComments: comments(tags: ["FEATURED"], excludeIgnored: $excludeIgnored, deep: true) {
           nodes {
@@ -27,21 +39,16 @@ const enhance = compose(
                 name
               }
             }
-            action_summaries {
-              ... on LikeActionSummary {
-                count
-                current_user {
-                  id
-                }
-              }
-            }
             user {
               id
               username
             }
+            ${getSlotFragmentSpreads(slots, 'comment')}
           }
         }
-      }`,
+        ${getSlotFragmentSpreads(slots, 'asset')}
+      }
+    `,
   }),
 );