modified CodeEditor

src/pages/CodeEditor.jsx

@@ -1,5 +1,6 @@
 import { useEffect, useState } from "react";
 import EditorPanel from "../components/EditorPanel";
+import PreviewPanel from "../components/PreviewPanel";
 
 const PageCodeEditor = () => {
   const [code, setCode] = useState(
@@ -64,6 +65,11 @@ const PageCodeEditor = () => {
           <EditorPanel code={code} onChange={setCode} />
         </div>
 
+        {/* <div className="preview-section">
+            <PreviewPanel code={code} />
+        </div> */}
+
+
         {/* live arena */}
         <div
           className="box-panel"
@@ -134,46 +140,6 @@ const PageCodeEditor = () => {
             </button>
           </div>
 
-          {/* snake api */}
-          <div
-            style={{
-              background: "rgba(255,255,255,0.05)",
-              borderRadius: "8px",
-              padding: "1rem",
-              marginBottom: "1rem",
-              textAlign: "center",
-            }}
-          >
-            <input
-              type="text"
-              placeholder="Your Snake API URL"
-              style={{
-                background: "transparent",
-                border: "none",
-                color: "#fff",
-                width: "100%",
-                textAlign: "center",
-                fontFamily: "'Fira Code', monospace",
-                outline: "none",
-              }}
-            />
-            <button
-              style={{
-                backgroundColor: "#ff2a6d",
-                color: "#fff",
-                padding: "0.5rem 1rem",
-                border: "none",
-                borderRadius: "20px",
-                marginTop: "0.5rem",
-                cursor: "pointer",
-                width: "100%",
-                fontWeight: "bold",
-              }}
-            >
-              CONNECT SNAKE API
-            </button>
-          </div>
-
           {/* test move button */}
           <div
             style={{