Skip to content

Commit ddcf17d

Browse files
Exar04Exar04
committed
chat functionality is finished
1 parent 00315e9 commit ddcf17d

File tree

4 files changed

+58
-46
lines changed

4 files changed

+58
-46
lines changed

‎.firebase/hosting.YnVpbGQ.cache‎

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
1-
asset-manifest.json,1711630595467,5a9dca9a8bf922216f239993a90f6cd91b08e7cdbe476be78fb848fe27a5e76c
2-
favicon.ico,1711630586141,ef54c0ec2536d347898e9564657904e150517391325e290559e9c8789e700828
3-
favicon1.ico,1711630586141,a0c1d06b2928d5d185aa8171f0ef1119c447d79681e0e6a1e168cd43a1ed3267
4-
favicon2.ico,1711630586142,81740a7499011ab13ccfcfeb6e4ee6d5a5a45a8a75651e8b861d9521e46b4e79
5-
faviconreact.ico,1711630586142,b72f7455f00e4e58792d2bca892abb068e2213838c0316d6b7a0d6d16acd1955
6-
index.html,1711630595467,ec6cd912e74f307eb219664a06799460781024213292f1ad95ff63a7c5b9f6dc
7-
logo192.png,1711630586142,caff018b7f1e8fd481eb1c50d75b0ef236bcd5078b1d15c8bb348453fee30293
8-
logo512.png,1711630586143,191fc21360b4ccfb1cda11a1efb97f489ed22672ca83f4064316802bbfdd750e
9-
manifest.json,1711630586143,341d52628782f8ac9290bbfc43298afccb47b7cbfcee146ae30cf0f46bc30900
10-
robots.txt,1711630586144,391d14b3c2f8c9143a27a28c7399585142228d4d1bdbe2c87ac946de411fa9a2
11-
static/css/main.092d0832.css,1711630595487,501e90d6700b2f68d504c730bc906572806ab1cd395de5ed9d88f42f77fc5946
12-
static/css/main.092d0832.css.map,1711630595487,d7c5300df59c030025c8ba615340086127e88337b3722d4749ce1e53877d5968
13-
static/js/main.e2886362.js,1711630595487,e10be295f2f09c095011cc56d2a0f14968780bf44508eff2a54875de88e2bd3f
14-
static/js/main.e2886362.js.LICENSE.txt,1711630595487,d2cd4013a100dad6a6a12d9f3034c397a1c168b9d68f7834d953b1f134663855
15-
static/js/main.e2886362.js.map,1711630595488,ea44197ee149a947a84ca37a92239562078c950979efd014226b88853e92c0c1
1+
asset-manifest.json,1713526316495,c6d3b2498156dff8dcb0215a6e6124df33ab7cbe2a3433eb290932a6d7931c6c
2+
favicon2.ico,1713526307366,81740a7499011ab13ccfcfeb6e4ee6d5a5a45a8a75651e8b861d9521e46b4e79
3+
favicon.ico,1713526307366,ef54c0ec2536d347898e9564657904e150517391325e290559e9c8789e700828
4+
favicon1.ico,1713526307366,a0c1d06b2928d5d185aa8171f0ef1119c447d79681e0e6a1e168cd43a1ed3267
5+
faviconreact.ico,1713526307367,b72f7455f00e4e58792d2bca892abb068e2213838c0316d6b7a0d6d16acd1955
6+
index.html,1713526316495,b40676da7714eb991d1f5def426a62d11dc49f758f4f5c9d1df2d059e0c534c9
7+
logo192.png,1713526307367,caff018b7f1e8fd481eb1c50d75b0ef236bcd5078b1d15c8bb348453fee30293
8+
logo512.png,1713526307368,191fc21360b4ccfb1cda11a1efb97f489ed22672ca83f4064316802bbfdd750e
9+
robots.txt,1713526307368,391d14b3c2f8c9143a27a28c7399585142228d4d1bdbe2c87ac946de411fa9a2
10+
manifest.json,1713526307368,341d52628782f8ac9290bbfc43298afccb47b7cbfcee146ae30cf0f46bc30900
11+
static/js/main.8f5bad2e.js.LICENSE.txt,1713526316514,d2cd4013a100dad6a6a12d9f3034c397a1c168b9d68f7834d953b1f134663855
12+
static/css/main.88d0ed60.css,1713526316514,19351a6fabd6e847775f7d673c17a3a183004f3860b0279c1ae9833097aac730
13+
CsphereLogo.png,1713526307365,9eda5ab93fae6d4e2c6b6959997033ac365ece68913fd7e289a30221e0ad1be8
14+
static/css/main.88d0ed60.css.map,1713526316514,579d121060d394806cbe3f2e17a995da64c57cce7be25d7bcc6f242ac8175ae9
15+
static/js/main.8f5bad2e.js,1713526316515,b35ce763751bfaade3f82856470bb1b6fa479986203f6d9d18e31341309c2bce
16+
static/js/main.8f5bad2e.js.map,1713526316515,d61148cca0e2896c29398e9f88b8362bce286c3e94c813b8f71ffc967c63db4f

