DEV Community

Sidharth Mohanty
Sidharth Mohanty

Posted on

Final Part: GSoC 2022 | Rocket.Chat | EmbeddedChat

Hello everyone, it’s the last week of Google Summer of Code (for medium-term projects) and it feels so amazing when I look back to the day I started it. My project was just an idea at that time; now it’s a product! I am so grateful for the love and support from the Rocket.Chat community. My project has got whooping 12+ stars on GitHub now and some potential users who are eager to use it! These few months were really hard. We had to face so many challenges, so many edge cases, and so many stages. It was an amazing journey altogether!

Some updates on EmbeddedChat:

EmbeddedChat in action
This is the component I've worked on for the past few months. Think like it as a mini version of RocketChat that can be embedded into any web application.

At last the component looks something like this,

<RCComponent
  moreOpts={true}
  isClosable={true}
  setClosableState={setClosableState}
  width="100%"
  height="35vh"
  GOOGLE_CLIENT_ID={GOOGLE_CLIENT_ID}
  host={ROCKETCHAT_HOST}
  roomId={ROCKETCHAT_ROOM_ID}
  channelName="general"
  anonymousMode={true}
  headerColor='#F5455C'
/>
Enter fullscreen mode Exit fullscreen mode

UI/UX improvements

We added a headerColor property which will automatically predict if the text and icons should be dark/light. This will help EmbeddedChat get camouflaged as a native component of the parent web application. We also removed the dependency of being fullscreen to show moreOptions rather it can be shown at all times now.

Pinning and starring

This feature helps to pin and star messages using EmbeddedChat and has a different UI (page-like) to showcase the pinned and starred messages of a channel.

Reactions to messages

This feature allows user to react to messages in real-time.

Handling attachments

This is in progress, we are now handling different types of attachments (video/audio/image/docs) but we are yet to work on sending attachments using EmbeddedChat.
attachments

Proposing an iframe solution to make it framework agnostic

This method will allow users to use EmbeddedChat without worrying about it being a React.js Component. It is now super simple to integrate EmbeddedChat within minutes.
iframe deploy

All the coding stuff aside, I created YouTube videos to make it ever so simple for users to set up EmbeddedChat into their applications. I created some demo repositories showing the capabilities and use cases of EmbeddedChat and making it very easy for developers to integrate it.

Wiki: EmbeddedChat/wiki
For YouTube Videos: EmbeddedChat
Demo Repositories: EmbeddedChat as a component and EmbeddedChat as iframe

Presentation Day (September 8th)

Rocket.Chat organizes an internal “Demo Presentation” for all students. These presentations are attended by almost the entire Rocket.Chat engineering team including the CEO Gabriel Engel and CTO Rodrigo Nascimento. It was an amazing experience presenting the work that I had done over the past three months.
The entire recording is published at Rocket.Chat’s YouTube channel. You can also check it out here:

Presentation slides: Demo Day Presentation Slides
Work product Repository: Google-Summer-of-Code-2022
Test out EmbeddedChat here: EmbeddedChat Demo

Thanks to my mentor!

I will be forever grateful to my mentor Rohan Lekhwani sir for being such an amazing spirit to work with. Just a secret to share here, I had my internal exams around the time of Community Bonding Period and my 4th semester exams around August (10th - 24th) and I was so much worried for them as it was my first offline semester. I had asked my mentor if I could take some days off in between to manage both GSoC and exams and he was so supportive throughout that I got 9.27 GPA in my exams. Also I used to have both personal and professional talks with him about life and career in general which were super helpful for me. He is an amazing person whom I will look up to forever.

Thanks to the entire Rocket.Chat community!

Thank you so much to my mentors - SingLi sir, Duda and Debdut sir for all the support and guidance, it means a lot for any student to get appreciation, criticism and encouragement from their mentors to grow in life. I would also like to thank my friends for being there and making these months not just only about learning but enjoyable too. I hope we stay in touch in the future. Thanks!

To end,

It was one journey that will stay with me for lifetime. I learnt a lot of things - not just coding but beyond it.

What's Next?

I will continue working on adding more features to EmbeddedChat as per user requirements. Next target will be to introduce thread functionality which is the most used feature of RocketChat.

Connect with me:
Email: sidmohanty11@gmail.com
GitHub: https://github.com/sidmohanty11
LinkedIn: https://www.linkedin.com/in/sidmohanty11
Twitter: https://twitter.com/sidmohanty11

Do check out the project, and if you like it you can star ⭐ it too :)
https://github.com/RocketChat/EmbeddedChat

Top comments (4)

Collapse
 
rohanlekhwani profile image
Rohan Lekhwani

Congratulations and awesome work Sidharth! Can't wait to see EmbeddedChat being used by the world.

Collapse
 
sidmohanty11 profile image
Sidharth Mohanty

Thank you! Me too!

Collapse
 
antariksh17 profile image
Antariksh

definitely reach out to dukaan.tech. I think they would love to hire you

Collapse
 
sidmohanty11 profile image
Sidharth Mohanty

Thanks! Will surely try