displays groups in contacts list

This commit is contained in:
slawk0
2024-11-27 22:25:11 +01:00
parent 2c51fbd90b
commit eea0d8144c
6 changed files with 102 additions and 40 deletions

View File

@@ -20,7 +20,7 @@ function ContactForm({ InitializeContact, setContactsList }: ContactFormProps) {
try {
// Checks if contact username already exist on the list
setContactsList((prevContacts) => {
if (prevContacts.some((c) => c.contact_username === contact)) {
if (prevContacts.some((c) => c.username === contact)) {
return prevContacts;
}
return prevContacts;
@@ -37,14 +37,14 @@ function ContactForm({ InitializeContact, setContactsList }: ContactFormProps) {
InitializeContact(contact);
setContactsList((prevContacts) => {
if (!prevContacts.some((c) => c.contact_username === contact)) {
if (!prevContacts.some((c) => c.username === contact)) {
return [
...prevContacts,
{
contact_username: contact,
username: contact,
read: true,
contact_user_id,
contact_id,
user_id: contact_user_id,
id: contact_id,
},
];
}

View File

@@ -25,11 +25,7 @@ function ContactsList({
function contactHandler(contactsList: ContactsProps) {
setContactsList((prevContacts) => {
// Check if the contact already exists in the state
if (
!prevContacts.some(
(c) => c.contact_username === contactsList.contact_username,
)
) {
if (!prevContacts.some((c) => c.username === contactsList.username)) {
return [...prevContacts, contactsList];
}
return prevContacts;
@@ -61,7 +57,7 @@ function ContactsList({
setMessages([]);
// Remove contact on client
setContactsList((prevContacts) =>
prevContacts.filter((contact) => contact.contact_id !== contact_id),
prevContacts.filter((contact) => contact.id !== contact_id),
);
}
const sortedContacts = [...contactsList].sort((a, b) => {
@@ -75,13 +71,14 @@ function ContactsList({
<li
className="flex hover:bg-green-700 p-2 rounded cursor-pointer justify-between items-center min-h-[40px]"
onClick={() => {
InitializeContact(contact.contact_username);
InitializeContact(contact.username);
updateContactStatus(contact, true);
}}
key={contact.contact_id}
key={contact.id}
>
<span className="flex-shrink-0">
{contact.contact_user_id} {contact.contact_username}
{/*contact id: {contact.id} contact_user_id: {contact.user_id}*/}
{contact.username}
</span>
<div className="w-4 h-4 mx-2 flex items-center justify-center mr-auto">
@@ -93,7 +90,7 @@ function ContactsList({
<button
onClick={(e) => {
e.stopPropagation();
removeContact(contact.contact_id);
removeContact(contact.id);
setCurrentContact(null);
localStorage.removeItem('contact');
}}

View File

@@ -62,15 +62,15 @@ function MessagesArea({
console.log('Received message: ', msg);
if (msg.sender !== currentContact && msg.sender !== username) {
setContactsList((prevContacts) => {
if (!prevContacts.some((c) => c.contact_username === msg.sender)) {
if (!prevContacts.some((c) => c.username === msg.sender)) {
sendContact(msg.sender);
return [
...prevContacts,
{
contact_username: msg.sender,
username: msg.sender,
read: false,
contact_id: msg.message_id,
contact_user_id: msg.sender_id,
id: msg.message_id,
user_id: msg.sender_id,
},
];
}
@@ -78,10 +78,10 @@ function MessagesArea({
});
updateContactStatus(
{
contact_username: msg.sender,
username: msg.sender,
read: false,
contact_id: msg.message_id,
contact_user_id: msg.sender_id,
id: msg.message_id,
user_id: msg.sender_id,
},
false,
);

View File

@@ -22,9 +22,9 @@ export type ChatMessages = {
export type ContactsProps = {
read: boolean;
contact_username: string;
contact_user_id: number;
contact_id: number;
username: string;
user_id: number;
id: number;
};
function Chat() {
@@ -56,7 +56,7 @@ function Chat() {
);
setContactsList((prevContacts) =>
prevContacts.map((c) =>
c.contact_username === newContact ? { ...c, read: true } : c,
c.username === newContact ? { ...c, read: true } : c,
),
);
@@ -114,9 +114,9 @@ function Chat() {
function updateContactStatus(contactObj: ContactsProps, read: boolean) {
setContactsList((prevContacts) =>
prevContacts.map((contact) => {
if (contact.contact_username === contactObj.contact_username) {
if (contact.username === contactObj.username) {
if (!contactObj.read) {
setContactStatus(contactObj.contact_username, read);
setContactStatus(contactObj.username, read);
}
return { ...contact, read: read };
} else {

View File

@@ -237,7 +237,7 @@ async function insertMessage(
}
}
async function createGroup(groupname) {
async function createGroup(user_id, groupname) {
const query = `
INSERT INTO Conversations (conversation_type, name)
VALUES ('group', $1)
@@ -245,13 +245,31 @@ async function createGroup(groupname) {
`;
try {
const result = await client.query(query, [groupname]);
const group_id = result.rows[0].group_id;
return result.rows[0].group_id;
await addMemberToGroup(group_id, user_id);
return group_id;
} catch (e) {
console.error("Failed to create conversation ", e);
}
}
async function addMemberToGroup(conversation_id, user_id) {
const query = `
INSERT INTO Memberships (conversation_id, user_id)
VALUES ($1, $2)
ON CONFLICT DO NOTHING;
`;
try {
await client.query(query, [conversation_id, user_id]);
console.log(
`Added user_id ${user_id} to conversation_id ${conversation_id}`,
);
} catch (e) {
console.error("Failed to add member to group ", e);
}
}
async function getMessages(user_id, receiverUsername, limit = 50, cursor = 0) {
let query = `
WITH recipient AS (
@@ -452,24 +470,70 @@ async function insertContact(userUsername, receiverUsername, read) {
}
}
async function getContacts(userUsername) {
const query = `
// async function getContacts(userUsername) {
// const query = `
// SELECT
// c.contact_id,
// c.contact_user_id,
// a.username AS contact_username,
// c.last_active
// FROM Contacts c
// JOIN Accounts a ON a.user_id = c.contact_user_id
// WHERE c.user_id = $1
// ORDER BY c.last_active DESC;
// `;
//
// try {
// const result = await client.query(query, [userUsername]);
// return result.rows;
// } catch (e) {
// console.error("Failed to get contacts:", e);
// return [];
// }
// }
async function getContacts(user_id) {
const contactsQuery = `
SELECT
c.contact_id,
c.contact_user_id,
a.username AS contact_username,
c.last_active
c.contact_id AS id,
c.contact_user_id AS user_id,
a.username AS username,
c.last_active,
'direct' AS conversation_type
FROM Contacts c
JOIN Accounts a ON a.user_id = c.contact_user_id
WHERE c.user_id = $1
ORDER BY c.last_active DESC;
`;
const groupsQuery = `
SELECT
m.conversation_id AS user_id,
c.name AS username,
c.created_at AS last_active,
c.conversation_type
FROM Memberships m
JOIN Conversations c ON m.conversation_id = c.conversation_id
WHERE m.user_id = $1 AND c.conversation_type = 'group'
ORDER BY c.created_at DESC;
`;
try {
const result = await client.query(query, [userUsername]);
return result.rows;
const contactsResult = await client.query(contactsQuery, [user_id]);
const groupsResult = await client.query(groupsQuery, [user_id]);
const contacts = contactsResult.rows;
const groups = groupsResult.rows.map((group) => ({
...group,
user_id: group.user_id,
}));
// Combine contacts and groups
const combinedContacts = [...contacts, ...groups];
return combinedContacts;
} catch (e) {
console.error("Failed to get contacts:", e);
console.error("Failed to get contacts and groups:", e);
return [];
}
}

View File

@@ -307,11 +307,12 @@ app.post(
"/api/chat/creategroup/:groupname",
authorizeUser,
async (req, res) => {
const user_id = req.user.user_id;
const groupname = req.params.groupname;
if (!groupname) {
res.status(400).json({ message: "Missing groupname parameter" });
}
const group_id = await createGroup(groupname);
const group_id = await createGroup(user_id, groupname);
if (!group_id) {
return res.status(500).json({ message: "Failed to create group" });
}