‎firebase.json‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,6 @@
66
"destination":"/",
77
"type": 301
88
},
9-
{
10-
"source": "/*",
11-
"destination":"/",
12-
"type": 301
13-
},
149
{
1510
"source": "/home/profile/*",
1611
"destination":"/",

‎src/context/chatContext.js‎

Lines changed: 37 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { query, where, onSnapshot, collection, doc, updateDoc, arrayUnion, getDoc, serverTimestamp } from "firebase/firestore";
22
import { createContext, useContext, useState, useEffect } from "react";
33
import { db } from "../config/firebase";
4-
import { useLoggedInUserInfo } from "../hooks/userHandler";
4+
import { useLoggedInUserInfo, useUserHandler } from "../hooks/userHandler";
55
import { useAuth } from "./authContext";
66

77
const ChatContext = createContext()
@@ -14,6 +14,7 @@ export function ChatProvider({ children }) {
1414

1515
const { currentUser } = useAuth()
1616
const { permanentUsernameOfLoggedInUser, userIdOfLoggedInUser } = useLoggedInUserInfo()
17+
const { getUser_Pfp_from_Username_Displayname } = useUserHandler()
1718
const chatCollectionRef = collection(db, "chats");
1819
const usersCollectionRef = collection(db, "users");
1920
const conversationsCollectionRef = collection(db, "conversations");
@@ -68,54 +69,68 @@ export function ChatProvider({ children }) {
6869
var listOfDocs = [];
6970
var unsubscribe;
7071
try {
71-
const queryUser = query( usersCollectionRef, where("userId", "==", currentUser.uid))
72+
const queryUser = query(
73+
usersCollectionRef,
74+
where("userId", "==", currentUser.uid)
75+
);
7276

73-
unsubscribe = onSnapshot(queryUser,(snapshot) => {
74-
snapshot.forEach((doc) => {
75-
const data = doc.data();
76-
const userChats = data.conversationList
77+
unsubscribe = onSnapshot(queryUser, (snapshot) => {
78+
snapshot.forEach((doc) => {
79+
const userChats = doc.data().conversationList;
80+
// const userChats = data.conversationList
7781
const id = doc.id;
78-
listOfDocs.push( ...userChats );
79-
console.log(userChats)
80-
})
81-
setConversationList(listOfDocs)
82-
listOfDocs = [];
83-
})
82+
userChats.profilePic = ""
83+
listOfDocs.push(...userChats)
84+
});
85+
Promise.all(listOfDocs.map((data, index) => {
86+
return new Promise((resolve, reject) => {
87+
getUser_Pfp_from_Username_Displayname(data.chatName, (pfpUrl) => {
88+
console.log(pfpUrl);
89+
listOfDocs[index].profilePic = pfpUrl;
90+
resolve();
91+
});
92+
});
93+
})).then(() => {
94+
// After all profilePic assignments are done, setConversationList
95+
setConversationList(listOfDocs);
96+
listOfDocs = [];
97+
}).catch((error) => {
98+
console.error(error);
99+
});
100+
});
84101
} catch (err) {
85102
console.error(err);
86103
}
87104

105+
88106
return () => {
89107
unsubscribe();
90108
};
91109
}
92110

93111
useEffect(() => {
94112
getConversationList()
113+
}, [])
95114

96-
// this is used to make chat realtime
97-
const queryMessages = query(conversationsCollectionRef);
115+
useEffect(() => {
116+
const queryMessages = query(conversationsCollectionRef, where("usersInvolved", "array-contains", permanentUsernameOfLoggedInUser));
98117
var listOfMess = []
99118
onSnapshot(queryMessages, (snapshot) => {
100119
snapshot.forEach((doc) => {
101120
const messages = doc.data().messages;
102121
const convoid = doc.id;
103122
listOfMess.push({convoid, messages});
104123
});
105-
console.log(listOfMess, "mess")
124+
106125
listOfMess.map((doc) => {
107126
setAllChats((prevState) => ({
108127
...prevState,
109128
[doc.convoid]: { messages: doc.messages },
110-
}));
111-
// console.log(doc.convoid)
112-
});
113-
console.log(allChats, "oriko")
129+
}))
130+
})
114131
listOfMess = []
115132
});
116-
}, [])
117-
118-
useEffect(() => { console.log(allChats)},[allChats])
133+
}, [permanentUsernameOfLoggedInUser])
119134

