Spaces:

Ouiam123
/

chatbot_app

Runtime error

App Files Files Community

Ouiam123 commited on Jan 8

Commit

f5e2bdd

verified ·

1 Parent(s): db0dd0c

Upload 3 files

Browse files

Files changed (3) hide show

app.py +57 -0
requirements.txt +2 -0
templates/index.html +120 -0

app.py ADDED Viewed

	@@ -0,0 +1,57 @@

+import os
+from flask import Flask, render_template, request, jsonify
+import requests
+import time
+from dotenv import load_dotenv
+load_dotenv()  # Load environment variables from .env file
+app = Flask(__name__)
+class APIInferenceChatbot:
+    def __init__(self, api_token):
+        self.api_url = "https://api-inference.huggingface.co/models/Ouiam123/Llama-2-7b-chat-finetune-tourism"
+        self.headers = {
+            "Authorization": f"Bearer {api_token}",
+            "Content-Type": "application/json"
+        }
+    def generate_response(self, input_text):
+        formatted_prompt = f"<s>[INST] {input_text} [/INST>"
+        payload = {
+            "inputs": formatted_prompt,
+            "parameters": {
+                "max_new_tokens": 500,
+                "temperature": 0.7,
+                "top_p": 0.95,
+                "repetition_penalty": 1.15
+            }
+        }
+        response = requests.post(self.api_url, headers=self.headers, json=payload, timeout=30)
+        if response.status_code == 503:
+            time.sleep(20)
+            response = requests.post(self.api_url, headers=self.headers, json=payload)
+        response.raise_for_status()
+        result = response.json()
+        return result[0].get('generated_text', '').strip() if isinstance(result, list) and result else str(result)
+# Get the API token from the environment variable
+api_token = os.getenv("HF_API_TOKEN")
+if not api_token:
+    raise ValueError("Hugging Face API token not found in environment variables!")
+# Initialize the chatbot with the API token from the environment
+chatbot = APIInferenceChatbot(api_token)
+@app.route('/')
+def home():
+    return render_template('index.html')  # Serve the HTML file
+@app.route('/chat', methods=['POST'])
+def chat():
+    message = request.json.get('message', '')
+    response = chatbot.generate_response(message)
+    return jsonify({'response': response})  # Return the response as JSON
+if __name__ == '__main__':
+    app.run(host='0.0.0.0', port=7860, debug=True)

requirements.txt ADDED Viewed

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


1	+ flask
2	+ requests

templates/index.html ADDED Viewed

	@@ -0,0 +1,120 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>🇲🇦 Moroccan Tourism Assistant</title>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            max-width: 800px;
+            margin: 20px auto;
+            padding: 0 20px;
+        }
+        .chat-container {
+            border: 1px solid #ccc;
+            border-radius: 5px;
+            padding: 20px;
+            height: 400px;
+            overflow-y: auto;
+            margin-bottom: 20px;
+        }
+        .message {
+            margin: 10px 0;
+            padding: 10px;
+            border-radius: 5px;
+        }
+        .user-message {
+            background-color: #e3f2fd;
+            margin-left: 20%;
+        }
+        .bot-message {
+            background-color: #f5f5f5;
+            margin-right: 20%;
+        }
+        .input-container {
+            display: flex;
+            gap: 10px;
+        }
+        #user-input {
+            flex-grow: 1;
+            padding: 10px;
+            border: 1px solid #ccc;
+            border-radius: 5px;
+        }
+        button {
+            padding: 10px 20px;
+            background-color: #007bff;
+            color: white;
+            border: none;
+            border-radius: 5px;
+            cursor: pointer;
+        }
+        button:hover {
+            background-color: #0056b3;
+        }
+        .loading {
+            display: none;
+            margin: 10px 0;
+            color: #666;
+        }
+    </style>
+</head>
+<body>
+    <h1>🇲🇦 Moroccan Tourism Assistant</h1>
+    <div class="chat-container" id="chat-container"></div>
+    <div class="loading" id="loading">Assistant is thinking...</div>
+    <div class="input-container">
+        <input type="text" id="user-input" placeholder="Ask about tourism in Morocco...">
+        <button onclick="sendMessage()">Send</button>
+    </div>
+    <script>
+        function addMessage(message, isUser) {
+            const chatContainer = document.getElementById('chat-container');
+            const messageDiv = document.createElement('div');
+            messageDiv.className = `message ${isUser ? 'user-message' : 'bot-message'}`;
+            messageDiv.textContent = message;
+            chatContainer.appendChild(messageDiv);
+            chatContainer.scrollTop = chatContainer.scrollHeight;
+        }
+        function sendMessage() {
+            const input = document.getElementById('user-input');
+            const message = input.value.trim();
+            if (message) {
+                addMessage(message, true);
+                input.value = '';
+                document.getElementById('loading').style.display = 'block';
+                fetch('/chat', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify({ message: message })
+                })
+                .then(response => response.json())
+                .then(data => {
+                    document.getElementById('loading').style.display = 'none';
+                    addMessage(data.response, false);
+                })
+                .catch(error => {
+                    document.getElementById('loading').style.display = 'none';
+                    addMessage('Sorry, an error occurred while processing your message.', false);
+                    console.error('Error:', error);
+                });
+            }
+        }
+        // Allow sending message with Enter key
+        document.getElementById('user-input').addEventListener('keypress', function(e) {
+            if (e.key === 'Enter') {
+                sendMessage();
+            }
+        });
+    </script>
+</body>
+</html>