Making better chat apps with the "Any Component" blocks

Currently, these are the two working blocks
image

As you can see, none of them actually saves the chat to Firebase. You only save the last input message to cloud variable Send_ChaT and what is showing on the screen is the result of cloning the screen components only.

2 Likes

Smile :blush::blush::blush::blush::blush:
You are such a genius,so I will simply do what now ?

1 Like

So I think that the ‘SAVE’ should come in the second blocking,after save is done_then the cloning should take place??:thinking:
Or can it be at the click of the SEND_CHAT BUTTON?

1 Like

This is a general question which is hard to answer.

You would first need to decide on what you want to achieve.

  • Do you want to design a chat app where users join a room and chat to each other?
  • Do you want tot design a chat app where two users can have a private chat (one to one)?
  • Or you want to provide both features.

The next thing is to design your Firebase database structure such as for one to one:-

Chat-DB
    chat-Header
         To-user
         From-User
         Message-List
             Date-Stamp(ID)
                 Sender
                 Message-Text

Now you can start coding your blocks accordingly.

This is just a simple scenario.

2 Likes

I appreciate your response and attention so far.
But for now all I want is a room chat

1 Like

For a room chat, your Firebase database structure could be:-

Chat-DB
    chat-Room
         Room-Code
         Message-List
             Date-Stamp( as message ID)
                 Sender
                 Message-Text

You will need to save every message under the correct key.

When any user runs the app and enters the room code, you should read your Firebase and display the chat messages under that room before giving the user the ability to send his/her own message.

1 Like

It’s more like I will be starting this fresh,how can I delete old variables

1 Like

Am so confused right now,which and which are actually Variables,can you please just shed more light on how to go about this structures you’ve pointed out…
Thanks for the rescue

1 Like

Hi @versatile
To help you with a good start, I modified your app to read from Firebase.
https://x.thunkable.com/projectPage/62bee1f46ab61900116b9ba3

You will need to supply the API key and the Database URL.

When starting the app you need to choose a room. If you don’t select a room, general will be chosen.

You will also need to supply a nickname to use in the chat.

If there are previous messages stored in Firebase, they will be listed in the chat area.

The project is not complete and that is not the intention. To use it properly, you will need to fine tune it.

As of now, you can use it with more than one user simultaneously and you should get the chat from other users in the same room.

Have Fun!

2 Likes

am blessed,big ups to you.i really appreciate this

1 Like

I noticed a bug in the project that it duplicates the chat history with every new entry. This is now fixed. You can remix the project again to get the updated copy.

To use it properly you will need to add a procedure/function to check the the nickname/ID entered is not already used.

Sample output

1 Like

Hurray, thanks I’ve been on it since+duties calls
It’s working but still trying to fine tune it

1 Like

Of course you can fine tune it and add features.

I made more changes but cosmetic only. Now the caption of the chat page shows the chat room name and the user name. Another change is that if the message is yours then it shows without name because you are the only one showing in the lift side. All others will show the message with the name.

I think it’s time to mark this post as SOLVED as the rest of the changes are improvements but the main issue of this post is now solved.

2 Likes

Yea,but unfortunately can’t do the SOLVED thing,and also am working on changing the current user’s chat to the Right side

1 Like

The caption will now notify other users when a new user comes in ,and another label to display number of users online…
These are other features am trying to include now…

Thanks to you @muneer you have been a blessing

1 Like

Oh, sorry, I thought you are the one started the topic from the way you are running after the solution. Now I see that @domhnallohanlon is the owner of this topic.


Good luck. These are the features I call cosmetics.

2 Likes

:smiling_face_with_three_hearts::smiling_face_with_three_hearts:

You are awesome

1 Like

@muneer How can I retrieve images from spreadsheet and display them one after the other in my app?
I’ve tried but not working out

1 Like

I believe this is not in the right post.

Please create your sperate post for this issue and give more information about it.

1 Like