[CHORE] Fix styling inconsistencies

lib/controllers/lifecycle-controller.js

@@ -11,10 +11,10 @@ import { toggleServer } from "../k8s/k8s-server-control.js";
 function payloadFilter(req, res) {
   const serverSpec = req.body;
   if (!serverSpec) return res.sendStatus(400);
-  const { name, url, version, serverType, difficulty, gamemode, memory } =
+  const { name, host, version, serverType, difficulty, gamemode, memory } =
     serverSpec;
   if (!name) return res.status(400).send("Server name is required!");
-  if (!url) return res.status(400).send("Server url is required!");
+  if (!host) return res.status(400).send("Server host is required!");
   if (!version) return res.status(400).send("Server version is required!");
   if (!difficulty)
     return res.status(400).send("Server difficulty is required!");

lib/k8s/server-create.js

@@ -45,7 +45,7 @@ function createServerVolume(serverSpec) {
 }
 
 function createServerDeploy(serverSpec) {
-  const { name } = serverSpec;
+  const { name, host } = serverSpec;
   const deployYaml = loadYaml("lib/k8s/configs/server-deployment.yml");
   const { metadata } = deployYaml;
   const serverContainer = getServerContainer(serverSpec);
@@ -67,24 +67,27 @@ function createServerDeploy(serverSpec) {
     ({ name }) => name === "datadir",
   ).persistentVolumeClaim.claimName = `mcl-${name}-volume`;
 
-  // Apply Containers
+  // Apply Containers  TODO: User control for autostart
   deployYaml.spec.template.spec.containers.push(serverContainer);
   deployYaml.spec.template.spec.containers.push(ftpContainer);
-  // TODO: User control for autostart
+  deployYaml.spec.replicas = 1;
-  deployYaml.spec.replicas = 0;
   return deployYaml;
 }
 
 function createServerService(serverSpec) {
-  const { name, url } = serverSpec;
+  const { name, host } = serverSpec;
   const serviceYaml = loadYaml("lib/k8s/configs/server-svc.yml");
-  serviceYaml.metadata.annotations["ingress.qumine.io/hostname"] = url;
+  serviceYaml.metadata.annotations["ingress.qumine.io/hostname"] = host;
+  serviceYaml.metadata.annotations["mc-router.itzg.me/externalServerName"] =
+    host;
   serviceYaml.metadata.labels.app = `mcl-${name}-app`;
   serviceYaml.metadata.name = `mcl-${name}-server`;
   serviceYaml.metadata.namespace = namespace;
   serviceYaml.metadata.annotations["minecluster.dunemask.net/server-name"] =
     name;
   serviceYaml.spec.selector.app = `mcl-${name}-app`;
+  // Port List:
+  const serverPortList = [{ p: 25565, n: "minecraft" }];
 
   // Apply FTP Port List
   const ftpPortList = [
@@ -93,7 +96,9 @@ function createServerService(serverSpec) {
   ];
   for (var p = 40000; p <= 40009; p++)
     ftpPortList.push({ p, n: `ftp-passive-${p - 40000}` });
-  serviceYaml.spec.ports = ftpPortList.map(({ p: port, n: name }) => ({
+
+  const portList = [...serverPortList, ...ftpPortList];
+  serviceYaml.spec.ports = portList.map(({ p: port, n: name }) => ({
     port,
     name,
     protocol: "TCP",

src/components/files/MineclusterFiles.jsx

@@ -18,6 +18,8 @@ import {
   getServerItem,
 } from "@mcl/queries";
 
+import "@mcl/css/header.css";
+
 export default function MineclusterFiles(props) {
   // Chonky configuration
   setChonkyDefaults({ iconComponent: ChonkyIconFA });

src/css/header.css

@@ -0,0 +1,31 @@
+.appbar-items {
+  font-size: 1.25rem;
+  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+  font-weight: 500;
+  line-height: 1.6;
+  letter-spacing: 0.0075em;
+}
+
+.view > header {
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  box-shadow:
+    0px 2px 4px -1px rgba(0, 0, 0, 0.2),
+    0px 4px 5px 0px rgba(0, 0, 0, 0.14),
+    0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  box-sizing: border-box;
+  flex-shrink: 0;
+  position: fixed;
+  top: 0;
+  left: auto;
+  right: 0;
+  color: rgba(0, 0, 0, 0.87);
+  z-index: 1302;
+  background-color: black;
+}
+.view > header > div > div > a {
+  height: 40px;
+  width: 40px;
+}

src/nav/MCLMenu.jsx

@@ -42,22 +42,17 @@ export default function MCLMenu() {
       sx={{ zIndex: drawerIndex(), bgcolor: "black" }}
       enableColorOnDark={true}
     >
-      <Box sx={{ flexGrow: 1, margin: "0 20px" }}>
+      <Box
+        sx={{ flexGrow: 1, margin: "0 20px", color: "white" }}
+        className="appbar-items"
+      >
         <Toolbar disableGutters>
-          <Typography
+          <IconButton component={Link} to="/" color="inherit">
-            variant="h6"
+            <HomeIcon />
-            noWrap
+          </IconButton>
-            component="div"
+          <span style={{ margin: "auto 0", color: "inherit" }}>
-            sx={{ flexGrow: 1, display: "flex" }}
+            {navHeader()}
-            color="white"
+          </span>
-          >
-            <IconButton component={Link} to="/" color="inherit">
-              <HomeIcon />
-            </IconButton>
-            <span style={{ margin: "auto 0", color: "inherit" }}>
-              {navHeader()}{" "}
-            </span>
-          </Typography>
         </Toolbar>
       </Box>
     </AppBar>

src/pages/CreateOptions.jsx

@@ -97,7 +97,7 @@ export default function Create() {
     console.log("TODO CREATE VALIDATION");
     if (!spec.name) return alertValidationError("Name not included");
     if (!spec.version) return alertValidationError("Version cannot be blank");
-    if (!spec.url) return alertValidationError("Url cannot be blank");
+    if (!spec.host) return alertValidationError("Host cannot be blank");
     return "validated";
   }
 
@@ -121,7 +121,7 @@ export default function Create() {
         />
         <TextField
           label="Host"
-          onChange={coreUpdate("url")}
+          onChange={coreUpdate("host")}
           helperText="Example: host.mc.example.com"
           FormHelperTextProps={{ sx: { ml: 0 } }}
           required