narayan954 / dummygram

DummyGram is a social media application where we have posts, stories, chat, friends, authentication, comment, delete, share and like feature. It uses ReactJs in the frontend for the UI and Firebase for the backend storing the users, posts, stories and comments.
https://narayan954.github.io/dummygram/
MIT License
76 stars 185 forks source link

Give a new look to sidebar #1193

Closed Palakkgoyal closed 1 year ago

Palakkgoyal commented 1 year ago

This PR closes #1141 Updated the UI of sidebar and made it responsive.

Palakkgoyal commented 1 year ago

Hi @Palakkgoyal , is this the expected behaviour of the sidebar?? image it seems a bit off, like the circle around profile card,3 dots on top misaligned... Can you please take a look into that?

Its definitely not the desired behavior. I will remove that active state. And 3 dots misaligned? You mean that I should maintain a fix gap between those 3 dots and the other items?

narayan954 commented 1 year ago

Hi @Palakkgoyal , is this the expected behaviour of the sidebar?? image it seems a bit off, like the circle around profile card,3 dots on top misaligned... Can you please take a look into that?

Its definitely not the desired behavior. I will remove that active state. And 3 dots misaligned? You mean that I should maintain a fix gap between those 3 dots and the other items?

alright, by misaligned I meant, there's a bigger left margin in other sidebar icons that those 3 dots, so they're not vertically aligned. Also, can we move that profile card to the top similar to this image, perhaps if it looks nice image

Palakkgoyal commented 1 year ago

Hey, I did some changes. Can you please check. Screenshot 2023-08-08 193403

narayan954 commented 1 year ago

Hey, I did some changes. Can you please check. Screenshot 2023-08-08 193403

sure, I am thinking to merge the refactoring pr first so there're very less merge conflicts

narayan954 commented 1 year ago

Hi @Palakkgoyal , can you please fix these conflicts?

Palakkgoyal commented 1 year ago

Yes, sure.

Palakkgoyal commented 1 year ago

I have solved the conflict. Can you please check.

narayan954 commented 1 year ago

I have solved the conflict. Can you please check.

Hi @Palakkgoyal I just found this css conflicts with comment box css as well, can you please fix? image

Palakkgoyal commented 1 year ago

I have solved the conflict. Can you please check.

Hi @Palakkgoyal I just found this css conflicts with comment box css as well, can you please fix? image

Fixed

narayan954 commented 1 year ago

I have solved the conflict. Can you please check.

Hi @Palakkgoyal I just found this css conflicts with comment box css as well, can you please fix? image

Fixed

when we click on view profile, some one else's profile opens... also, that box is overtaken by sidebar in terms of z index. Also,profile picture is square now and the box opens very lower than expected. Can you check if you're facing these as well now? I think earlier I didn't face that. image image

Palakkgoyal commented 1 year ago

I will fix others. But, I checked for this Aditya Roy's profile. I don't know why everytime we are getting there. I thought its happening with me only. I checked for user.uid and I think I checked for everything but still going to this profile. Even I am working on other PR. There also I am getting navigated(sometimes) to this one

Palakkgoyal commented 1 year ago

Hey I checked just now that even on the deployed website we are reaching that profile only.

Palakkgoyal commented 1 year ago

Hey hey. I get it there is problem with the way we are fetching data. This function: const docRef = db.collection("users", user?.uid); const docSnap = await docRef.get();


You will think that this will return only one doc but, guess what it is returning an array of 87 docs(Perhaps all user docs). Let me check what is wrong.

Palakkgoyal commented 1 year ago

Hey I fixed that in my centralize data PR. Check it out. const docRef = doc(db, "users", user?.uid); const docSnap = await getDoc(docRef);

Palakkgoyal commented 1 year ago

Hey I have fixed the issues. The dropdown alignment issue was due to routing PR

narayan954 commented 1 year ago

Hey hey. I get it there is problem with the way we are fetching data. This function: const docRef = db.collection("users", user?.uid); const docSnap = await docRef.get();

You will think that this will return only one doc but, guess what it is returning an array of 87 docs(Perhaps all user docs). Let me check what is wrong.

thanks a ton for finding that error!

narayan954 commented 1 year ago

Hey I checked just now that even on the deployed website we are reaching that profile only.

I didn't check that, sorry

narayan954 commented 1 year ago

Thanks for your contribution @Palakkgoyal :)

Palakkgoyal commented 1 year ago

Hey I checked just now that even on the deployed website we are reaching that profile only.

I didn't check that, sorry

No worries.