diff --git a/src/MCL.jsx b/src/MCL.jsx index c24ec3e..e15b85e 100644 --- a/src/MCL.jsx +++ b/src/MCL.jsx @@ -1,4 +1,6 @@ // Imports +import { ThemeProvider } from "@mui/material/styles"; +import mclTheme from "./util/theme.js"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { SettingsProvider } from "@mcl/settings"; import Viewport from "./nav/Viewport.jsx"; @@ -11,9 +13,11 @@ export default function MCL() {
- - - + + + + +
diff --git a/src/overview/Overview.jsx b/src/components/overview/Overview.jsx similarity index 100% rename from src/overview/Overview.jsx rename to src/components/overview/Overview.jsx diff --git a/src/overview/OverviewVisual.jsx b/src/components/overview/OverviewVisual.jsx similarity index 100% rename from src/overview/OverviewVisual.jsx rename to src/components/overview/OverviewVisual.jsx diff --git a/src/servers/RconDialog.jsx b/src/components/servers/RconDialog.jsx similarity index 100% rename from src/servers/RconDialog.jsx rename to src/components/servers/RconDialog.jsx diff --git a/src/servers/RconSocket.js b/src/components/servers/RconSocket.js similarity index 100% rename from src/servers/RconSocket.js rename to src/components/servers/RconSocket.js diff --git a/src/servers/RconView.jsx b/src/components/servers/RconView.jsx similarity index 100% rename from src/servers/RconView.jsx rename to src/components/servers/RconView.jsx diff --git a/src/servers/ServerCard.jsx b/src/components/servers/ServerCard.jsx similarity index 100% rename from src/servers/ServerCard.jsx rename to src/components/servers/ServerCard.jsx diff --git a/public/css/overview.css b/src/css/overview.css similarity index 100% rename from public/css/overview.css rename to src/css/overview.css diff --git a/public/css/rcon.css b/src/css/rcon.css similarity index 100% rename from public/css/rcon.css rename to src/css/rcon.css diff --git a/public/css/server-card.css b/src/css/server-card.css similarity index 100% rename from public/css/server-card.css rename to src/css/server-card.css diff --git a/src/nav/MCLMenu.jsx b/src/nav/MCLMenu.jsx index a80092a..2c58fbf 100644 --- a/src/nav/MCLMenu.jsx +++ b/src/nav/MCLMenu.jsx @@ -13,7 +13,7 @@ import IconButton from "@mui/material/IconButton"; import Typography from "@mui/material/Typography"; import MenuIcon from "@mui/icons-material/Menu"; import Drawer from "@mui/material/Drawer"; -import ListItemIcon from "@mui/material/ListItemIcon"; +import HomeIcon from "@mui/icons-material/Home"; import ListItemText from "@mui/material/ListItemText"; import List from "@mui/material/List"; import ListItemButton from "@mui/material/ListItemButton"; @@ -36,11 +36,27 @@ export default function MCLMenu() { theme.zIndex.modal + 2 - (isDrawer ? 1 : 0); return ( - + - - {navHeader()} + + + + + + {navHeader()}{" "} + diff --git a/src/nav/Viewport.jsx b/src/nav/Viewport.jsx index af78dff..a6b7622 100644 --- a/src/nav/Viewport.jsx +++ b/src/nav/Viewport.jsx @@ -1,6 +1,8 @@ import Box from "@mui/material/Box"; import Toolbar from "@mui/material/Toolbar"; import MCLPortal from "./MCLPortal.jsx"; +import Button from "@mui/material/Button"; +import SpeedDialIcon from "@mui/material/SpeedDialIcon"; // Import Navbar /*import Navbar from "./Navbar.jsx";*/ import MCLMenu from "./MCLMenu.jsx"; diff --git a/src/pages/Create.jsx b/src/pages/Create.jsx index 0338087..b42e3fe 100644 --- a/src/pages/Create.jsx +++ b/src/pages/Create.jsx @@ -1,13 +1,12 @@ import Box from "@mui/material/Box"; import CreateOptions from "./CreateOptions.jsx"; -export default function Create(){ - return ( - - {/**/} - {/**/} - - - ); - +export default function Create() { + return ( + + {/**/} + + + + + ); } - diff --git a/src/pages/CreateOptions.jsx b/src/pages/CreateOptions.jsx index ea66102..51b0705 100644 --- a/src/pages/CreateOptions.jsx +++ b/src/pages/CreateOptions.jsx @@ -1,4 +1,5 @@ import { useState, useEffect } from "react"; +import Autocomplete from "@mui/material/Autocomplete"; import TextField from "@mui/material/TextField"; import Box from "@mui/material/Box"; import Button from "@mui/material/Button"; @@ -20,6 +21,8 @@ const defaultServer = { }; export default function Create() { + const [wl, setWl] = useState([]); + const [spec, setSpec] = useState(defaultServer); const versionList = useVersionList(); const [versions, setVersions] = useState(["latest"]); @@ -42,6 +45,9 @@ export default function Create() { const coreUpdate = (attr) => (e) => updateSpec(attr, e.target.value); + const whitelistUpdate = (e) => alert("Whitelist not Implimented"); + const opUpdate = (e) => alert("Op not implimented"); + function upsertSpec() { if (validateSpec() !== "validated") return; createServer(spec); @@ -60,23 +66,31 @@ export default function Create() { } return ( - - - + + - + {versions.map((v, k) => ( @@ -109,9 +123,16 @@ export default function Create() { Hard - + } + /> - + {/**/} Spectator - + {/**/} - ); } diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx index d94f78f..d076200 100644 --- a/src/pages/Home.jsx +++ b/src/pages/Home.jsx @@ -1,9 +1,14 @@ +import { Link } from "react-router-dom"; import { useState, useEffect } from "react"; import Box from "@mui/material/Box"; import Typography from "@mui/material/Typography"; -import ServerCard from "../servers/ServerCard.jsx"; -import RconDialog, { useRconDialog } from "../servers/RconDialog.jsx"; -import Overview from "../overview/Overview.jsx"; +import ServerCard from "@mcl/components/servers/ServerCard.jsx"; +import RconDialog, { + useRconDialog, +} from "@mcl/components/servers/RconDialog.jsx"; +import Overview from "@mcl/components/overview/Overview.jsx"; +import Button from "@mui/material/Button"; +import SpeedDialIcon from "@mui/material/SpeedDialIcon"; import "@mcl/css/server-card.css"; import "@mcl/css/overview.css"; import { useServerInstances } from "@mcl/queries"; @@ -53,7 +58,23 @@ export default function Home() { dialogToggle={rconToggle} serverName={server} /> - + ); } diff --git a/src/util/queries.js b/src/util/queries.js index 9636fe4..6a45f07 100644 --- a/src/util/queries.js +++ b/src/util/queries.js @@ -14,13 +14,13 @@ const fetchApiPost = (subPath, json) => async () => export const useServerStatus = (server) => useQuery( [`server-status-${server}`], - fetchApiPost("/server/status", { name: server }) + fetchApiPost("/server/status", { name: server }), ); export const useServerMetrics = (server) => useQuery( [`server-metrics-${server}`], fetchApiPost("/server/metrics", { name: server }), - { refetchInterval: 10000 } + { refetchInterval: 10000 }, ); export const useStartServer = (server) => postJsonApi("/server/start", { name: server }, "server-instances"); @@ -41,8 +41,8 @@ export const useSystemAvailable = () => export const useVersionList = () => useQuery(["minecraft-versions"], () => fetch("https://piston-meta.mojang.com/mc/game/version_manifest.json").then( - (r) => r.json() - ) + (r) => r.json(), + ), ); const postJsonApi = (subPath, body, invalidate, method = "POST") => { diff --git a/src/util/theme.js b/src/util/theme.js new file mode 100644 index 0000000..26347a4 --- /dev/null +++ b/src/util/theme.js @@ -0,0 +1,16 @@ +// Generated using https://zenoo.github.io/mui-theme-creator/ +import { createTheme } from "@mui/material/styles"; + +const themeOptions = { + palette: { + mode: "light", + primary: { + main: "rgba(109,216,144,255)", + }, + secondary: { + main: "#f50057", + }, + }, +}; + +export default createTheme(themeOptions); diff --git a/vite.config.js b/vite.config.js index c71a2b2..a0f6847 100644 --- a/vite.config.js +++ b/vite.config.js @@ -26,10 +26,11 @@ export default () => { base: "/mcl/", resolve: { alias: { - "@mcl/css": path.resolve("./public/css"), + "@mcl/css": path.resolve("./src/css"), "@mcl/settings": path.resolve("./src/ctx/SettingsContext.jsx"), "@mcl/pages": path.resolve("./src/pages"), "@mcl/queries": path.resolve("./src/util/queries.js"), + "@mcl/components": path.resolve("./src/components"), "@mcl": path.resolve("./src"), }, },