algovengers / mindmate

MindMate

A mental health chat assistant

Deploy Link : MindMate

Youtube Link : MindMate Youtube Explanation

Our project MindMate got 1st Position 😀 in it 👇️

Devfolio Link : MindMate Hackathon Project Link

Mindmate is a mental health AI powered chat assistant that guides and helps you to improve your mental health. Mindmate website provides a user-friendly UI to learn about mental health.

Features

• AI chat assistant to take guidance about mental health.
• Analyse your mental health over a period of time.
• Get an Indication about your mental health condition with a graphical visualization.
• Editor's compiled articles to read and educate about mental health problems.
• Get emails from time to time with suggestions to improve your mental health.

Tech

System Design

MindMate application runs on 4 server

• Frontend
• Backend
• WebSocket Server
• Email Server

Tech stack

• Frontend
  • React JS
  • Tailwind
• Backend
  • Node Js
  • Express Js
  • Gemini (Gen AI)
  • Web Sockets
  • Node Mailer
• Tools
  • Vercel
  • Render
  • Mongo DB
  • Firebase

How to Setup Locally?

Firebase Setup

1. Setup a new Firebase project
2. Add a Web App
3. Go to Authentication -> Sign-in Method
4. Enable Email/Password, Gmail as Provider
5. Go to the Project Settings of Web App and get your firebaseConfig object
6. Create .env in Frontend folder and add firebaseConfig as per .env.sample file
7. In the service accounts section, Generate new private key (json object).
8. Create .env in Backend folder and add new private key as per .env.sample file
9. Fill rest .env as per .env.sample files

Gemini Setup

