update

app/components/FilesEditor/AddDocument/index.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import React from "react";
+import AddDocumentIcon from "@/components/Icons/AddDocument";
+import Popup from "@/components/Popup";
+import { useState } from "react";
+import Pterodactyl from "@/components/Pterodactyl";
+import { useSearchParams } from "next/navigation";
+
+const Index = () => {
+  const [showPopup, setShowPopup] = useState(false);
+  const [fileName, setFileName] = useState("");
+  const urlParams = useSearchParams();
+  const serverId = urlParams.get("serverid") || "";
+  const pathParam = urlParams.get("path") || "/";
+  const apiKey = `${process.env.NEXT_PUBLIC_API_KEY}`;
+
+  const pterodactyl = new Pterodactyl();
+
+  function togglePopup() {
+    setShowPopup(!showPopup);
+  }
+
+  function handleOk() {
+    console.log({ fileName });
+    if (fileName) {
+      pterodactyl.setApiKey(apiKey);
+      pterodactyl.setServerId(serverId);
+      pterodactyl.helpers.setWorkingDirectory(pathParam);
+      pterodactyl.files.createFile(fileName);
+    }
+    setShowPopup(false);
+  }
+
+  return (
+    <>
+      <Popup
+        title="New file name"
+        show={showPopup}
+        onClickClose={togglePopup}
+        onClickOk={handleOk}
+      >
+        <div>
+          <input
+            type="text"
+            className="input input-sm input-bordered mb-4 text-base-content"
+            placeholder="File name"
+            value={fileName}
+            onChange={(e) => setFileName(e.target.value)}
+          />
+        </div>
+      </Popup>
+      <button
+        onClick={() => {
+          setFileName("");
+          togglePopup();
+        }}
+        className="btn btn-sm"
+      >
+        <AddDocumentIcon />
+        Add Document
+      </button>
+    </>
+  );
+};
+
+export default Index;