120135

121136
const value = {

‎src/pages/messages.jsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { useState } from "react"
33
import { useAuth } from "../context/authContext"
44
import { useChat } from "../context/chatContext"
55
import { useChatHandler } from "../hooks/messageHandler"
6-
import { useLoggedInUserInfo } from "../hooks/userHandler"
6+
import { useLoggedInUserInfo, useUserHandler } from "../hooks/userHandler"
77

88
export function Messages() {
99
const { allChats, setAllChats, conversationList, getChatsOfChatId} = useChat()
@@ -19,8 +19,8 @@ export function Messages() {
1919
}, [IdOfOpenedChat])
2020

2121
const listOfUsersDiv = conversationList.map((user, index) =>
22-
<div key={index} role={"button"} onClick={() => {setIdOfOpenedChat(user.chatId); setNameOfOpenedChat(user.chatName)}} className="bg-black flex-none flex items-center text-xl border-0.5 border-slate-600 hover:bg-slate-500 hover:ring-2 ring-white inset-1 rounded-xl text-white p-3 m-2 transition duration-300 ">
23-
<div className="bg-gray-700 w-14 h-14 rounded-full"></div>
22+
<div key={index} role={"button"} onClick={() => {setIdOfOpenedChat(user.chatId); setNameOfOpenedChat(user.chatName)}} className=" flex-none flex items-center text-xl border-0.5 border-slate-600 bg-black hover:bg-sky-600 hover:ring-2 ring-sky-300 inset-1 rounded-xl text-white p-3 m-2 transition duration-500 ease-in-out ">
23+
{ user.profilePic? <img src={user.profilePic} className=" w-14 h-14 rounded-full"/>:<div className="bg-gray-700 w-14 h-14 rounded-full"></div>}
2424
<div className=" pl-3 ">
2525
<div className=" font-bold">{user.chatName}</div>
2626
{/* {/* <div className=" text-gray-400">{user.recentMessage}</div> */}
@@ -53,6 +53,7 @@ function Chat(props) {
5353
const { permanentUsernameOfLoggedInUser, userIdOfLoggedInUser } = useLoggedInUserInfo()
5454
const [isKeyboardOpen, setIsKeyboardOpen] = useState(false);
5555
const [isTextareaFocused, setIsTextareaFocused] = useState(false);
56+
5657

5758
const [inputData, setInputData] = useState([])
5859
const inputRef = useRef()
@@ -98,7 +99,7 @@ function Chat(props) {
9899

99100
<div className={`flex flex-col ${isKeyboardOpen? "h-3/5":"h-full"} w-full fixed lg:relative `}>
100101
<div className=" bg-black border-b-0.5 text-white p-4 text-lg flex items-center">
101-
<img role={"button"} onClick={() => props.setIdOfOpenedChat(null)} className=" md:w-10 md:h-10 w-6 h-6 ml-2 hover:bg-zinc-800 rounded-full p-2" src="https://img.icons8.com/ios-filled/100/FFFFFF/back.png" alt="back" />
102+
<img role={"button"} onClick={() => props.setIdOfOpenedChat(null)} className=" w-8 h-8 ml-2 hover:bg-zinc-800 rounded-full p-1 md:p-2" src="https://img.icons8.com/ios-filled/100/FFFFFF/back.png" alt="back" />
102103
<div className=" ml-3">{props.NameOfOpenedChat}</div>
103104

104105
</div>

0 commit comments

Comments
 (0)