-
-
Notifications
You must be signed in to change notification settings - Fork 75
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #78 from mdazfar2/main
u
- Loading branch information
Showing
10 changed files
with
912 additions
and
37 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,86 @@ | ||
| import React, { useContext, useEffect, useState } from "react"; | ||
| import { Context } from "@context/store"; | ||
| import { useRouter } from "next/navigation"; | ||
|
|
||
| function GrowYourReachTab() { | ||
| const { finalUser, theme } = useContext(Context); | ||
| const [nonFollowers, setNonFollowers] = useState([]); | ||
| const router = useRouter(); | ||
|
|
||
| useEffect(() => { | ||
| const fetchAllUsers = async () => { | ||
| try { | ||
| const response = await fetch("/api/alluser", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| }); | ||
|
|
||
| if (response.ok) { | ||
| const data = await response.json(); | ||
| const allUsers = data.msg; | ||
|
|
||
| console.log("All users:", allUsers); | ||
|
|
||
| if (finalUser && finalUser.following) { | ||
| const followingIds = Object.keys(finalUser.following); | ||
| console.log("Following IDs:", followingIds); | ||
|
|
||
| const nonFollowersList = allUsers.filter( | ||
| user => !followingIds.includes(user._id) && user._id !== finalUser._id | ||
| ); | ||
|
|
||
| console.log("Non-followers list:", nonFollowersList); | ||
|
|
||
| setNonFollowers(nonFollowersList); | ||
| } | ||
| } else { | ||
| console.error("Error fetching all users:", response.statusText); | ||
| } | ||
| } catch (error) { | ||
| console.error("Error fetching all users:", error); | ||
| } | ||
| }; | ||
|
|
||
| fetchAllUsers(); | ||
| }, [finalUser]); | ||
|
|
||
| const handleFollowClick = (userId) => { | ||
| router.push(`/profile?id=${userId}`); | ||
| }; | ||
|
|
||
| return ( | ||
| <div className="h-screen p-10"> | ||
| <div className= {`${theme?"bg-gray-100 text-black":"bg-[#111111] text-white"} w-full rounded-xl min-h-96 text-2xl text-center p-5`}> | ||
| Grow Your Reach | ||
| <div className="mt-10 text-xl"> | ||
| {nonFollowers.length > 0 ? ( | ||
| <ul> | ||
| {nonFollowers.map(user => ( | ||
| <li key={user._id} className={`${theme?"bg-gray-200 text-black":"bg-[#383838] text-white"} py-3 px-2 rounded-xl mb-2 flex justify-between items-center`}> | ||
| <div className="flex items-center"> | ||
| <img src={user.image1} alt={user.name} className="w-10 h-10 rounded-full inline-block mr-3" /> | ||
| {user.name} | ||
| </div> | ||
| <a | ||
| href={`/profile?id=${user._id}`} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| className={`${theme?"bg-[#6089a4]":"bg-[#979797]"} text-lg max-md:text-sm text-white px-4 py-2 rounded-md`} | ||
| > | ||
| Open Profile | ||
| </a> | ||
| </li> | ||
| ))} | ||
| </ul> | ||
| ) : ( | ||
| <p>No new users to Show.</p> | ||
| )} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| export default GrowYourReachTab; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,206 @@ | ||
| "use client"; | ||
| import React, { useContext, useEffect, useState } from "react"; | ||
| import { Context } from "@context/store"; | ||
| import Link from 'next/link'; | ||
| function NotificationTab() { | ||
| const { finalUser,theme } = useContext(Context); | ||
| const [notifications, setNotifications] = useState({ | ||
| followers: [], | ||
| blogs: [], | ||
| }); | ||
|
|
||
| useEffect(() => { | ||
| if (!finalUser || !finalUser.email) return; | ||
|
|
||
| const updateNotifications = async () => { | ||
| try { | ||
| // Fetch user data | ||
| const response = await fetch("/api/getuserbyemail", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ email: finalUser.email }), | ||
| }); | ||
|
|
||
| if (response.ok) { | ||
| const userData = await response.json(); | ||
| const followers = userData.msg.followers; | ||
|
|
||
| // Fetch existing notifications | ||
| const checkResponse = await fetch( | ||
| `/api/notifications?userEmail=${finalUser.email}`, | ||
| { | ||
| method: "GET", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| } | ||
| ); | ||
|
|
||
| let existingNotifications = { followerList: {}, blogList: {} }; | ||
|
|
||
| if (checkResponse.ok) { | ||
| existingNotifications = await checkResponse.json(); | ||
| } else if (checkResponse.status === 404) { | ||
| console.log("No existing notifications found. Creating new ones."); | ||
| } else { | ||
| console.error( | ||
| "Error fetching existing notifications:", | ||
| checkResponse.statusText | ||
| ); | ||
| return; | ||
| } | ||
|
|
||
| const { followerList = {}, blogList = {} } = existingNotifications; | ||
|
|
||
| // Handle follower notifications | ||
| const updatedFollowers = await Promise.all( | ||
| Object.entries(followerList).map(async ([followerId, details]) => { | ||
| const userResponse = await fetch("/api/getuser", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ id: followerId }), | ||
| }); | ||
|
|
||
| if (userResponse.ok) { | ||
| const userData = await userResponse.json(); | ||
| const followerName = userData.msg.name; | ||
| return { | ||
| followerId, | ||
| followerName, | ||
| dateTime: details.dateTime, | ||
| }; | ||
| } | ||
| return { | ||
| followerId, | ||
| followerName: "Unknown", | ||
| dateTime: details.dateTime, | ||
| }; | ||
| }) | ||
| ); | ||
|
|
||
| // Handle blog notifications | ||
| const blogResponse = await fetch("/api/blog", { | ||
| method: "GET", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| }); | ||
|
|
||
| let latestBlogId = null; | ||
| let blogDataMap = {}; | ||
|
|
||
| if (blogResponse.ok) { | ||
| const blogs = await blogResponse.json(); | ||
| blogDataMap = blogs.data.reduce((map, blog) => { | ||
| map[blog._id] = blog; | ||
| return map; | ||
| }, {}); | ||
|
|
||
| if (blogs.data.length > 0) { | ||
| latestBlogId = blogs.data[blogs.data.length - 1]._id; | ||
| const isNewBlog = !Object.keys(blogList).includes(latestBlogId); | ||
|
|
||
| if (isNewBlog) { | ||
| const response2 = await fetch("/api/notifications", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ | ||
| userEmail: finalUser.email, | ||
| blogId: latestBlogId, | ||
| }), | ||
| }); | ||
|
|
||
| console.log("New blog notification sent:", response2.ok); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| setNotifications({ | ||
| followers: updatedFollowers, | ||
| blogs: Object.entries(blogList).map(([blogId, details]) => ({ | ||
| blogId, | ||
| blogName: blogDataMap[blogId]?.title || "Unknown Blog", | ||
| dateTime: details.dateTime, | ||
| })), | ||
| }); | ||
| // Handle new follower notifications | ||
| for (const followerId in followers) { | ||
| if (followers.hasOwnProperty(followerId)) { | ||
| const isDuplicate = | ||
| Object.keys(followerList).includes(followerId); | ||
|
|
||
| if (!isDuplicate) { | ||
| const response2 = await fetch("/api/notifications", { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json", | ||
| }, | ||
| body: JSON.stringify({ | ||
| userEmail: finalUser.email, | ||
| followerId, | ||
| }), | ||
| }); | ||
|
|
||
| console.log("New follower notification sent:", response2.ok); | ||
| } else { | ||
| console.log( | ||
| "Duplicate follower notification found, not sending again." | ||
| ); | ||
| } | ||
| } | ||
| } | ||
| } else { | ||
| console.error("Error fetching user data:", response.statusText); | ||
| } | ||
| } catch (error) { | ||
| console.error("Error updating notifications:", error); | ||
| } | ||
| }; | ||
|
|
||
| const interval = setInterval(updateNotifications, 1000); | ||
|
|
||
| return () => clearInterval(interval); | ||
| }, [finalUser]); | ||
|
|
||
| return ( | ||
| <div className="h-screen p-4"> | ||
| <div className={`${theme?"bg-gray-100 text-black":"bg-[#111111] text-white"} p-4 rounded-xl flex flex-col gap-4 `}> | ||
| <h2 className="text-xl text-center">Notifications</h2> | ||
| <hr className={`${theme?"border-gray-300 text-black":"bg-[#3c3c3c] text-white"} w-full border-2 my-4`} /> | ||
| <ul> | ||
| {notifications.followers.map( | ||
| ({ followerId, followerName, dateTime }) => ( | ||
| <Link href={`/profile?id=${followerId}`} key={followerId} target="_blank"> | ||
| <li key={followerId} className={`${theme?"bg-gray-200 text-black":"bg-[#3c3c3c] text-white"} py-3 px-2 rounded-xl `}> | ||
| {followerName} has started following you.{" "} | ||
| ({new Date(dateTime).toLocaleString()}) | ||
| </li> | ||
| </Link> | ||
| ) | ||
| )} | ||
| </ul> | ||
| <ul className="flex flex-col gap-4 "> | ||
| {notifications.blogs.map(({ blogId, blogName, dateTime }) => ( | ||
| <Link href={`/blogs/${blogId}`} key={blogId} target="_blank"> | ||
| <li key={blogId} className={`${theme?"bg-gray-200 text-black":"bg-[#3c3c3c] text-white"} py-3 px-2 rounded-xl`}> | ||
| <span className="flex gap-1"> | ||
| Read a blog on the topic{" "} | ||
| <span dangerouslySetInnerHTML={{ __html: blogName }}></span> | ||
| ({new Date(dateTime).toLocaleString()}) | ||
| </span> | ||
| </li> | ||
| </Link> | ||
| ))} | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| export default NotificationTab; |
Oops, something went wrong.