Update src/App.js

src/App.js

@@ -3,6 +3,7 @@ import "./App.css";
 
 function App() {
 
+  // ✅ Your Hugging Face backend URL
   const API = "https://Srikar00007--Medical-Chatbot.hf.space";
 
   const [image, setImage] = useState(null);
@@ -10,6 +11,7 @@ function App() {
   const [question, setQuestion] = useState("");
   const [answer, setAnswer] = useState("");
 
+  // ✅ Upload Image -> Analyze
   async function uploadImage(e) {
     const file = e.target.files[0];
     setImage(URL.createObjectURL(file));
@@ -26,6 +28,7 @@ function App() {
     setAnalysis(data);
   }
 
+  // ✅ Ask AI
   async function askAI() {
     const res = await fetch(`${API}/ask-ai/`, {
       method: "POST",
@@ -48,19 +51,22 @@ function App() {
 
       <input type="file" accept="image/*" onChange={uploadImage} />
 
+      {/* ✅ Show Uploaded Image */}
       {image && <img src={image} alt="Uploaded" className="preview" />}
 
+      {/* ✅ Show Analysis Results */}
       {analysis && (
         <div className="results">
-          <h2>Detection Results</h2>
-          <p><b>Wound Type:</b> {analysis.wound_label}</p>
+          <h2>🔍 Detection Results</h2>
+          <p><b>Wound:</b> {analysis.wound_label}</p>
           <p><b>Skin Disease:</b> {analysis.skin_label}</p>
         </div>
       )}
 
+      {/* ✅ Ask Question */}
       {analysis && (
         <>
-          <h2>Ask a Medical Question</h2>
+          <h2>💬 Ask a Medical Question</h2>
           
           <input
             type="text"
@@ -72,7 +78,7 @@ function App() {
 
           {answer && (
             <div className="answer-box">
-              <h3>AI Response</h3>
+              <h3>✅ AI Response</h3>
               <p>{answer}</p>
             </div>
           )}