Merge pull request #37 from senju1337/feat/OPS-54

Feat/ops-54: Add a maximum input length fo the prompt

senju/main.py

@@ -74,6 +74,8 @@ def generate_haiku():
     if request.method == 'POST':
         json_data = request.get_json()
         prompt = json_data["prompt"]
+        if len(prompt) > 100:
+            return "Content Too Large", 413
         haiku = Haiku.request_haiku(prompt)
         id = store.save_haiku(haiku)
         return str(id)

senju/templates/prompt.html

@@ -8,6 +8,8 @@
             <input
                 type="text"
                 id="user-input"
+                minlength="0" 
+                maxlength="100"
                 placeholder="Type your prompt here..."
                 class="w-full px-4 py-3 text-lg border-2 border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-violet-600"
             />
@@ -32,24 +34,28 @@ document.getElementById("submit-btn").addEventListener("click", function() {
     let responseBox = document.getElementById("response-box");
     let responseText = document.getElementById("ai-response");
 
+    // Hide the response box initially
+    responseBox.classList.add("opacity-0");
+
     if (userInput.trim() === "") {
         responseText.textContent = "Please enter a prompt!";
     } 
+    else if (userInput.length > 100) {
+        responseText.textContent = "Input must under 100 characters long!";
+    }
     else if (userInput.trim() === "amogus") {
         responseText.textContent = "🤖 AI is thinking...";
         responseBox.classList.remove("opacity-0");
 
         // Simulated AI response delay
         setTimeout(() => {
-            responseText.textContent = `Sus imposter ඞ`;
+            responseText.textContent = "Sus imposter ඞ";
         }, 1500);
     } 
     else {
         responseText.textContent = "🤖 AI is thinking...";
         responseBox.classList.remove("opacity-0");
 
-        console.log(userInput );
-
         fetch('/api/v1/haiku', {
             method: 'POST',
             headers: {
@@ -59,15 +65,12 @@ document.getElementById("submit-btn").addEventListener("click", function() {
         })
         .then(response => response.text())
         .then(data => {
-            console.log(data);
             let id = parseInt(data, 10);
             window.location.href = "/haiku/" + id;
         })
         .catch(error => {
-            document.getElementById('result').innerHTML = '<strong>Error:</strong> ' + error.message;
+            responseText.textContent = 'Error: ' + error.message;
         });
-
     }
 });
-</script>
 {% endblock %}