Feed now fetches user data

daily-thought-frontend/src/pages/feed.tsx

@@ -2,18 +2,38 @@ import NavBar from "@/components/navigation/NavBar";
 import AnswerCard from "@/components/post/AnswerCard";
 import Post from "@/components/post/Post";
 import Question from "@/components/question/Question";
+import { User } from "@/types/user";
 import { useEffect, useState } from "react";
 
-const user = {
-  Name: 'Tom Cook',
+const userx = {
+  id: "asdf",
+  name: 'Tom Cook',
   email: 'tom@example.com',
-  Username: 'TomCook',
-  Avatar:
+  username: 'TomCook',
+  profile:
     'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80',
 }
 
 const Feed = () => {
+  const [user, setUser] = useState<null | User>(null)
 
+  const fetchUser = async () => {
+    const endpoint = `${process.env.NEXT_PUBLIC_USER_SERVICE_URL}api/user/${sessionStorage.getItem('username')}`
+    const response = await fetch(endpoint)
+    return await response.json()
+    
+  }
+
+  useEffect(() => {
+    if(!user){
+      fetchUser().then(res => {
+        const {_id, username, email, profile } = res
+        setUser({id: _id, email, username, profile, name: null})
+      })
+    }
+  })
+
+  
 
     
     return(
@@ -32,16 +52,13 @@ const Feed = () => {
         <div className="flex-1 max-w-4xl flex items-center flex-col justify-center mx-auto">
           <div className="rounded-full my-4 w-xl">
             <div className="flex w-full justify-center flex-col items-center mx-auto p-3 sm:px-6 lg:px-8 max-w-4xl">
-              <Post post={{User: user, Content: "This is my post"}}/>
-              <Post post={{User: user, Content: "This is my post"}}/>
-              <Post post={{User: user, Content: "This is my post"}}/>
-              <Post post={{User: user, Content: "This is my post"}}/>
+              <Post post={{User: userx, Content: "This is my post"}}/>
+              <Post post={{User: userx, Content: "This is my post"}}/>
+              <Post post={{User: userx, Content: "This is my post"}}/>
+              <Post post={{User: userx, Content: "This is my post"}}/>
             </div>
           </div>
         </div>
-          
-      
-
       </>
     )
 }