elysium/minecluster
elysium/minecluster
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[REV] Switch to use IDS over server names

Browse source
This commit is contained in:
Dunemask 2023-12-22 14:45:49 -07:00
parent e94aca7c96
commit 91587f66b2
21 changed files with 196 additions and 221 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/files/MineclusterFiles.jsx
View file

@ -33,14 +33,14 @@ export default function MineclusterFiles(props) {
],
[],
);
const { server: serverName } = props;
const { server: serverId } = props;
const inputRef = useRef(null);
const [dirStack, setDirStack] = useState(["."]);
const [files, setFiles] = useState([]);
const updateFiles = () => {
const dir = dirStack.join("/");
getServerFiles(serverName, dir).then((f) => {
getServerFiles(serverId, dir).then((f) => {
const files = f.map((fi) => ({ ...fi, id: `${dir}/${fi.name}` }));
setFiles(files ?? []);
});
@ -70,13 +70,13 @@ export default function MineclusterFiles(props) {
function createFolder() {
const name = prompt("What is the name of the new folder?");
const path = [...dirStack, name].join("/");
createServerFolder(serverName, path).then(updateFiles);
createServerFolder(serverId, path).then(updateFiles);
}
function deleteItems(files) {
Promise.all(
files.map((f) =>
deleteServerItem(serverName, [...dirStack, f.name].join("/"), f.isDir),
deleteServerItem(serverId, [...dirStack, f.name].join("/"), f.isDir),
),
)
.catch((e) => console.error("Error deleting some files!", e))
@ -94,7 +94,7 @@ export default function MineclusterFiles(props) {
async function uploadFile(file) {
const formData = new FormData();
formData.append("file", file);
formData.append("name", serverName);
formData.append("id", serverId);
formData.append("path", [...dirStack, name].join("/"));
await fetch("/api/files/upload", {
method: "POST",
@ -105,7 +105,7 @@ export default function MineclusterFiles(props) {
async function downloadFiles(files) {
Promise.all(
files.map((f) =>
getServerItem(serverName, f.name, [...dirStack, f.name].join("/")),
getServerItem(serverId, f.name, [...dirStack, f.name].join("/")),
),
)
.then(() => console.log("Done downloading files!"))

5
src/components/servers/RconDialog.jsx
View file

@ -16,7 +16,8 @@ export function useRconDialog(isOpen = false) {
}
export default function RconDialog(props) {
const { serverName, open, dialogToggle } = props;
const { server, open, dialogToggle } = props;
const { name: serverName, id: serverId } = server ?? {};
const theme = useTheme();
const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
return (
@ -33,7 +34,7 @@ export default function RconDialog(props) {
<Toolbar sx={{ display: { sm: "none" } }} />
<DialogTitle>RCON - {serverName}</DialogTitle>
<DialogContent>
<RconView serverName={serverName} />
<RconView serverId={serverId} />
</DialogContent>
<DialogActions>
<Button autoFocus onClick={dialogToggle}>

4
src/components/servers/RconSocket.js
View file

@ -1,7 +1,7 @@
import { io } from "socket.io-client";
export default class RconSocket {
constructor(logUpdate, serverName) {
(this.sk = io("/", { query: { serverName } })), (this.logs = []);
constructor(logUpdate, serverId) {
(this.sk = io("/", { query: { serverId } })), (this.logs = []);
this.logUpdate = logUpdate;
this.sk.on("push", this.onPush.bind(this));
this.sk.on("connect", this.onConnect.bind(this));

4
src/components/servers/RconView.jsx
View file

@ -6,14 +6,14 @@ import RconSocket from "./RconSocket.js";
import "@mcl/css/rcon.css";
export default function RconView(props) {
const { serverName } = props;
const { serverId } = props;
const logsRef = useRef(0);
const [cmd, setCmd] = useState("");
const [logs, setLogs] = useState([]);
const [rcon, setRcon] = useState({});
const updateCmd = (e) => setCmd(e.target.value);
useEffect(function () {
setRcon(new RconSocket(setLogs, serverName));
setRcon(new RconSocket(setLogs, serverId));
return () => {
if (rcon && typeof rcon.disconnect === "function") rcon.disconnect();
};

12
src/components/servers/ServerCard.jsx
View file

@ -19,10 +19,10 @@ import { Link } from "react-router-dom";
export default function ServerCard(props) {
const { server, openRcon } = props;
const { name, metrics, ftpAvailable, serverAvailable, services } = server;
const startServer = useStartServer(name);
const stopServer = useStopServer(name);
const deleteServer = useDeleteServer(name);
const { name, id, metrics, ftpAvailable, serverAvailable, services } = server;
const startServer = useStartServer(id);
const stopServer = useStopServer(id);
const deleteServer = useDeleteServer(id);
function toggleRcon() {
if (!services.includes("server")) return;
openRcon();
@ -113,7 +113,7 @@ export default function ServerCard(props) {
aria-label="Edit"
size="large"
component={Link}
to={`/mcl/edit?server=${name}`}
to={`/mcl/edit?server=${id}`}
>
<EditIcon />
</IconButton>
@ -122,7 +122,7 @@ export default function ServerCard(props) {
aria-label="Files"
size="large"
component={Link}
to={`/mcl/files?server=${name}`}
to={`/mcl/files?server=${id}`}
disabled={!services.includes("ftp")}
>
<FolderIcon />

4
src/pages/Home.jsx
View file

@ -50,10 +50,10 @@ export default function Home() {
<Box className="servers">
{!isLoading &&
servers.map((s, k) => (
<ServerCard key={k} server={s} openRcon={openRcon(s.name)} />
<ServerCard key={k} server={s} openRcon={openRcon(s)} />
))}
</Box>
<RconDialog open={rdOpen} dialogToggle={rconToggle} serverName={server} />
<RconDialog open={rdOpen} dialogToggle={rconToggle} server={server} />
<Button
component={Link}
to="/mcl/create"

40
src/util/queries.js
View file

@ -20,38 +20,38 @@ const fetchApiPost = (subPath, json) => async () =>
body: JSON.stringify(json),
}).then((res) => res.json());
export const useServerStatus = (server) =>
export const useServerStatus = (serverId) =>
useQuery({
queryKey: [`server-status-${server}`],
queryFn: fetchApiPost("/server/status", { name: server }),
queryKey: [`server-status-${serverId}`],
queryFn: fetchApiPost("/server/status", { id: serverId }),
});
export const useServerMetrics = (server) =>
export const useServerMetrics = (serverId) =>
useQuery({
queryKey: [`server-metrics-${server}`],
queryFn: fetchApiPost("/server/metrics", { name: server }),
queryKey: [`server-metrics-${serverId}`],
queryFn: fetchApiPost("/server/metrics", { id: serverId }),
refetchInterval: 10000,
});
export const useStartServer = (server) =>
postJsonApi("/server/start", { name: server }, "server-instances");
export const useStopServer = (server) =>
postJsonApi("/server/stop", { name: server }, "server-instances");
export const useDeleteServer = (server) =>
postJsonApi("/server/delete", { name: server }, "server-instances", "DELETE");
export const useStartServer = (serverId) =>
postJsonApi("/server/start", { id: serverId }, "server-instances");
export const useStopServer = (serverId) =>
postJsonApi("/server/stop", { id: serverId }, "server-instances");
export const useDeleteServer = (serverId) =>
postJsonApi("/server/delete", { id: serverId }, "server-instances", "DELETE");
export const useCreateServer = (spec) =>
postJsonApi("/server/create", spec, "server-list");
export const getServerFiles = async (server, path) =>
fetchApiCore("/files/list", { name: server, path }, "POST", true);
export const createServerFolder = async (server, path) =>
export const getServerFiles = async (serverId, path) =>
fetchApiCore("/files/list", { id: serverId, path }, "POST", true);
export const createServerFolder = async (serverId, path) =>
fetchApiCore("/files/folder", {
name: server,
id: serverId,
path,
});
export const deleteServerItem = async (server, path, isDir) =>
fetchApiCore("/files/item", { name: server, path, isDir }, "DELETE");
export const deleteServerItem = async (serverId, path, isDir) =>
fetchApiCore("/files/item", { id: serverId, path, isDir }, "DELETE");
export const getServerItem = async (server, name, path) =>
fetchApiCore("/files/item", { name: server, path })
export const getServerItem = async (serverId, name, path) =>
fetchApiCore("/files/item", { id: serverId, path })
.then((resp) =>
resp.status === 200
? resp.blob()