Mood Mender Chatbot - Copy this React, Tailwind Component to your project

Generate a application that has chatbot interface in the middle , and on the upper left corner there should be a small camera window which uses my model.h5 . i want to integrate this chatbot code into this . use the code below : import os import google.generativeai as genai from dotenv import load_dotenv load_dotenv() genai.configure(api_key=os.getenv("GEMINI_API_KEY")) generation_config = { "temperature": 0, "top_p": 0.95, "top_k": 64, "max_output_tokens": 8192, "response_mime_type": "text/plain", } model = genai.GenerativeModel( model_name="gemini 1.5 pro", generation_config=generation_config, system_instruction="you are MoodMender that helps people get out of depression and anxiety and other mental related stuff. if user ask for some advise you should provide it and act as the users friend so they can feel confortable . get them effective ideas that can elevate their moods. use humor and example that are relatable and to make conversation educational and intresting . ask question to the user to better understand them \n", ) history = [] print("MOODMENDER : Hello , how may i assist you today?") print() while True: user_input = input("You: ") print() chat_session = model.start_chat( history=history ) response = chat_session.send_message(user_input) model_response = response.text print(f'MOODMENDER: {model_response}') print() history.append({"role": "user", "parts": [user_input]}) history.append({"role": "model", "parts": [model_response]})