diff --git a/Frontend/src/components/StatusBar.jsx b/Frontend/src/components/StatusBar.jsx
index 23833b3..81e3487 100644
--- a/Frontend/src/components/StatusBar.jsx
+++ b/Frontend/src/components/StatusBar.jsx
@@ -2,7 +2,7 @@ import React from "react";
 
 const StatusBar = ({ togglePanel, panelVisible }) => {
   return (
-    <div className="status-bar ">
+    <div className="status-bar">
       {/* Left Section of the Status Bar */}
       <div className="status-bar-left">
         {/* Branch Indicator */}
@@ -46,6 +46,27 @@ const StatusBar = ({ togglePanel, panelVisible }) => {
           <span>0 errors</span>
         </div>
 
+        {/* Warning Indicator */}
+        <div className="status-item">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="16"
+            height="16"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="2"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            aria-label="Warning Icon"
+          >
+            <path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path>
+            <line x1="12" y1="9" x2="12" y2="13"></line>
+            <line x1="12" y1="17" x2="12.01" y2="17"></line>
+          </svg>
+          <span>0 warnings</span>
+        </div>
+
         {/* Toggle Terminal Button */}
         <button
           className="status-item status-button"
@@ -73,6 +94,16 @@ const StatusBar = ({ togglePanel, panelVisible }) => {
           <span>UTF-8</span>
         </div>
 
+        {/* Language Mode */}
+        <div className="status-item">
+          <span>JavaScript</span>
+        </div>
+
+        {/* EOL (End of Line) Indicator */}
+        <div className="status-item">
+          <span>LF</span>
+        </div>
+
         {/* Connection Status */}
         <div className="status-item">
           <svg