feat: add useFeed hook

3 files changed, 15 insertions, 19 deletions

diff --git a/src/hooks/APIClient.ts b/src/hooks/APIClient.ts
index fa23a21..ce11134 100644
--- a/src/hooks/APIClient.ts
+++ b/src/hooks/APIClient.ts
@@ -4,6 +4,10 @@ import { get } from '../requests';
 
 const fetcher = (endpoint: string) => get(endpoint).then(response => response.data);
 
+const arrayOptions = {
+  initialData: [],
+  revalidateOnMount: true
+};
 
 export const useUser = (username: string) => {
   return useSWR(
@@ -13,5 +17,9 @@ export const useUser = (username: string) => {
 };
 
 export const useProfile = (id: string) => {
-  return useSWR(id && `/profiles/${id}`, fetcher, { initialData: [] });
+  return useSWR(id && `/profiles/${id}`, fetcher, arrayOptions);
+};
+
+export const useFeed = () => {
+  return useSWR(`/feed`, fetcher, arrayOptions);
 };
diff --git a/src/pages/FeedPage/FeedPage.tsx b/src/pages/FeedPage/FeedPage.tsx
index 0b7d44a..8e7fb55 100644
--- a/src/pages/FeedPage/FeedPage.tsx
+++ b/src/pages/FeedPage/FeedPage.tsx
@@ -1,32 +1,24 @@
-import React, { useState, useEffect } from 'react';
+import React from 'react';
 import { Poll } from 'which-types';
 import { Container } from '@material-ui/core/';
 
 import Feed from '../../components/Feed/Feed';
-import { get } from '../../requests';
 import PollSubmission from './PollSubmission';
 import { useAuth } from '../../hooks/useAuth';
+import { useFeed } from '../../hooks/APIClient';
 
 const FeedPage: React.FC = () => {
-  const [polls, setPolls] = useState<Poll[]>([]);
+  const { data, mutate } = useFeed();
   const { isAuthenticated } = useAuth();
 
-  useEffect(() => {
-    get('/feed').then(response => {
-      setPolls(response.data);
-    });
-  }, []);
-
   const addPoll = (poll: Poll): void => {
-    polls.unshift(poll);
-    setPolls([]);
-    setPolls(polls);
+    mutate([poll, ...data], true);
   };
 
   return (
     <Container maxWidth="sm" disableGutters>
       {isAuthenticated() && <PollSubmission addPoll={addPoll} />}
-      <Feed polls={polls} />
+      <Feed polls={data} />
     </Container>
   );
 };
diff --git a/src/pages/ProfilePage/ProfilePage.tsx b/src/pages/ProfilePage/ProfilePage.tsx
index 4769999..293b766 100644
--- a/src/pages/ProfilePage/ProfilePage.tsx
+++ b/src/pages/ProfilePage/ProfilePage.tsx
@@ -15,11 +15,7 @@ const ProfilePage: React.FC = () => {
   const { user } = useAuth();
 
   const { data: userInfo, mutate: setUserInfo } = useUser(username);
-  const { data: polls, mutate: fetchPolls } = useProfile(userInfo?._id);
-
-  useEffect(() => {
-    fetchPolls();
-  }, [userInfo, fetchPolls])
+  const { data: polls } = useProfile(userInfo?._id);
 
   useEffect(() => {
     if (!username) {