fix

app/app/files/edit/page.tsx

@@ -4,7 +4,9 @@ import React, { useCallback } from "react";
 
 import { useSearchParams } from "next/navigation";
 import TextEditor from "@/components/TextEditor";
-import BreadCrumbs from "@/components/FilesEditor/BreadCrumbs";
+import BreadCrumbs from "@/components/BreadCrumbs";
+import ServerIcon from "@/components/Icons/Server";
+import FolderIcon from "@/components/Icons/Folder";
 
 function Page() {
   const searchParams = useSearchParams();
@@ -17,11 +19,41 @@ function Page() {
 
   return (
     <>
-      <BreadCrumbs
-        changeDirectory={changeDirectory}
-        serverId={serverId}
-        path={path}
-      />
+      <BreadCrumbs>
+        <li>
+          <div className="mr-2">
+            <ServerIcon />
+          </div>
+          {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>
       <TextEditor />;
     </>
   );

app/components/FilesEditor/index.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { formatDistanceToNow } from "date-fns";
-import React, { useEffect, useState, useCallback } from "react";
+import React, { useEffect, useState, useCallback, useMemo } from "react";
 import DocumentIcon from "@/components/Icons/Document";
 import FolderIcon from "@/components/Icons/Folder";
 import ServerIcon from "@/components/Icons/Server";
@@ -11,7 +11,6 @@ import RenamePopup from "./ContextMenu/rename";
 import Pterodactyl from "@/components/Pterodactyl";
 import BreadCrumbs from "@/components/BreadCrumbs";
 import { useSearchParams } from "next/navigation";
-import Link from "next/link";
 
 interface FileAttributes {
   name: string;
@@ -47,7 +46,9 @@ const initialRenamePopupState: RenamePopupState = {
 };
 
 const Index = () => {
-  const [apiKey, setApiKey] = useState<string>("");
+  const [apiKey, setApiKey] = useState<string>(
+    "ptlc_N77A2hEczFmSwGXm4cEXh4Gw3ZP0Ygr5NaBkGlE7pjU"
+  );
   const [fileList, setFileList] = useState<FileProps[]>([]);
   const [contextMenu, setContextMenu] = useState<ContextMenuState>(
     initialContextMenuState
@@ -57,14 +58,9 @@ const Index = () => {
   );
   const [selectedFile, setSelectedFile] = useState<FileProps | null>(null);
   const [ptero, setPtero] = useState<Pterodactyl | null>(null);
-  const [path, setPath] = useState<string>("/");
   const urlParams = useSearchParams();
   const serverId = urlParams.get("serverid");
-  const pathParam = urlParams.get("path");
-
-  const setCredentials = useCallback(() => {
-    setApiKey("ptlc_N77A2hEczFmSwGXm4cEXh4Gw3ZP0Ygr5NaBkGlE7pjU");
-  }, []);
+  const pathParam = urlParams.get("path") || "/";
 
   const showRenamePopup = useCallback(() => {
     setContextMenu(initialContextMenuState);
@@ -76,6 +72,7 @@ const Index = () => {
   }, []);
 
   const fetchFiles = useCallback(async (ptero: Pterodactyl) => {
+    console.log("chwytam pliki");
     const files = await ptero.files.fetchFiles();
     setFileList(files);
   }, []);
@@ -108,7 +105,7 @@ const Index = () => {
       if (ptero) {
         ptero.helpers.setWorkingDirectory(newPath);
         fetchFiles(ptero);
-        setPath(newPath);
+        // setPath(newPath);
       }
     },
     [ptero, fetchFiles]
@@ -116,20 +113,19 @@ const Index = () => {
 
   useEffect(() => {
     const setupApplication = async () => {
-      await setCredentials();
-      if (apiKey && serverId) {
-        const pteroInstance = new Pterodactyl(serverId, apiKey);
-        if (pathParam) {
-          setPath(pathParam);
-        }
-        pteroInstance.helpers.setWorkingDirectory(path);
+      if (!apiKey || !serverId) return; // Upewniamy się, że mamy apiKey i serverId
+      if (!ptero) {
+        console.log("tworze instancje ptero");
+        const pteroInstance = await new Pterodactyl(serverId, apiKey);
         setPtero(pteroInstance);
-        await fetchFiles(pteroInstance);
+
+        pteroInstance.helpers.setWorkingDirectory(pathParam);
+        await fetchFiles(pteroInstance); // Wywołanie fetchFiles raz po ustawieniu instancji
       }
     };
 
     setupApplication();
-  }, [apiKey, serverId, setCredentials, path, fetchFiles]);
+  }, [apiKey, serverId, ptero, pathParam, fetchFiles]);
 
   return (
     <>
@@ -168,11 +164,11 @@ const Index = () => {
                 <span>/</span>
               </a>
             </li>
-            {path
+            {pathParam
               .split("/")
               .filter((p) => p !== "")
               .map((element, index) => {
-                const tmp_path = path
+                const tmp_path = pathParam
                   .split("/")
                   .slice(0, index + 2)
                   .join("/");
@@ -223,7 +219,7 @@ const Index = () => {
               {file.attributes.is_file ? (
                 <a
                   href={`/files/edit?serverid=${serverId}&path=${
-                    path != "/" ? path : ""
+                    pathParam != "/" ? pathParam : ""
                   }/${file.attributes.name}`}
                 >
                   {file.attributes.name}
@@ -231,7 +227,7 @@ const Index = () => {
               ) : (
                 <a
                   href={`/files?serverid=${serverId}&path=${
-                    path != "/" ? path : ""
+                    pathParam != "/" ? pathParam : ""
                   }/${file.attributes.name}`}
                 >
                   {file.attributes.name}