Messages & Replies

On this episode of Build it with Tim, we'll learn how to build a messaging system inside your Tadabase application using the Form Component, Connections, and Email Notifications.

Features Discussed:

1. Connection Fields (Time: 05:07)
   Learn how to set up a parent-child relationship between messages and replies, connecting each message to the users involved, and cascading connections down to the replies.
2. List Component (Time: 11:12)
   Learn how to display messages for both the sender and recipient based on login status. The setup involves using an "OR" filter to ensure the logged-in user sees all relevant messages, whether they sent or received them. Additionally, learn to create a record details page linked to each message, allowing users to view and reply to messages.
3. Table Rules (Time: 11:53)
   Learn how to set the "Sent From" field to the logged-in user and the "Sent To" field to the user who posted the marketplace item. Also, ensure the current date and time are recorded for each message.
4. Form Component (Time: 19:38)
   Learn how to set up table rules to automatically populate fields like the marketplace post, date and time, and the logged-in user for replies. This ensures every reply is properly linked to its parent message.
5. Email Notifications (Time: 23:55)
   Learn how to trigger email notifications when a message is sent. It includes logic for determining the recipient, depending on the logged-in user.

---

Transcript Summary

Introduction

Hello everybody and welcome back to another episode of Build It with Tadabase. Today I'm going to show you how to build a message and reply system inside of Tadabase so that you can send messages to people, they can reply to that message, and you can exchange replies right inside of your application.

Application Overview

When we're finished with this particular application, here's what my example looks like: I've built a marketplace with different categories and posts connected to those categories. The images were generated with AI, based on some of the previous videos that I've done.

We can view posts within each category and send messages. For example, I'm logged in as a buyer, viewing a post, and I can send a message like, "Hi, I'd love to come pick these up." When I send this message, it will be sent to the actual seller of the item. Both the seller and the buyer will receive an email notification that they've received a message. They can log in, see the message, and start to communicate through connected replies.

If the seller replies, saying, "Sure, when would you like to come pick it up?" or "Sorry, it's already sold," the buyer will see those replies, and they can have a conversation back and forth, all within this fake marketplace application.

Setting Up the System

It's not too complicated to set up; it just takes two additional data tables and some page structure manipulation to get the workflows the way we want them. Let's hop over to the Builder and take a look.

Context and Technical Background

In this example, we have a marketplace with categories and posts where people can sell items. Each post connects to a category, and we have some users. We have two users created: one called "Post Viewer" and one called "Post Creator." We're only using a single user role because, in this context, it's a public-facing site where users can sign up under the same role to either post or send a message. The marketplace categories are straightforward, with a category name and image, and the posts contain basic information about the item for sale.

Creating Data Tables

To hold the message data, we'll create two data tables: "Messages" and "Replies."

1. Messages Table:

• Contains the actual message text (long text).
• Records the date and time the message was sent.
• Connects to the marketplace post.
• Connects to the users table twice (sent from and sent to).

1. Replies Table:

• Similar to the messages table but connects the replies to the parent message.
• Also connects to the marketplace post.
• Records the reply text (long text) and the date and time.
• Connects to the users table once (sent from).

Page Structure

I've already created the pages for the marketplace, categories, and posts. On the post details page, I've left space to insert a new message.

1. Marketplace Page:

• Displays categories and posts.
• Uses connected page links to navigate from category details to post details.

1. Message Form:

• Placed on the post details page to allow users to send a message connected to that post.
• Includes rules to automatically set the date and time, the sender (logged-in user), and the recipient (post creator).

Viewing and Replying to Messages

We'll create a "My Messages" page where users can view all messages connected to them, whether they are the sender or recipient. We'll filter the messages to display only those connected to the logged-in user, regardless of their role.

1. Message Details Page:

• Displays the parent message and all connected replies.
• Allows users to add new replies connected to the message.

1. Reply Form:

• Placed on the message details page to allow users to add a reply.
• Includes rules similar to the message form to set the connected post, date and time, and sender.

Email Notifications

We'll set up email notifications to notify users when they receive a new message or reply.

1. Initial Message Notification:

• Sends an email to the recipient when a new message is created.

1. Reply Notification:

• Sends an email to the other user (buyer or seller) when a reply is created, based on the logged-in user's role.

Conclusion

That's it for this week's episode of Build It with Tadabase. We've created a message and reply system with the necessary data tables, page structures, and workflows. The next step would be to style the system to make it look more like an actual chat, possibly using custom components.

Thank you very much for watching. If you haven't already, make sure you subscribe to our channel because we produce these videos weekly. Thanks again for watching, and we'll see you next week. Take care!