From 6a1430de20cc68a2e8dd5eeec5f8c0103d09c973 Mon Sep 17 00:00:00 2001
From: yeon <vantovan7414@gmail.com>
Date: Sat, 23 Nov 2019 17:25:11 +0900
Subject: [PATCH] =?UTF-8?q?[Simplyfy]=20Feed=20=EB=8D=B0=EC=9D=B4=ED=84=B0?=
 =?UTF-8?q?=20=EB=B6=88=EB=9F=AC=EC=98=A4=EB=8A=94=20=EB=B6=80=EB=B6=84?=
 =?UTF-8?q?=EC=97=90=20=ED=95=84=EC=9A=94=20=EC=97=86=EB=8A=94=20=EB=B6=80?=
 =?UTF-8?q?=EB=B6=84=EC=82=AD=EC=A0=9C=20#32?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

why
사용하지 않는 코드가 있음

how
cursor based 말고 offset 에 해당하는 부분 코드 삭제
---
 client/src/composition/feed/index.tsx | 25 ++++++++++++-------------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/client/src/composition/feed/index.tsx b/client/src/composition/feed/index.tsx
index 0f564994..9bb2b606 100644
--- a/client/src/composition/feed/index.tsx
+++ b/client/src/composition/feed/index.tsx
@@ -1,8 +1,9 @@
-import React, { useState, useMemo } from "react";
+import React, { useState, useMemo, useEffect } from "react";
 import Feed from "./Feed";
 import { useQuery } from "@apollo/react-hooks";
 import gql from "graphql-tag";
 import useScrollEnd from "../../hooks/useScrollEnd";
+
 interface IFeed {
   content: string;
   createdAt: string;
@@ -13,8 +14,8 @@ interface Feeds {
 }
 
 const GET_FEEDS = gql`
-  query getfeeds($first: Int, $after: Int, $currentCursor: String) {
-    feeds(first: $first, after: $after, cursor: $currentCursor) {
+  query getfeeds($first: Int, $currentCursor: String) {
+    feeds(first: $first, cursor: $currentCursor) {
       content
       createdAt
     }
@@ -23,39 +24,38 @@ const GET_FEEDS = gql`
 
 interface FeedVars {
   first: number;
-  after: number;
   currentCursor: string;
 }
 const OFFSET = 2;
 const FeedContainer = () => {
   const [feeds, setFeeds] = useState<IFeed[]>([]);
-  const [cursor, setCursor] = useState<string>("");
-  const [cursorIdx, setCursorIdx] = useState<number>(0);
+  const [cursor, setCursor] = useState<string>("9999-12-31T09:29:26.050Z");
 
   const checkEnd = useScrollEnd();
   // hooks 에서 useQuery 1 부터 시작
   const { loading, data, fetchMore } = useQuery<Feeds, FeedVars>(GET_FEEDS, {
-    variables: { first: cursorIdx, after: OFFSET, currentCursor: cursor }
+    variables: { first: OFFSET, currentCursor: cursor }
   });
 
-  useMemo(() => {
+  useEffect(() => {
     if (data) {
-      // setFeeds([...feeds, ...data.feeds]);
+      setFeeds(data.feeds);
     }
-  }, [data]);
+  }, []);
 
   const fetchMoreFeed = async () => {
     const { data: value } = await fetchMore({
       variables: {
         first: OFFSET,
-        after: cursorIdx,
         currentCursor: cursor
       },
       updateQuery: (prev, { fetchMoreResult }) => {
         if (!fetchMoreResult) {
           return prev;
         } else {
-          setCursorIdx(OFFSET + cursorIdx);
+          const { feeds: feedItems } = fetchMoreResult;
+          const lastFeedItem = feedItems[feedItems.length - 1];
+          setCursor(lastFeedItem.createdAt);
         }
 
         return Object.assign({}, prev, {
@@ -68,7 +68,6 @@ const FeedContainer = () => {
 
   const checkEndFeed = () => {
     fetchMoreFeed();
-
     return null;
   };