• Get your Gemini (by Google) API_KEY from (https://ai.google.dev) and put in Backend .env as per .env.sample

MongoDB Setup

• Create a MongoDB Atlas (https://www.mongodb.com) account and get your URI and put in Backend .env as per .env.sample

Create Connection amongst Servers

• Put Url for Websocketserver in Backend .env (ex- WEBSOCKET_SERVER=ws://localhost:8802)
• Put Url for Backend and Websocketserver in Frontend .env (ex- REACT_APP_API_LINK=http://localhost:8800 and REACT_APP_WS_LINK=ws://localhost:8802)

Scripts to Install and Run

1. Need to have Node.js installed
2. Go to the Backend, Frontend, Websockerserver folder seperately and run for each npm install
3. Run Backend by, npm run dev or npm start
4. Run Frontend by, npm start
5. Run Websocketserver by, node index.js

Website Preview

HomePage

Login

Analysis

AI Chat

mindmate's Issues

Design editor's pick header or footer and improve home page

every editor's pick home page header & footer does not work properly . It is not responsive and home page footer is incomplete.
Add some social sites.

Fixing the landing page design and adding animation

I am Agamjot singh. Under GSSOC'24, I would like to work on this issue. Pls assign me this!!

Implement forget password feature

Description:

The application currently lacks the "Forgot Password" feature, which is crucial for user account recovery. This issue is to implement the necessary pages and functionality required for the "Forgot Password" feature.

Tasks:

1. Create Forgot Password Page: Develop a new page or modal for the "Forgot Password" functionality.

   • Steps to Implement:
     1. Design the user interface for entering email addresses for password reset requests.
     2. Implement the frontend components for the Forgot Password page/modal.
   • Expected Behavior: Users should be able to access the Forgot Password page/modal to initiate the password reset process.

2. Backend Logic for Password Reset: Develop backend logic to handle password reset requests and send reset instructions to the user's email.

   • Steps to Implement:
     1. Define API endpoints or backend routes to handle password reset requests.
     2. Implement logic to generate and store password reset tokens securely.
     3. Integrate with email services to send password reset instructions to users.
   • Expected Behavior: Upon submitting a password reset request, users should receive instructions on how to reset their passwords via email.

It Should go next line when we do shift + Enter

data in the text area is not formatted
when we do alt + enter it should break one line and start from next line
also when the response of the AI is in code format we cant distinguish between the code and the text

@algovengers please assign me this issue

Make a route to setup cronjob in the socket server

Make a HTTP server in WebSocket server and make /cron route.

We host these server on render which turns down the server after inactivity. Make a /cron route that we can hit to keep the server up.

[UI Enhancement] - Footer and Hero section design can be improvised.

The design of the Hero section and footer of the website can be enhanced and make appealing to the users.
I would love to work on this issue as a GSSoC'24 Contributor. Looking forward for your response.

IMAGE :

Add issues

As the maintainer of a Collaborate repo, keeping Issues up-to-date will help the student community understand what they can do to contribute. Issues should vary by the easy (update documentation) to the difficult (add a new feature). The more involved you are, the more opportunities there are to collaborate.

Recommendations:

Add issues of varying difficulty to the repo often. you must add the tag gssoc, Level 1, Level 2, Level 3 good first issue etc.
How we cacluclate the Scores on Leaderboard: Every PR one point
Level 1: 10 points
Level 2: 25 points
Level 3: 45 points
Try to add some documentation issues as well it would be easy for beginner contributor to explore opensource through your repo.
Generate issues even if you plan on solving them, so the repository appears as active.
Contribute/commit often to the repo so it does not go stale.
Reference https://github.com/Recode-Hive/Stackoverflow-Analysis/issues

Disable the send button when the message is empty to avoid sending empty messages

Delete Email Server and add it to the main server

Improve the footer of the home page.

Need of Voice Prompt

I feel that it would be much better if there would be an option to speak and then the response text would be generated as well i.e. both text and speech prompt. I would like to work upon this issue.

Enhancement: Hover Effect and Blinking Cursor for Improved Interaction

In this enhancement request, I propose the addition of hover effects and a blinking cursor to enhance the user interaction on our GitHub repository.

Hover Effect:
Implementing hover effects can provide visual feedback to users when they interact with elements on the page. This enhancement aims to improve the user experience by adding subtle animations or changes in appearance when users hover over clickable elements such as buttons, links, or navigation items. By adding hover effects, we can make the interface more engaging and intuitive, helping users to understand the interactive elements better.

Blinking Cursor:
Introducing a blinking cursor can also improve user interaction, especially in input fields or text areas. The blinking cursor serves as a visual indicator of the active input focus, making it easier for users to identify where they can type or enter text. This enhancement will ensure that users have clear visual feedback when interacting with input fields, enhancing the usability and accessibility of our platform.

Updating Login page and login card

Login page does not seem that interactive and attractive can u assign me this issue .I am a GSSOC'24 Contributor I will try my best to update it. Thank you

The home page's signup/login button is confusing for users, need to update it for better user experience

The home page has a icon which is usually used to depict a logout function. But, on clicking it we are taken to sign-in or login page. So this is confusing for any first time user. So a better navbar is needed.

FOOTER REDESIGN AND CONTACT US PAGE

@subharthihazra Whole website is looking very nice but footer is not that much good,
and also in website contact us section is missing.

assign this issue to me i can redesign footer section and create responsive contact us page .

i want to work on this issue under GSSoC'24.

[FEATURE] Daily Affirmations and Inspirational Quotes

Description

I believe that incorporating daily affirmations, motivational quotes, and mindfulness exercises can greatly enhance the user experience and contribute to a more positive and supportive environment

Feature Details

1. As soon as the user logs in, the user should see the positive affirmation, should be on self-love, confidence and resiliance.
2. Can create a different section which includes quotes and affirmations.

Would like to work on this feature under GSSoC '24. Request you to assign this task to me :)

About us section is looking weird according to the look and feel of website.

Issue

About us section is looking weird according to the look and feel of website.

Solving it

I will solve it by using css and some UI/UX principles.

Screenshot

Hey PA, I want to contribute to this project. Please assign this task to me. Thankyou!

It Should go next line when we do alt

Add templates for issues

Issue templates are very helpful for a collaboration repo. When users identify a bug or want to add a new feature, you can provide templates so you can collect all the pertinent information you need to fix a bug or add a new feature.

We recommend creating a “Report Bug” and “Feature Request” issue template.
you can refer this: https://docs.github.com/en/communities/using-templates-to-encourage-useful-issues-and-pull-requests/configuring-issue-templates-for-your-repository

Some suggested prompts/questions you can add to a “Report Bug” template are:

Briefly describe the bug
What is the expected behavior?
Please provide step by step instructions on how to reproduce the bug
Some suggested prompts/questions you can add to a “Feature Request” issue template are:

Briefly describe your feature request
What problem is this feature trying to solve?
How do we know when the feature is complete?

Reference: https://github.com/Recode-Hive/Stackoverflow-Analysis/issues/new/choose
Click on Get Started button and copy the template to yours.

Add Code of Conduct

We recommend that every repo has a code of conduct. If you don’t feel comfortable creating your own Code of Conduct from scratch we highly recommend using one of the templates provided by GitHub. If you do use a template, please read through the template and ensure that you can and will abide by the Code of Conduct.

Please follow these instructions on how to add a Code of Conduct.

Sample: https://github.com/Recode-Hive/Stackoverflow-Analysis/blob/main/CODE_OF_CONDUCT.md

personalized chat still visible after logout bug

I logged out, but I can still see my messages. Need to refresh the website to update the state.

Update footer with icons, image, and links

change the footer design, and add icons to them

Adding Animation

• Your landing page already looks fantastic, but incorporating animations could make it even more captivating. With my experience in this area, I'm eager to contribute to this enhancement.
• If you could assign me this task under GSSOC24, I would be thrilled to work on it. Thank you for considering my offer to improve Vite's appeal!

Learn.md

Learn repos should have a LEARN.md file to teach student how to build your project step by step. You can explain how to build your project with text, code snippets, images, or even short (5 minute) long video lessons. As the maintainer of a Learn repo, the LEARN.md file requires you to think critically about how to explain the building of your project and how to also make it engaging. We don't expect you to be an expert teacher, but we would like you to reflect on how difficult it was to get to your level of knowledge, and then provide friendly guidance to help other students to learn.

Reference: https://github.com/Recode-Hive/Stackoverflow-Analysis/blob/main/Learn.md

Filter genuine email

Security Feature

In your application anyone can enter using temporary or disposable email.
I will add a feature so that no one could create an account using temporary or disposable email.
It will allow only genuine users in your database.
It will help to avoid any bot.
Assign me this work under GSSoC24, I will implement it.

Improvement of footer design

The footer looks can be improved by adding icons and images.

Please assign me this issue under Gssoc'24 so that I can work on it

Add Topics

In GSSoC'24, GitHub Topics will help the discoverability of your project.

I see that you already have great topics on your repository!
I would recommend adding the name of the company like the software you use to build like "vs-code, ghdesktop" to improve your discoverability.

If you are happy with the topics you have, feel free to close this issue. 👍

Automated Greeting Workflow

I propose to create a GitHub workflow named "Greetings". This workflow will automatically greet users who create new issues or pull requests in this repository. The Greeting will look like "Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible."

Please assign this issue to me

[UI Enhancement] - Hero section design can be improvised.

The Hero section of website MindMate is not very optimized with respect to UI/UX and also does not convey much information about the application itself. It can improved with some more attractive HEADING and Sub-heading and some other small things also.

I would love to work on this issue as a GSSoC'24 Contributor. Looking forward for your response.

IMAGE OF HERO SECTION :

Missing Code of Conduct File in Repository

Currently, the repository lacks a Code of Conduct file, which is an essential component for fostering a healthy and inclusive open-source community. A Code of Conduct serves as a guideline for expected behaviour, ensuring that contributors and participants feel safe, respected, and valued within our community space.

Please assign this issue to me, so i can work towards it.

Confirm password field is missing

Issue Description

Summary:
The registration form is missing a "Confirm Password" field, which is necessary for users to confirm their password during registration.

Expected Behavior:
A "Confirm Password" field should be included in the registration form to ensure users input their passwords accurately.

Current Behavior:
The registration form lacks a "Confirm Password" field, potentially leading to user input errors and confusion during the registration process.

Steps to Reproduce

1. Navigate to the registration page.
2. Observe the absence of a "Confirm Password" field in the registration form.

Proposed Solution

1. Add "Confirm Password" Field:
   • Modify the registration form template to include an input field for confirming the password.
   • I will also verify that the passwords entered by users meet the required strength criteria.

Create a skeleton in Chat/Message with AI page while Loading

Girlscript Summer of Code Introduction/Tracking

👋 Hi @subharthihazra ,
am Sanjay, program Manager Girlscript Summer of Code. I'll be collaborating with you on preparing your repo for GSSoC'24 Program

Why are these changes required?
After Analysing last year's contributions and feedback it would be great for students to have a couple of standard readme files on the repo to understand what the project is all about and some issues detailing what they can contribute. This will help you to see increased engagement in your repository as well.

As mentioned students get a chance to learn step by step, how to build this project as well as invite mentors to collaborate and add features to this repo. I will generate issues, which will provide guidance on how to prepare your repo for Girlscript summer of code 2024 on 10th May.

This issue will serve as a tracking issue to track all issues related to GSSoC'24. I recommend creating a new branch for every issue and opening a pull request to track changes so we can effectively collaborate with each other and merge changes when you and I feel like those changes are ready to be merged on your primary branch.

If you have any questions or concerns, please feel free to leave a comment on this issue or any of the other issues that are generated.

I look forward to working with you

• #51
• #50
• #49
• #48
• #47

Add GitHub Desktop Contribution Instructions

I am interested in contributing to the project by adding detailed instructions on how to contribute using GitHub Desktop.

I believe that by providing clear and comprehensive guidance, we can encourage more contributors to participate in the project, especially those who prefer using GitHub Desktop for their contributions.

Could you please assign me the issue related to adding GitHub Desktop contribution instructions under gssoc24? I am excited about the opportunity to contribute to the project and help streamline the contribution process for others.

Add Dark Mode as a Feature

Hello @algovengers I want to add a feature of Dark Mode for a better UI and additional versatility.
Kindly assign me this issue under GSSoC'24.

Suggest New Features

This is a open ended issue, anyone is free to suggest some features in this Issue and get it approved by the maintainers before actually making a PR

Improve Prompt of Gemini For better response

Sign In Spelling Mistake the login page

At the login page there is sign in spelling mistake it is write as signin with google

Impove the looks of mic logo

The mic logo and its positioning is not suiting well. Improve the look and feel.

[UI] : Remove scroll bar

We can remove the scroll bar as it would go better with the minimalistic look of the website

Add PR template

I would like to add a pull request template for this repository. I believe that having a standardized template will help streamline the contribution process, ensuring that all necessary information is included and making it easier for maintainers to review and merge pull requests.

Could you please assign this issue to me under GSSOC'24.

Changing the card design

I want to change these designs, as they are not aligned and i want to change them so that it looks ui compatible

Adding functionality to make the application speak out the response from the server. (Voice output)

Adding a floating arrow to scroll to top

I wish to add an arrow which on clicking will return to top of the page
@subharthihazra Please assign this issue to me under GSSOC 2024
Also, add necessary labels to it.

Adding a custom knowledge base to gemini

I'm interested in taking up the opportunity of adding a custom knowledge base/train the RAG on a few custom datasets to help improve that chatbot's response. Under GSSOC'24, I would like to work on this issue.
@afeefuddin @algovengers

Adding the hover effect and animation over Editor's pick

I am Agamjot singh. Under GSSOC'24, I would like to work on this issue. Pls assign me this!!

Improve Readme

Add description on how to setup the project locally.

Validations using toastify library

Issue Description

Summary:
We currently have form validation implemented in our registration page, but we'd like to enhance the user experience by incorporating React Toastify for displaying validation messages.

Expected Behavior:
Form validation messages should be displayed using React Toastify, providing a more visually appealing and user-friendly way to convey validation errors.

Current Behavior:
Form validation messages are displayed within the form itself, which interrupts the layout and doesn't provide an optimal user experience.

Steps to Reproduce

1. Navigate to the registration page.
2. Attempt to submit the form with invalid input.
3. Observe the current behavior of validation messages displayed within the form.

Proposed Solution

Integrate React Toastify to handle form validation messages:

• Display validation messages using Toastify notifications.
• Ensure messages are clear and easy to understand.
• Customize Toastify appearance to match the overall design aesthetic.

Additional Context

• Version of React being used.
• Any existing form validation libraries or mechanisms in place.
• Any specific requirements or constraints for the Toastify integration.

Missing CONTRIBUTING.md File in Repository

The repository currently lacks a CONTRIBUTING.md file, which is an important resource for guiding potential contributors on how to engage with the project effectively. A CONTRIBUTING.md file outlines the contribution guidelines, coding standards, and procedures for submitting pull requests, thus streamlining the contribution process and ensuring consistency across contributions.

Could you please assign this issue to me under GSSOC 24.

Changing the Button ui "chat with us..." on the Homepage

The cursor effect is text on the button "chat with us..." and there are no effects on hovering which isn't attractive. Change the UI of the button.

Please assign me this issue under the gssoc24 tag