Add user feed

Author: AaruBama

src/App.js

@@ -16,7 +16,7 @@ import {
 } from 'react-router-dom';
 import HashtagTool from './components/HashtagTool';
 import ProfilePage from './components/LoginDropDownComponent/ProfilePage.js';
-import UserProfilePage from './components/LoginDropDownComponent/UserProfilePage.js';
+import UserProfilePage from './components/Profile/UserProfilePage.js';
 
 function SearchRouteWrapper() {
     let { searchQuery } = useParams();

src/components/Feed/index.js

@@ -1,6 +1,7 @@
 import Posts from '../Posts';
 import './index.css';
 import React, { useEffect, useRef } from 'react';
+import { PageContext } from '../../context/PageContext';
 
 function useIntersectionObserver(loadMore, options = {}) {
     const targetRef = useRef(null);
@@ -54,14 +55,19 @@ function Feed(props) {
     const triggerPoint = Math.max(0, props.notes.length - 10);
 
     return (
-        <div className="feed-container pt-8 mx-auto max-w-xl">
-            {props.notes.map((note, index) => (
-                <div key={note.id}>
-                    <Posts note={note} />
-                    {index === triggerPoint && <div ref={loadMoreRef} />}
-                </div>
-            ))}
-        </div>
+        <PageContext.Provider value={props.isHomePage}>
+            <div className="feed-container pt-8 mx-auto max-w-xl">
+                {props.notes.length > 0 &&
+                    props.notes.map((note, index) => (
+                        <div key={note.id}>
+                            <Posts note={note} />
+                            {index === triggerPoint && (
+                                <div ref={loadMoreRef} />
+                            )}
+                        </div>
+                    ))}
+            </div>
+        </PageContext.Provider>
     );
 }
 

src/components/HashtagTool/index.js

@@ -118,6 +118,7 @@ export function HashtagTool() {
                 <main className="flex-1 overflow-y-auto bg-gray-50">
                     {isLoading && <Spinner />}
                     <Feed
+                        isHomePage={true}
                         notes={notes}
                         onLoadMore={handleLoadMore}
                         isLoading={isLoading || loadingMorePosts}

src/components/Login/index.js

@@ -51,7 +51,7 @@ function HeaderBar({ isSearchVisible }) {
         <div className={headerClasses}>
             <header
                 className={
-                    'flex flex-row items-center h-14 px-3 lg:pr-96 md:pl-64'
+                    'flex flex-row items-center h-14 mb-8 px-3 lg:pr-96 md:pl-64'
                 }>
                 <div className="flex basis-1/3 justify-start ">
                     <Menu />