Refactor file loading and code retrieval logic

This commit refactors the code in the `Page` component to improve the file loading and code retrieval logic. It removes the hardcoded initial code value and replaces it with an empty string. It also updates the `useEffect` hook to properly handle the startup of the application and retrieve the code content using the `Pterodactyl` API. Additionally, it updates the rendering of the breadcrumbs and adds a save button to the file editor.

Refactor file directory change functionality

This commit refactors the `changeDirectory` function in the `Index` component of the `FilesEditor` module. The function is removed as it is no longer used and has been replaced with a more efficient approach to handle directory changes.

app/app/files/edit/page.tsx

@@ -13,61 +13,67 @@ function Page() {
   const searchParams = useSearchParams();
   const serverId = searchParams.get("serverid") || "";
   const path = searchParams.get("path") || "";
-  const [code, setCode] = useState("dupa");
-  const pterodactyl = new Pterodactyl();
+  const [code, setCode] = useState("");
 
-  useEffect(() => {
-    const startupApp = async () => {
-      const panelApp = new Panel();
+  useEffect(
+    function () {
+      async function startupApp() {
+        const panelApp = new Panel();
+        const pterodactyl = new Pterodactyl();
 
-      const credentials = await panelApp.getCredentials();
-      pterodactyl.setApiKey(credentials.api_key);
-      pterodactyl.setServerId(serverId);
-      setCode(await pterodactyl.files.getContent(path));
-    };
+        const credentials = await panelApp.getCredentials();
+        pterodactyl.setApiKey(credentials.api_key);
+        pterodactyl.setServerId(serverId);
+        setCode(await pterodactyl.files.getContent(path));
+      }
 
-    if (serverId && path) {
-      startupApp();
-    }
-  }, [serverId, path]);
+      if (serverId && path) {
+        startupApp();
+      }
+    },
+    [serverId, path]
+  );
 
   return (
     <>
-      <BreadCrumbs>
-        <li>
-          <div className="mr-2">
-            <ServerIcon />
-          </div>
-          {serverId}
-        </li>
-        <li>
-          <a href={`/files?serverid=${serverId}&path=/`}>
+      <div className="flex mb-4">
+        <BreadCrumbs>
+          <li>
             <div className="mr-2">
-              <FolderIcon />
+              <ServerIcon />
             </div>
-            <span>/</span>
-          </a>
-        </li>
-        {path
-          .split("/")
-          .filter((p) => p !== "")
-          .map((element, index) => {
-            const tmp_path = path
-              .split("/")
-              .slice(0, index + 2)
-              .join("/");
-            return (
-              <li key={index}>
-                <a href={`/files?serverid=${serverId}&path=${tmp_path}`}>
-                  <div className="mr-2">
-                    <FolderIcon />
-                  </div>
-                  <span>{element}</span>
-                </a>
-              </li>
-            );
-          })}
-      </BreadCrumbs>
+            {serverId}
+          </li>
+          <li>
+            <a href={`/files?serverid=${serverId}&path=/`}>
+              <div className="mr-2">
+                <FolderIcon />
+              </div>
+              <span>/</span>
+            </a>
+          </li>
+          {path
+            .split("/")
+            .filter((p) => p !== "")
+            .map((element, index) => {
+              const tmp_path = path
+                .split("/")
+                .slice(0, index + 2)
+                .join("/");
+              return (
+                <li key={index}>
+                  <a href={`/files?serverid=${serverId}&path=${tmp_path}`}>
+                    <div className="mr-2">
+                      <FolderIcon />
+                    </div>
+                    <span>{element}</span>
+                  </a>
+                </li>
+              );
+            })}
+        </BreadCrumbs>
+        <button className="ml-auto btn btn-accent">Save</button>
+      </div>
       <TextEditor code={code} />
     </>
   );