From 563c5700d4dbcdaa5f1342e3e7a24b347f671a36 Mon Sep 17 00:00:00 2001
From: Michael McNeil <5156449+michaelmcneilnet@users.noreply.github.com>
Date: Wed, 30 Aug 2023 11:58:38 -0700
Subject: [PATCH] Update connections-pagination.md (#4423)

Summary:
There are mistakes in Step 2 of the infinite scrolling tutorial.

- `newsfeedStories` is under `viewer`
- We are using `NewsfeedQuery` not `NewsfeedFragment`

In Step 5, the update is shown to a component `NewsfeedContents`, but that doesn't exist in the cloned repo. Is it something we are supposed to create when following along? I don't see this called out.

Step 6 then update the same `NewsfeedContents` to be different again, but in a way that seems as if the wrong component is being used in the example code? It's all a little confusing. This PR fixes a couple of mistakes, but I think the page needs a proper review by someone more familiar with the tutorial.

Pull Request resolved: https://github.com/facebook/relay/pull/4423

Reviewed By: voideanvalue

Differential Revision: D48790897

Pulled By: alunyov

fbshipit-source-id: d94ab1706b34452548cc48e8097b272d9b755141
---
 website/docs/tutorial/connections-pagination.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/website/docs/tutorial/connections-pagination.md b/website/docs/tutorial/connections-pagination.md
index dda43701a9de1..0576a639bf649 100644
--- a/website/docs/tutorial/connections-pagination.md
+++ b/website/docs/tutorial/connections-pagination.md
@@ -327,9 +327,9 @@ We need to modify the Newsfeed component to map over the edges and render each n
 
 ```
 function Newsfeed() {
-  const data = useLazyLoadQuery(NewsfeedFragment, {});
+  const data = useLazyLoadQuery(NewsfeedQuery, {});
   // change-line
-  const storyEdges = data.newsfeedStories.edges;
+  const storyEdges = data.viewer.newsfeedStories.edges;
   return (
     <>
       {storyEdges.map(storyEdge =>
@@ -376,7 +376,7 @@ Within `Newsfeed`, we can call both `useLazyLoadQuery` and `useFragment`, though
 ```
 export default function Newsfeed() {
   // change-line
-  const queryData = useLazyLoadQuery(NewsfeedFragment, {});
+  const queryData = useLazyLoadQuery(NewsfeedQuery, {});
   // change-line
   const data = useFragment(NewsfeedContentsFragment, queryData);
   const storyEdges = data.newsfeedStories.edges;