Spaces:

nonprof
/

gemini_counsellor

Configuration error

@@ -1,10 +1,21 @@
----
-title: Gemini Counsellor
-emoji: 📚
-colorFrom: red
-colorTo: red
-sdk: docker
-pinned: false
----
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

+# Gemini AI Chatbot
+### Install Dependencies
+```bash
+pip install -r requirements.txt
+```
+### Run the Web App
+In the terminal, execute the following command:
+```
+python app.py
+```
+This will launch a web app locally. Open your browser and navigate to the provided address (usually http://localhost:5000/) to interact with the Gemini AI chatbot.
+Feel free to explore and customize the code according to your needs. Contributions are welcome!
+**Notes**
+* Ensure that you have Python installed on your system.
+* Use a virtual environment for better isolation of dependencies.

app.py ADDED Viewed

	@@ -0,0 +1,45 @@

+from flask import Flask, render_template, request, redirect, url_for
+import google.generativeai as genai
+textsi_1 = """You simulate the human therapist experience of someone who has personal one-on-one sessions with his or her clients.
+Chatting with you should feel like they are talking to a REAL therapist or Counsellor who knows how to listen carefully, be empathic, and analyse the situation.
+Always respond with a short response. Always take time with the conversation so the client will have sufficient time to settle in.
+Always remember that solving their problem is not your first preference! It\\\'s for the comfort of the client.
+Greet them, Appreciate them for taking the step, talk to them, and close the conversation when they say bye. Just summarize the whole conversation and give advice points to the client to improve their situation in a better way!
+Remember to set the mood of the conversation according to the client\\\'s mood."""
+model = genai.GenerativeModel('gemini-1.5-flash-001', system_instruction=[textsi_1])
+import os
+my_api_key_gemini = os.getenv('my_new_api_key_here')
+genai.configure(api_key=my_api_key_gemini)
+app = Flask(__name__)
+# Define your 404 error handler to redirect to the index page
+@app.errorhandler(404)
+def page_not_found(e):
+    return redirect(url_for('index'))
+@app.route('/', methods=['POST', 'GET'])
+def index():
+    if request.method == 'POST':
+        try:
+            prompt = request.form['prompt']
+            question = prompt
+            response = model.generate_content(question)
+            if response.text:
+                return response.text
+            else:
+                return "Sorry, but I think Gemini didn't want to answer that!"
+        except Exception as e:
+            return "Sorry, but Gemini didn't want to answer that!"
+    return render_template('index.html', **locals())
+if __name__ == '__main__':
+    app.run(debug=True)

gunicorn_config.py ADDED Viewed

	@@ -0,0 +1,2 @@


1	+ bind = '0.0.0.0:80'
2	+ workers = 2

requirements.txt ADDED Viewed

	@@ -0,0 +1,5 @@

+Flask==2.2.3
+google-generativeai
+gunicorn==20.0.4
+grpcio
+Werkzeug==2.2.3

static/images/demo.gif ADDED Viewed

static/images/iba_logo.png ADDED Viewed

templates/index.html ADDED Viewed

	@@ -0,0 +1,166 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="x-ua-compatible" content="ie=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="description" content="Demonstration of Gemini API in a Python Flask Application.">
+  <title>IBA Chatbot</title>
+  <link rel="shortcut icon" type="image/x-icon" href="{{ url_for('static', filename='images/iba_logo.png') }}">
+  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="https://drive.google.com/uc?export=view&id=1yTLwNiCZhIdCWolQldwq4spHQkgZDqkG">
+  <style>
+    body {
+      font-family: 'Manrope', sans-serif;
+      margin: 0 auto 40px;
+      background-color: #101626;
+      color: #fff;
+    }
+    .skeleton1,
+    .skeleton2,
+    .skeleton3 {
+      min-height: 18px;
+      padding: 10px;
+      border-radius: 4px;
+      background-size: 40px 100%;
+      background-repeat: no-repeat;
+      background-position: left -40px top 0;
+      animation: shine 1s ease infinite;
+    }
+    .skeleton1 {
+      background-color: #101626;
+      width: 70%;
+    }
+    .skeleton2 {
+      background-color: #e2e5e7;
+      width: 50%;
+    }
+    .skeleton3 {
+      background-color: #e2e5e7;
+      width: 60%;
+    }
+    @keyframes shine {
+      to {
+        background-position: right -40px top 0;
+      }
+    }
+  </style>
+</head>
+<body class="w-lg-50 w-md-75 w-sm-100 py-3">
+  <main class="flex-shrink-0">
+    <div>
+      <br>
+      <br>
+      <h1 class="mt-3">Gemini AI Model - Free Chatbot</h1>
+      <p>This project is based on the free Gemini API recently released by Google. <span style="font-weight: bold;">60 queries per minute</span>. For more information, visit my <a href="https://medium.com/@fareedkhandev" target="_blank">Profile</a>.</p>
+      <br>
+      <div id="list-group" style="background-color: #101626;" class="list-group w-auto">
+      </div>
+      <div class="input-group w-lg-50 w-md-75 w-sm-100 p-3 fixed-bottom" style="margin: 0 auto; ">
+        <input type="text" class="form-control" id="chat-input"
+          style="background-color: #3A4556; border: #3A4556; color: #fff;">
+        <div class="input-group-append">
+          <button id="gpt-button"
+            style="background-color: #140b9d; color: white; border-radius: 0 5px 5px 0;" class="btn">Ask Gemini</button>
+        </div>
+      </div>
+    </div>
+  </main>
+  <script src="https://code.jquery.com/jquery-3.6.3.min.js"
+    integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous">
+  </script>
+  <script>
+    $("#gpt-button").click(function () {
+      var question = $("#chat-input").val();
+      let html_data = '';
+      html_data += `<a  style="margin-top:-10px; background-color:#3A4556; border:none; color:white;"
+          class="list-group-item list-group-item-action d-flex gap-3 py-3">
+          <img
+            src="https://w7.pngwing.com/pngs/178/595/png-transparent-user-profile-computer-icons-login-user-avatars-thumbnail.png"
+            alt="twbs" width="32" height="32"
+            class="rounded-circle flex-shrink-0">
+          <div class="d-flex gap-2 w-100 justify-content-between">
+            <div>
+              <p class="mb-0 opacity-75">${question}</p>
+            </div>
+          </div>
+        </a>
+        <div id="response"></div>`;
+      $("#chat-input").val("");
+      $("#list-group").append(html_data);
+      $('div#response:last').html(`
+      <!-- code here -->
+          <div class="py-3" id="ok-good">
+            <h2 class="skeleton1"></h2>
+            <h2 class="skeleton2"></h2>
+            <h2 class="skeleton3"></h2>
+          </div>`);
+      if ($("#ok-good").length) {
+        $('html, body').animate({
+          scrollTop: $("#ok-good").offset().top
+        }, 100);
+      }
+      $.ajax({
+        type: "POST",
+        url: "/",
+        data: {
+          'prompt': question
+        },
+        success: function (data) {
+          let gpt_data = '';
+          gpt_data += `<a  style="background-color:#202835; border:black;"  href="#"
+              class="list-group-item list-group-item-action d-flex gap-3 py-3">
+              <img src="{{ url_for('static', filename='images/iba_logo.png') }}" alt="twbs" width="32" height="32"
+                class="rounded-circle flex-shrink-0">
+              <div class="d-flex gap-2 w-100 justify-content-between">
+                <div>
+                  <p id="typing-demo" class="mb-0 opacity-75 text-white"></p>
+                </div>
+              </div>
+            </a><br>`;
+          $("#list-group").append(gpt_data);
+          $('div#response:last').html('');
+          var i = 0;
+          var speed = 5;
+          function typeWriter() {
+            if (i < data.length) {
+              $("p#typing-demo:last").text($("p#typing-demo:last").text() + data.charAt(i));
+              i++;
+              setTimeout(typeWriter, speed);
+            }
+          }
+          typeWriter();
+        }
+      });
+    });
+  </script>
+</body>
+</html>