Spaces:

Usmansafder
/

LaMini-LM-API

Sleeping

App Files Files Community

usmansafdarktk commited on Jul 7, 2025

Commit

5b2b9b0

1 Parent(s): 3ad9473

Serve index.html via FastAPI static files

Browse files

Files changed (3) hide show

main.py +4 -4
requirements.txt +2 -1
static/index.html +167 -0

main.py CHANGED Viewed

@@ -3,6 +3,7 @@ import logging
 import torch
 import gc
 from fastapi import FastAPI, HTTPException
 from pydantic import BaseModel
 from transformers import pipeline
@@ -11,6 +12,9 @@ logger = logging.getLogger(__name__)
 app = FastAPI(title="LaMini-LM API", description="API for text generation using LaMini-GPT-774M", version="1.0.0")
 class TextGenerationRequest(BaseModel):
     instruction: str
     max_length: int = 100
@@ -38,10 +42,6 @@ def load_model():
 async def health_check():
     return {"status": "healthy"}
-@app.get("/")
-async def root():
-    return {"message": "Welcome to the LaMini-LM API. Use POST /generate to generate text."}
 @app.post("/generate")
 async def generate_text(request: TextGenerationRequest):
     if generator is None:

 import torch
 import gc
 from fastapi import FastAPI, HTTPException
+from fastapi.staticfiles import StaticFiles
 from pydantic import BaseModel
 from transformers import pipeline
 app = FastAPI(title="LaMini-LM API", description="API for text generation using LaMini-GPT-774M", version="1.0.0")
+# Mount static files
+app.mount("/", StaticFiles(directory="static", html=True), name="static")
 class TextGenerationRequest(BaseModel):
     instruction: str
     max_length: int = 100
 async def health_check():
     return {"status": "healthy"}
 @app.post("/generate")
 async def generate_text(request: TextGenerationRequest):
     if generator is None:

requirements.txt CHANGED Viewed

@@ -1,4 +1,5 @@
-fastapi==0.115.2
 uvicorn==0.32.0
 transformers==4.46.0
 torch==2.4.1

+fastapi[standard]
 uvicorn==0.32.0
 transformers==4.46.0
 torch==2.4.1
+pydantic

static/index.html ADDED Viewed

	@@ -0,0 +1,167 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>LaMini-LM API</title>
+  <script src="https://cdn.jsdelivr.net/npm/react@18.2.0/umd/react.production.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/react-dom@18.2.0/umd/react-dom.production.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/babel-standalone@7.22.9/babel.min.js"></script>
+  <script src="https://cdn.tailwindcss.com"></script>
+</head>
+<body class="bg-gray-100 min-h-screen flex items-center justify-center">
+  <div id="root"></div>
+  <script type="text/babel">
+    function App() {
+      const [instruction, setInstruction] = React.useState('');
+      const [maxLength, setMaxLength] = React.useState(100);
+      const [temperature, setTemperature] = React.useState(1.0);
+      const [topP, setTopP] = React.useState(0.9);
+      const [generatedText, setGeneratedText] = React.useState('');
+      const [error, setError] = React.useState('');
+      const [isLoading, setIsLoading] = React.useState(false);
+      const handleSubmit = async (e) => {
+        e.preventDefault();
+        setError('');
+        setGeneratedText('');
+        setIsLoading(true);
+        if (!instruction.trim()) {
+          setError('Instruction cannot be empty.');
+          setIsLoading(false);
+          return;
+        }
+        if (maxLength < 10 || maxLength > 500) {
+          setError('Max length must be between 10 and 500.');
+          setIsLoading(false);
+          return;
+        }
+        if (temperature <= 0 || temperature > 2) {
+          setError('Temperature must be between 0 and 2.');
+          setIsLoading(false);
+          return;
+        }
+        if (topP <= 0 || topP > 1) {
+          setError('Top P must be between 0 and 1.');
+          setIsLoading(false);
+          return;
+        }
+        try {
+          const response = await fetch('/generate', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+              instruction,
+              max_length: maxLength,
+              temperature,
+              top_p: topP,
+            }),
+          });
+          const data = await response.json();
+          if (response.ok) {
+            setGeneratedText(data.generated_text);
+          } else {
+            setError(data.detail?.[0]?.msg || 'Failed to generate text.');
+          }
+        } catch (err) {
+          setError('Error connecting to the API. Please try again.');
+        } finally {
+          setIsLoading(false);
+        }
+      };
+      return (
+        <div className="max-w-2xl mx-auto p-6 bg-white rounded-lg shadow-lg">
+          <h1 className="text-3xl font-bold text-center text-gray-800 mb-6">
+            LaMini-LM Text Generator
+          </h1>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div>
+              <label htmlFor="instruction" className="block text-sm font-medium text-gray-700">
+                Instruction
+              </label>
+              <textarea
+                id="instruction"
+                value={instruction}
+                onChange={(e) => setInstruction(e.target.value)}
+                className="mt-1 w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"
+                rows="4"
+                placeholder="e.g., Tell me about camels"
+              ></textarea>
+            </div>
+            <div>
+              <label htmlFor="maxLength" className="block text-sm font-medium text-gray-700">
+                Max Length (10–500)
+              </label>
+              <input
+                id="maxLength"
+                type="number"
+                value={maxLength}
+                onChange={(e) => setMaxLength(Number(e.target.value))}
+                min="10"
+                max="500"
+                className="mt-1 w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"
+              />
+            </div>
+            <div>
+              <label htmlFor="temperature" className="block text-sm font-medium text-gray-700">
+                Temperature (0–2)
+              </label>
+              <input
+                id="temperature"
+                type="number"
+                step="0.1"
+                value={temperature}
+                onChange={(e) => setTemperature(Number(e.target.value))}
+                min="0"
+                max="2"
+                className="mt-1 w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"
+              />
+            </div>
+            <div>
+              <label htmlFor="topP" className="block text-sm font-medium text-gray-700">
+                Top P (0–1)
+              </label>
+              <input
+                id="topP"
+                type="number"
+                step="0.1"
+                value={topP}
+                onChange={(e) => setTopP(Number(e.target.value))}
+                min="0"
+                max="1"
+                className="mt-1 w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"
+              />
+            </div>
+            <button
+              type="submit"
+              disabled={isLoading}
+              className={`w-full py-2 px-4 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 ${
+                isLoading ? 'opacity-50 cursor-not-allowed' : ''
+              }`}
+            >
+              {isLoading ? 'Generating...' : 'Generate Text'}
+            </button>
+          </form>
+          {error && (
+            <div className="mt-4 p-4 bg-red-100 text-red-700 rounded-md">
+              {error}
+            </div>
+          )}
+          {generatedText && (
+            <div className="mt-4 p-4 bg-gray-100 rounded-md">
+              <h2 className="text-lg font-semibold text-gray-800">Generated Text:</h2>
+              <p className="mt-2 text-gray-600">{generatedText}</p>
+            </div>
+          )}
+        </div>
+      );
+    }
+    const root = ReactDOM.createRoot(document.getElementById('root'));
+    root.render(<App />);
+  </script>
+</body>
+</html>