Raven is a simple work messaging tool that is built using Frappe Framework and can be installed on any new or existing Frappe site (e.g. in addition to ERPNext or Gameplan). It is designed to help teams collaborate and cRepository Video 📺️
Simple, open source team messaging platform
FOSS Hack 3.0
Before the Hackathon
The web app had the following features:
- Creating a channel
- Joining a channel
- Adding and removing a member
- Sending messages (only text based) in channels and private messages.
During the Hackathon
The mobile app was set up using Capacitor, Ionic and React: 1. Set up authentication on the mobile app 2. View all channels, private messages and profile on mobile app 3. View a channel's messages (text, images and files) on the mobile app 4. Send a message on a channel.
New features were added to the web app: 1. Ability to create an "Open" channel - where all users are members by default. 2. Ability to delete a message previously sent 3. Ability to edit a message 4. Ability to send images and files by clicking on the file "plus" button 5. Ability to send images and files by dragging and dropping them into the chat interface 6. Image previews in the chat interface 7. Ability to download files from the chat interface 8. Styling improvements: dark mode for emoji picker, highlight for mentions in messages (@user), dark mode support for Quill mentions menu 9. General channel is created when app is installed. 10. Bug fix: empty messages cannot be sent 11. Bug fix: duplicate channel names cannot be created (added validation) 12. Bug fix: design issues fixed on the chat interface to make the chat messages responsive according to height of input.
What's not working (yet)
Mobile app: 1. Channels cannot be created and channel details cannot be viewed 2. Members cannot be added to or removed from channels 3. Files and images cannot be sent.
Moreover, the mobile app authentication needs to be updated to use Bearer tokens because of a cookie issue on iOS. The mobile app works on Android.
Web app: 1. Improvements to be made on direct message listing. 2. Lazy loading and scroll to load for older messages.
Raven is a simple work messaging tool that is built using Frappe Framework and can be installed on any new or existing Frappe site (e.g. in addition to ERPNext or Gameplan). It is designed to help teams collaborate and communicate with each other and get work done. Teams can create their own channels (publically viewable or private) and send messages, emojis, files and images.
Raven was born out of a need to have a simple work communication tool that could replace Slack for us at The Commit Company. Most work communication tools in the market had the following problems:
- They include many features like video calling, audio sharing on top of work messaging which are not required for small teams. However, these features are expensive to build and run.
- Hence, they require payments for every user every month - regardless of how much time a user uses the tool or how many messages they send. This meant that we would have to pay for "mostly inactive" users as well.
- We were already using ERPNext hosted on Frappe Cloud for our operations. Since all our users were already on ERPNext and we were paying for the server, we thought that a simple Frappe app can solve our work communication problem - and we feel there are many other teams and organizations who would benefit in a similar way.
- Send messages to all members in your organization (in an "open" channel), or just in your team in a private channel.
- Create new channels for your team and your team members.
- Send text messages 💬, code blocks 💻, emojis 😆, files 📑 and images 📸.
- Mention users in your messages with "@"
- Don't strain your eyes 👀 - Raven supports dark mode 🌙
- Collaborate on the go with the Raven mobile app 📱 (in progress).
Raven is built using the Frappe Framework - an open-source full stack development framework.
The frontend is built using React and the following tools: 1. ChakraUI - UI components 2. frappe-react-sdk - simple React hooks to interface with a Frappe framework backend - built and maintained by us at The Commit Company. 3. react-icons - Icon set 4. Framer Motion - Animations 5. react-quill
Since Raven is a Frappe app, it can be installed via frappe-bench on your local machine or on your production site.
bench get-app https://github.com/janhvipatil/Raven.git bench --site yoursite.name install-app raven
Post this, you can access Raven on your Frappe site at the
/raven-app endpoint (e.g. https://yoursite.com/raven-app).
We plan to publish Raven to the Frappe Cloud Marketplace soon.
Local development setup
To set up your local development environment, make sure that you have enabled developer mode in your Frappe site config.
You also need to disable CSRF (add
ignore_csrf: 1 in your
site_config.json) since the React web server will not have any CSRF token in live reload mode. If you are working on the mobile app, you would also need to allow CORS (add
allow_cors: "*" in your
site_config.json). Please note that this is only for the local dev setup - not meant for Production.
You can start the React live web server by:
cd frappe-bench/apps/raven yarn dev
Your local dev server would be running at
You can also run the mobile app on your browser by:
cd frappe-bench/apps/raven/mobile yarn install yarn dev
We are currently working or will be working on the following features. Please head to our Github issues page and feel free to contribute:
- Mobile app for Raven
- Open-graph link previews
- Push notifications
- Integration service - allowing other applications to create bots and send messages. Some popular services we are looking at are Github, Linear, [Sentry][https://sentry.io], [Frappe Desk][https://frappedesk.com].
If you find any bugs, feel free to report them here on GitHub Issues. Make sure you share enough information (app screenshots, browser console screenshots, stack traces, etc) for project maintainers to replicate your bug.
Raven - Messages can be viewed on the mobile app now. File and image uploads are working on the web app. Today's target is to be able to send and receive messages on the mobile app.
- Mobile app now shows the list of channels and the user profile
- File drop works on web app
- Emoji picker now supports dark mode
- Duplicate check added for channel names
Today's target is to be able to show messages and send messages on the mobile app. On the web app, we aim to be able to view files and image based messages in the chat screen.
Mobile app setup with Ionic and Capacitor is complete. Working on the authentication flow for mobile app.
- Open channels can be created from the web app
Project created by Nikhil Kothari