From 601ac885520efdda934a3a84a1b207d596accb23 Mon Sep 17 00:00:00 2001
From: Anna Cai <annacai44@gmail.com>
Date: Tue, 21 Jan 2025 16:41:57 -0600
Subject: [PATCH] show all names on friends tab

---
 src/components/Feed/Feed.jsx                   | 9 ++++-----
 src/components/Post/Post.jsx                   | 6 +++---
 src/components/RatingHistory/RatingHistory.jsx | 2 +-
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/components/Feed/Feed.jsx b/src/components/Feed/Feed.jsx
index 5aa7e8d..d350430 100644
--- a/src/components/Feed/Feed.jsx
+++ b/src/components/Feed/Feed.jsx
@@ -28,6 +28,7 @@ function Feed({friends}) {
   const [posts, setPosts] = useState([]);
   const [search, setSearch] = useState();
   const [filteredPosts, setFilteredPosts] = useState([]);
+  const [tabValue, setTabValue] = React.useState(0);
 
   // useEffect runs every time the component is rendered
   useEffect(() => {
@@ -54,11 +55,9 @@ function Feed({friends}) {
       setFilteredPosts(posts) // retrieve all if the search bar isn't being used
     }
   }, [search, posts]); // must define the states that cause re-rendering
-
-    const [value, setValue] = React.useState(0);
   
   const handleChange = (event, newValue) => {
-    setValue(newValue);
+    setTabValue(newValue);
 
     if (newValue === 0) {
       // public
@@ -72,7 +71,7 @@ function Feed({friends}) {
   return (
     <div>
       <AppBar />
-        <Tabs className="friends-public-switch" value={value} onChange={handleChange} centered>
+        <Tabs className="friends-public-switch" value={tabValue} onChange={handleChange} centered>
           <Tab label="Public" icon={<PublicIcon />} />
           <Tab label="Friends" icon={<PeopleIcon />} />
         </Tabs>
@@ -86,7 +85,7 @@ function Feed({friends}) {
                       .slice()
                       .sort((a, b) => b.date.seconds - a.date.seconds).map((post) => 
                       <div key={post.id}>
-                        <Post post={post} friends={fake_friends} />
+                        <Post post={post} friends={fake_friends} postAnonymously={tabValue == 1 ? false : post.anonymous ? true : false}/>
                       </div>)
                     )
                 }
diff --git a/src/components/Post/Post.jsx b/src/components/Post/Post.jsx
index 333233c..73ade27 100644
--- a/src/components/Post/Post.jsx
+++ b/src/components/Post/Post.jsx
@@ -37,7 +37,7 @@ function getQuarterChipClass(quarter) {
   return "";
 }
 
-function Post({ post, friends }) {
+function Post({ post, friends, postAnonymously }) {
   const navigate = useNavigate();
   const renderUserStars = (rating) => {
     const filledStars = Math.floor(rating);
@@ -64,7 +64,7 @@ function Post({ post, friends }) {
 
           <div className="user-rating-section">
             <Typography variant="body2" className="user-rating-label">
-              <strong>{post.anonymous ? "Anonymous" : post.username}</strong> rated this course
+              <strong>{postAnonymously ? "Anonymous" : post.username}</strong> rated this course
             </Typography>
             <div className="user-star-icons">
               {renderUserStars(post.rating ?? 0)}
@@ -75,7 +75,7 @@ function Post({ post, friends }) {
             {post.title}
           </Typography>
           <Typography variant="body2" className="post-subheader">
-            Posted by <strong>{post.anonymous ? "Anonymous" : post.username}</strong> on {post.date.toDate().toDateString()}
+            Posted by <strong>{postAnonymously ? "Anonymous" : post.username}</strong> on {post.date.toDate().toDateString()}
           </Typography>
           <Typography variant="body1" className="post-body">
             {post.body}
diff --git a/src/components/RatingHistory/RatingHistory.jsx b/src/components/RatingHistory/RatingHistory.jsx
index c86e130..6b5c4a2 100644
--- a/src/components/RatingHistory/RatingHistory.jsx
+++ b/src/components/RatingHistory/RatingHistory.jsx
@@ -34,7 +34,7 @@ function RatingHistory({ userName, profilePic, filteredPost }) {
                                 .slice()
                                 .sort((a, b) => b.date.seconds - a.date.seconds).map((post) => 
                                 <div key={post.id}>
-                                <Post post={post} friends={fake_friends} />
+                                <Post post={post} friends={fake_friends} postAnonymously={false}/>
                                 </div>)
                             )
                         }