Hi there! so im creating a social network prototype on bubble, and im trying to create a friending system, that involves pending, approving, and denying friend requests with a notification system, and a following system. if i get the friend part, i can transfer that and turn it into the following system.
In my data base, i have 2 types. one for users, and the other for posts. i have friends, and following, and followers as fields in posts, which now that i think about it, i should probably just create a new thing for this system.
here is the preview, as you will see you can friend users, but its one sided.
also on the main home feed, im trying to have it to were a user can only see their friends posts.
TLDR: does anyone have any tips or tricks for making this easier? thanks in advance!
3 Likes
hi devotic98,
how I would do this.
- As you correctly said, create a new datatype friend requests. In it have the field: Recipient (user) and accepted (yes/no) and withdrawn (yes/no).
- In the database underneath datatype users create a new field called list of friend requests (type list of friend requests) . this will allow every user to easily access their friends and friend requests at the same time.
- whenever you show a profile eg on user profile pages. Have a “follow” button that is not visible on page load and shown only if current user’s list of friend requests:filtered recipients (accepted= yes ) does not contain that groups user. Also make this button visible if the current user’s list of friend rquests: filtered recpiipients (accepted= no) contains that groups user. In this case change the text to: Request sent.
- If that button “follow” is clicked, create a new thing “friend request” with accepted being no, and recipient that group’s user. In the next action of that workflow: make changes to thing: that group’s user: add result of step 1 to that user’s list of friend requests. Also in step 3, add result of step 1 to current user’s list of friend requests. This ensures that both users can easily see which friend requests (and friends (those friend requests where accepted= yes) ) they have and change them as they wish.
4b. For the unfollow button do exactly the opposite.
- Have a place where every user sees pending friend requests. This could be a repeating group: current user’s list of friend requests: filtered where accepted = no. In this repeating group have an accept button. If this is clicked, change that cell’s request to yes.
- Similarly you can create a repeating group where users can withdraw friend requests
- In the social network itself, to steer the posts, only show posts where the posts creator is in current users list of friend requests recipients where accepted = yes and withdrawn = no. This only shows the current user posts of those that befriended him.
- Whenever 4 and 5 are done, create a new datatype called notification and add it to the users list of notifications. This way users can be notified when a friend request is sent or accepted.
hope this helps, feel free to pm me if you want some more tips or steps explained.
happy bubbling,
regards
Julius
For free tips & step by step lists on bubble & more check https://tiplister.com
7 Likes
Awsome! Ill try it out when i get to work. Ill keep you updated. If i need any further help ill for sure PM you. Ill probably need help with the liking system aswell
1 Like
so in the follow button condition, im having trouble setting it up. i currently have When: current user’s list of friend requests:filtered recipients
i cant seem to attach the rest of it to the condition. any thoughts?
will current user’s list of friend requests:filtered recipients contains parents grop user work?
1 Like
ah, yes, so the parent group of the follow button has to be type user for this to work and contain the user you want to friend.
1 Like
Create a new data type friend request. It has the following fields: recipient (user) and accepted (yes / no) and has been revoked (yes / no). Is this user or user list? Because I see that the picture in the tutorial in you shows that there is a user and a user list, which makes me wonder whether it is the innovative friend request (user) or friend request (user list) when the user requests
Hi grab.hau, sorry for whatever reason I only saw your comment now.
So I created a new data type friend request with the fields you mentioned.
This is a separate data type to “User”. “User” is a datatype that every bubble app starts with.
To connect the datatypes, after creating the new data type “friend request”. I then add a new field to “User” called “List of friend requests”, which I make type “friend request” and it is a “list of things.”
This is how in my conditions shown above I can use “Current User’s list of friend requests: filtereds’ recipient of request.” which in english means "Users friend requests
user. This allows me to show only people who have accepted the friend request and reference their name in a cell.
Hope that clarifies it for you and other people people reading this thread.
Feel free to pm me, then I will be sent an email and should be able to respond.
best regards
Julius
@TipLister
First - thank you for the help you’ve provided here. It has been super helpful in getting me over a hump in using the platform.
I am also trying to create a similar social platform that requires a friending mechanism, and have set up almost precisely what you have outlined above but am getting stuck on generating a complete User friend list. If I create a list where “Current User’s list of friend requests: filtered where request accepted = yes”, I seem to only have the option of displaying the Recipient User information OR the Creator user information like below (displaying Recipient user info):
In order to see the full list of friends for the current user I am struggling with how to make a consolidated list (as a friend request could be created by the user or received by the user).
Or is this unnecessary?
Thank you in advance for any thoughts/advice!
James
Hi,
in this case it is probably best to add a new datafield called users list of friends (list of users underneath user)
when “accept” button of friend request is clicked do not only alter the friend request to accepted is yes but also add the recipient to the creators list of friends and the creator to the recipients list of friends.
This way show friends in a repeating group with data source current users list of friends.
2 Likes
Thanks @TipLister - will try it that way!
Hi @TipLister,
Thanks for your amazing guide here, it’s been really helpful. I just have one question I can’t figure out:
I’m creating a follower / following thing rather than just friend request. The issue I’m having is that when the user hits Accept to the request to follow, I don’t know how to add the Current User (person who accepts) to the Following of the Requestor.
I have set up the workflow so that when Accept is hit, the Current User’s Followers change and have the Requestor added:
I just can’t get it the other way! Any help would be greatly appreciated.
Thanks,
Nick
hi nick, glad the guide helped you.
I believe you are almost there:
So when a friend/follow request is sent this always has a creator and a recipient (both fields are type user)
when accept is clicked by the recipient of the request (displayed in a repeating group of all friend requests) : the creator of the request should be added to the current users list of followers ( a list of users) and then in step 2 the current user should be added to the friend request creators list of followers.
then in a newsfeed you can have something like: do a search for posts where creator is in: current users list of followers.
Hey @TipLister,
Unfortunately I’m still getting stuck on the second part of this ( step 2 the current user should be added to the friend request creators list of followers).
The issue I’m having is in the workflow, I’m trying to make changes to a thing, but it is not possible to change the friend request creators list of followers. See the screenshot below for the options I’m given.
I’m nearly certain I’ve got the data set up correctly so now I’m truly confused! Am I missing something here?
Also, I’m going to get greedy and ask you one more thing…the notifications - I’m having trouble setting that up. Are you able to explain the workings of that in a little more detail?
just select "Current cells follow requests…creator as the thing to change in that step 3 you have open.
then click plus and add the current user to the creators list of followers.
Notifications: a new datatype
they could have one field called friend request (type friend request)
and one field called message for later(type message)
then the user has two fields: a list of unread notifications (list of notifs) and a list of read ones. (list of notifs)
when a friend request is accepted a notification is created (in step 4) of your above screen) with friend request= result of step 1
then in step 5 : make changes to current cells follow requests creator
list of notifications unread : add result of step 4 (the notification created)
then each user has a repeating group which shows as data source: current users list of notifications.
and a button in it called “mark all as read”.
when you click it make changes to current user:
list of notifications read, set list: to list of notifs unread
then in next step: clear list: notifs unread
1 Like
Yep, this has worked an absolute treat. Thanks for your help @TipLister!
1 Like
Hey @TipLister ! I really appreciate what you have shown. I am new to bubble and I’m struggling to get around how to add the whole Friend Request send/unsend/receive/unfriend/display/notify functionalities to work. I added a search bar where I have the user search for other users to “View their profile”, I made it so that 3 Parameters: ProfilePic, Name, and About me, are sent to a view profile page. I want to create a add friend functionality to the page of the viewed user.
Not sure if I explained that correctly so ill share a link to my bubble, please do let me know how I can fix this, Thank you! (if you would like edit access let me know )
i also have this as a video might help you