Revert "Using fragment and updated fixtures"

This reverts commit 8dae12b5ab.

src/core/client/stream/containers/AppContainer.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { withFragmentContainer } from "talk-framework/lib/relay";
+
 import { graphql, withLocalStateContainer } from "talk-framework/lib/relay";
 import { AppContainerLocal as Local } from "talk-stream/__generated__/AppContainerLocal.graphql";
 import {
@@ -8,13 +8,12 @@ import {
   withSetActiveTabMutation,
 } from "talk-stream/mutations";
 
-import { AppContainer_asset as AssetData } from "talk-stream/__generated__/AppContainer_asset.graphql";
 import App from "../components/App";
 
 interface InnerProps {
   local: Local;
   setActiveTab: SetActiveTabMutation;
-  asset: AssetData;
+  commentCount: number;
 }
 
 class AppContainer extends React.Component<InnerProps> {
@@ -25,37 +24,25 @@ class AppContainer extends React.Component<InnerProps> {
   public render() {
     const {
       local: { activeTab },
-      asset,
+      commentCount,
     } = this.props;
 
     return (
       <App
         activeTab={activeTab}
         onTabClick={this.handleSetActiveTab}
-        commentCount={asset.commentCounts.totalVisible}
+        commentCount={commentCount}
       />
     );
   }
 }
 
-const enhanced = withSetActiveTabMutation(
-  withFragmentContainer<InnerProps>({
-    asset: graphql`
-      fragment AppContainer_asset on Asset {
-        commentCounts {
-          totalVisible
-        }
-      }
-    `,
-  })(
-    withLocalStateContainer(
-      graphql`
-        fragment AppContainerLocal on Local {
-          activeTab
-        }
-      `
-    )(AppContainer)
-  )
-);
+const enhanced = withLocalStateContainer(
+  graphql`
+    fragment AppContainerLocal on Local {
+      activeTab
+    }
+  `
+)(withSetActiveTabMutation(AppContainer));
 
 export default enhanced;

src/core/client/stream/queries/AppQuery.tsx

@@ -32,7 +32,9 @@ export const render = ({
       );
     }
 
-    return <AppContainer asset={props.asset} />;
+    return (
+      <AppContainer commentCount={props.asset.commentCounts.totalVisible} />
+    );
   }
 
   return <Spinner />;
@@ -45,7 +47,9 @@ const AppQuery: StatelessComponent<InnerProps> = ({
     query={graphql`
       query AppQuery($assetID: ID, $assetURL: String) {
         asset(id: $assetID, url: $assetURL) {
-          ...AppContainer_asset
+          commentCounts {
+            totalVisible
+          }
         }
       }
     `}

src/core/client/stream/test/comments/__snapshots__/editComment.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`cancel edit: edit canceled 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -436,7 +436,7 @@ exports[`edit a comment: edit form 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -920,7 +920,7 @@ exports[`edit a comment: optimistic response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -1404,7 +1404,7 @@ exports[`edit a comment: render stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -1813,7 +1813,7 @@ exports[`edit a comment: server response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -2231,7 +2231,7 @@ exports[`shows expiry message: edit form closed 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -2640,7 +2640,7 @@ exports[`shows expiry message: edit time expired 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li

src/core/client/stream/test/comments/__snapshots__/loadMore.spec.tsx.snap

@@ -433,7 +433,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/permalinkView.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders permalink view 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/permalinkViewAssetNotFound.spec.tsx.snap

@@ -1,7 +1,45 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders permalink view with unknown asset 1`] = `
-<div>
-  Asset not found
+<div
+  className="HorizontalGutter-root App-root HorizontalGutter-full"
+>
+  <ul
+    className="TabBar-root TabBar-primary"
+    role="tablist"
+  >
+    <li
+      className="Tab-root"
+      id="tab-COMMENTS"
+      role="presentation"
+    >
+      <button
+        aria-controls="tabPane-COMMENTS"
+        aria-selected={true}
+        className="BaseButton-root Tab-button Tab-primary Tab-active"
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onMouseDown={[Function]}
+        onMouseOut={[Function]}
+        onMouseOver={[Function]}
+        onTouchEnd={[Function]}
+        role="tab"
+        type="button"
+      >
+        ⁨6⁩ Comments
+      </button>
+    </li>
+  </ul>
+  <section
+    aria-labelledby="tab-COMMENTS"
+    className="App-tabContent"
+    id="tabPane-COMMENTS"
+    role="tabpanel"
+  >
+    <div>
+      Asset not found
+    </div>
+  </section>
 </div>
 `;

src/core/client/stream/test/comments/__snapshots__/permalinkViewCommentNotFound.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders permalink view with unknown comment 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/postComment.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`post a comment: optimistic response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨3⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -504,7 +504,7 @@ exports[`post a comment: server response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨3⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -971,7 +971,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li

src/core/client/stream/test/comments/__snapshots__/postLocalReply.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`post a reply: open reply form 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -889,7 +889,7 @@ exports[`post a reply: optimistic response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -1824,7 +1824,7 @@ exports[`post a reply: server response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -2622,7 +2622,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li

src/core/client/stream/test/comments/__snapshots__/postReply.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`post a reply: open reply form 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -547,7 +547,7 @@ exports[`post a reply: optimistic response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨3⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -1157,7 +1157,7 @@ exports[`post a reply: server response 1`] = `
         role="tab"
         type="button"
       >
-        ⁨3⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li
@@ -1630,7 +1630,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
     <li

src/core/client/stream/test/comments/__snapshots__/renderReplies.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/renderStream.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/showAllReplies.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨2⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/comments/__snapshots__/showConversation.spec.tsx.snap

@@ -27,7 +27,7 @@ exports[`renders comment stream 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>
@@ -701,7 +701,7 @@ exports[`shows conversation 1`] = `
         role="tab"
         type="button"
       >
-        ⁨1⁩ Comments
+        ⁨6⁩ Comments
       </button>
     </li>
   </ul>

src/core/client/stream/test/create.tsx

@@ -10,12 +10,12 @@ import { PostMessageService } from "talk-framework/lib/postMessage";
 import { RestClient } from "talk-framework/lib/rest";
 import { createPromisifiedStorage } from "talk-framework/lib/storage";
 import { createUUIDGenerator } from "talk-framework/testHelpers";
+import AppContainer from "talk-stream/containers/AppContainer";
 
 import createEnvironment from "./createEnvironment";
 import createFluentBundle from "./createFluentBundle";
 import createNodeMock from "./createNodeMock";
-
-import AppQuery from "../queries/AppQuery";
+import { comments } from "./fixtures";
 
 export interface CreateParams {
   logNetwork?: boolean;
@@ -54,7 +54,7 @@ export default function create(params: CreateParams) {
 
   const testRenderer = TestRenderer.create(
     <TalkContextProvider value={context}>
-      <AppQuery />
+      <AppContainer commentCount={comments.length} />
     </TalkContextProvider>,
     { createNodeMock }
   );

src/core/client/stream/test/fixtures.ts

@@ -93,9 +93,6 @@ export const assets = [
     id: "asset-1",
     url: "http://localhost/assets/asset-1",
     isClosed: false,
-    commentCounts: {
-      totalVisible: 2,
-    },
     comments: {
       edges: [
         { node: comments[0], cursor: comments[0].createdAt },
@@ -163,9 +160,6 @@ export const assetWithReplies = {
       hasNextPage: false,
     },
   },
-  commentCounts: {
-    totalVisible: 1,
-  },
 };
 
 export const assetWithDeepReplies = {
@@ -184,9 +178,6 @@ export const assetWithDeepReplies = {
       hasNextPage: false,
     },
   },
-  commentCounts: {
-    totalVisible: 1,
-  },
 };
 
 export const commentWithDeepestReplies = {
@@ -301,7 +292,4 @@ export const assetWithDeepestReplies = {
       hasNextPage: false,
     },
   },
-  commentCounts: {
-    totalVisible: 1,
-  },
 };