Chat Conversation component

[marinasundstrom]

I was thinking that there should be some kind of Chat Conversation component as it is commonly occurring in a wide area of apps, and for various purposes. Like when you are posting comments in a business app.

I have been prototyping for the last hour or so. Adapting the look of this.

My CSS skills are not that great. And I'm yet to create the actual components.

I was thinking of creating components that can be combined or used standalone. Like: ChatMessage, ChatMessageGroup, and ChatSection. With as much customizability as possible.

"Yesterday" and "Today" are Section headers.

Source code: https://github.com/marinasundstrom/item-catalog/blob/main/Client/Catalog/Messages/MessagePage.razor

[marinasundstrom]

I have update the prototype. Now there are components and more CSS. 🙂

I have a problem with selecting :last-child but that is less important, for now.

[marinasundstrom]

I have opened an issue: #4238

[pratip-bagchi]

Hi @marinasundstrom can you please share your code, the above link isn't working.

[ScarletKuro]

If I'm not wrong this still can be accessed here:
https://github.com/marinasundstrom/YourBrand/tree/ab1e5818eef78a9da4fddbf6937e77db8a78c034/Portal/MudBlazor.Extensions

https://github.com/marinasundstrom/YourBrand/tree/ab1e5818eef78a9da4fddbf6937e77db8a78c034/Messenger/Messenger.UI

[marinasundstrom]

Check this one: https://github.com/marinasundstrom/ChatApp/tree/main/src/ClientApp/Chat/Messages

It is the latest 🙂 There are even reactions.

https://www.youtube.com/watch?v=eOEqPFWu-Os

I'm thinking about adding this to YourBrand.

[marinasundstrom]

The latest version of this is here:

https://github.com/marinasundstrom/ChatApp/tree/main/src/ClientApp/Chat/Messages

https://www.youtube.com/watch?v=eOEqPFWu-Os

I'm thinking about adding this to YourBrand.

[pratip-bagchi]

Thanks for the reply, really appreciate this. Do you have any read me or video on how to use this in a brand new project ?

[marinasundstrom]

Sorry. These components are not very re-usable as is.

Good news is that I have integrated it into my main YourBrand project. As of yesterday.

So have a look at this:

https://github.com/marinasundstrom/YourBrand/blob/main/src/ChatApp/ChatApp.UI/Chat/Channels/ChannelPage.razor

The ClientApp project is the old one. I have been moving stuff over to ChatApp.UI which is the plugin for this Portal.