azukaar · azukaar · Nov 27, 2023 · Jan 21, 2024 · Jan 21, 2024 · Jan 21, 2024
diff --git a/.clabot b/.clabot
@@ -1,4 +1,4 @@
 {
-  "contributors": ["azukaar", "jwr1", "Jogai", "InterN0te", "catmandx", "revam"],
+  "contributors": ["azukaar", "jwr1", "Jogai", "InterN0te", "catmandx", "revam", "Kawanaao"],
   "message": "We require contributors to sign our [Contributor License Agreement](https://github.com/azukaar/Cosmos-Server/blob/master/cla.md). In order for us to review and merge your code, add yourself to the .clabot file as contributor, as a way of signing the CLA."
 }
diff --git a/changelog.md b/changelog.md
@@ -1,3 +1,28 @@
+## Version 0.14.0
+ - Cosmos is now fully functional dockerless
+ - Reworked Cosmos Compose for better compatibility with docker-compose.yml files
+ - Added a "compose" tab to edit containers in text mode
+ - Moved critical data (credentials and VPN) out of the database, to keep Cosmos online in case of incidents
+ - Added an auto .zip backup mechanism
+ - Added a syntax highlighter to the compose editor
+ - New Database "puppet" mode that allows Cosmos to manage the database for you
+ - Improved network IP resolution for containers, including supporting any network mode
+ - Added support for markets and template directly with docker-compose.yml files
+ - Add whitelist and constellation restriction options to the admin panel 
+ - Force low RAM usage on the MongoDB container (we don't need much!)
+ - Removed all sort of container bootstrapping (much faster boot)
+ - Added image clean up
+ - Replaced network clean up by vanilla docker prune
+ - Fix issue with removing IP whitelist
+ - Add UI to create MCVlan networks
+ - Add a log file in config folder for the selfupdater
+ - Add a migration script to host mode
+ - UI optimizations (thanks @Kawanaao)
+ - Add duplicate filter on store listing
+ - Fixed an issue where container picker would select 'null' as container
+ - Fix bug where Enabled checkbox was broken after a search
+ - remove mac address when switching to host mode
+
 ## Version 0.13.2
  - Fix display issue with fault network configurations
 

diff --git a/client/index.html b/client/index.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
+    <meta http-equiv="expires" content="0">
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Cosmos</title>

diff --git a/client/src/PrivateRoute.jsx b/client/src/PrivateRoute.jsx
@@ -0,0 +1,18 @@
+import { Suspense } from "react"
+import { Await, Navigate } from "react-router"
+import isLoggedIn from "./isLoggedIn"
+
+function PrivateRoute({ children }) {
+  return <Suspense>
+    <Await resolve={isLoggedIn()}>
+      {authStatus => {
+        switch (authStatus) {
+          case "OK": return children
+          default: return <Navigate to={authStatus} replace />
+        }
+      }}
+    </Await>
+  </Suspense>
+}
+
+export default PrivateRoute
diff --git a/client/src/api/authentication.jsx b/client/src/api/authentication.jsx
@@ -11,7 +11,7 @@ function login(values) {
 }
 
 function me() {
-  return fetch('/cosmos/api/me/', {
+  return fetch('/cosmos/api/me', {
     method: 'GET',
     headers: {
         'Content-Type': 'application/json'
@@ -21,7 +21,7 @@ function me() {
 }
 
 function logout() {
-  return wrap(fetch('/cosmos/api/logout/', {
+  return wrap(fetch('/cosmos/api/logout', {
     method: 'GET',
     headers: {
         'Content-Type': 'application/json'

diff --git a/client/src/api/docker.jsx b/client/src/api/docker.jsx
@@ -1,4 +1,5 @@
 import wrap from './wrap';
+import yaml from 'js-yaml';
 
 function list() {
   return wrap(fetch('/cosmos/api/servapps', {
@@ -100,6 +101,16 @@ const manageContainer = (containerId, action) => {
   }))
 }
 
+function migrateHost(values) {
+  return wrap(fetch('/cosmos/api/migrate-host', {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    body: JSON.stringify(values),
+  }))
+}
+
 function updateContainer(containerId, values) {
   return wrap(fetch('/cosmos/api/servapps/' + containerId + '/update', {
     method: 'POST',
@@ -110,6 +121,16 @@ function updateContainer(containerId, values) {
   }))
 }
 
+function exportContainer(containerId, values) {
+  return wrap(fetch('/cosmos/api/servapps/' + containerId + '/export', {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    body: JSON.stringify(values),
+  }))
+}
+
 function listContainerNetworks(containerId) {
   return wrap(fetch('/cosmos/api/servapps/' + containerId + '/networks', {
     method: 'GET',
@@ -348,4 +369,6 @@ export {
   pullImage,
   autoUpdate,
   updateContainerImage,
+  exportContainer,
+  migrateHost,
 };
diff --git a/client/src/api/wrap.js b/client/src/api/wrap.js
@@ -4,7 +4,17 @@ export default function wrap(apicall, noError = false) {
   return apicall.then(async (response) => {
     let rep;
     try {
-      rep = await response.json();
+      rep = await response.text();
+
+      try {
+        rep = JSON.parse(rep);
+      } catch (err) {
+        rep = {
+          message: rep,
+          status: response.status,
+          code: response.status
+        };
+      }
     } catch (err) {
       if (!noError) {
         snackit('Server error');

diff --git a/client/src/components/MainCard.jsx b/client/src/components/MainCard.jsx
@@ -53,12 +53,6 @@ const MainCard = forwardRef(
                     ':hover': {
                         boxShadow: boxShadow ? shadow || theme.customShadows.z1 : 'inherit'
                     },
-                    '& pre': {
-                        m: 0,
-                        p: '16px !important',
-                        fontFamily: theme.typography.fontFamily,
-                        fontSize: '0.75rem'
-                    }
                 }}
             >
                 {/* card header and action */}

diff --git a/client/src/components/apiModal.jsx b/client/src/components/apiModal.jsx
@@ -15,7 +15,7 @@ const preStyle = {
   padding: '10px',
   borderRadius: '5px',
   overflow: 'auto',
-  maxHeight: '500px',
+  maxHeight: '520px',
   maxWidth: '100%',
   width: '100%',
   margin: '0',

diff --git a/client/src/components/logLine.jsx b/client/src/components/logLine.jsx
@@ -10,8 +10,8 @@ function decodeUnicode(str) {
 const LogLine = ({ message, docker, isMobile }) => {
   let html = decodeUnicode(message)
     .replace('\u0001\u0000\u0000\u0000\u0000\u0000\u0000', '')
+    .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
     .replace(/(?:\r\n|\r|\n)/g, '<br>')
-    .replace(/ /g, '&nbsp;')
     .replace(/�/g, '')
     .replace(/\x1b\[([0-9]{1,2}(?:;[0-9]{1,2})*)?m/g, (match, p1) => {
       if (!p1) {

diff --git a/client/src/components/logsInModal.jsx b/client/src/components/logsInModal.jsx
@@ -16,7 +16,7 @@ const preStyle = {
   padding: '10px',
   borderRadius: '5px',
   overflow: 'auto',
-  maxHeight: '500px',
+  maxHeight: '520px',
   maxWidth: '100%',
   width: '100%',
   margin: '0',

diff --git a/client/src/components/persistentInput.jsx b/client/src/components/persistentInput.jsx
@@ -0,0 +1,27 @@
+import { Checkbox } from "@mui/material";
+import { useEffect } from "react";
+
+export const PersistentCheckbox = ({ name, label, value, onChange }) => {
+  let eKey = "PersistentCheckbox-" + name;
+
+  useEffect(() => {
+    if (localStorage.getItem(eKey) === null) {
+      localStorage.setItem(eKey, value);
+    } else {
+      onChange(localStorage.getItem(eKey) === "true");
+    }
+  }, [name, value]);
+
+  const handleChange = (e) => {
+    onChange(e.target.checked);
+    localStorage.setItem(eKey, e.target.checked);
+  }
+
+  return (
+    <div style={{ display: 'flex', alignItems: 'center' }}>
+      <input type="checkbox" name={name} hidden value={value} checked={value} />
+      <Checkbox onChange={handleChange} checked={value} />
+      {label}
+    </div>
+  );
+}
diff --git a/client/src/components/third-party/Highlighter.jsx b/client/src/components/third-party/Highlighter.jsx
@@ -1,12 +1,12 @@
 import PropTypes from 'prop-types';
-import { useState } from 'react';
+import { lazy, useState } from 'react';
 
 // material-ui
 import { Box, CardActions, Collapse, Divider, IconButton, Tooltip } from '@mui/material';
 
 // third-party
 import { CopyToClipboard } from 'react-copy-to-clipboard';
-import reactElementToJSXString from 'react-element-to-jsx-string';
+const reactElementToJSXString = lazy(() => import('react-element-to-jsx-string'));
 
 // project import
 import SyntaxHighlight from '../../utils/SyntaxHighlight';

diff --git a/client/src/isLoggedIn.jsx b/client/src/isLoggedIn.jsx
@@ -1,25 +1,25 @@
 
 import * as API from './api';
-import { useEffect } from 'react';
-import { redirectToLocal } from './utils/indexs';
 
-const IsLoggedIn = () => useEffect(() => {
+async function isLoggedIn() {
     const urlSearch = encodeURIComponent(window.location.search);
     const redirectToURL = (window.location.pathname + urlSearch);
+    const data = await API.auth.me();
 
-    API.auth.me().then((data) => {
-        if(data.status != 'OK') {
-            if(data.status == 'NEW_INSTALL') {
-                redirectToLocal('/cosmos-ui/newInstall');
-            } else if (data.status == 'error' && data.code == "HTTP004") {
-                redirectToLocal('/cosmos-ui/login?redirect=' + redirectToURL);
-            } else if (data.status == 'error' && data.code == "HTTP006") {
-                redirectToLocal('/cosmos-ui/loginmfa?redirect=' + redirectToURL);
-            } else if (data.status == 'error' && data.code == "HTTP007") {
-                redirectToLocal('/cosmos-ui/newmfa?redirect=' + redirectToURL);
-            }
-        }
-    })
-}, []);
+    if (data.status == 'NEW_INSTALL') {
+        return '/cosmos-ui/newInstall';
+    } else if (data.status == 'error' && data.code == "HTTP004") {
+        return '/cosmos-ui/login?redirect=' + redirectToURL;
+    } else if (data.status == 'error' && data.code == "HTTP006") {
+        return '/cosmos-ui/loginmfa?redirect=' + redirectToURL;
+    } else if (data.status == 'error' && data.code == "HTTP007") {
+        return '/cosmos-ui/newmfa?redirect=' + redirectToURL;
+    } else if (data.status == 'OK') {
+        return data.status
+    } else {
+        console.warn(`Status "${data.status}" does not have a navigation handler, will be interpreted as OK!`)
+        return 'OK'
+    }
+};
 
-export default IsLoggedIn;
+export default isLoggedIn;
diff --git a/client/src/pages/authentication/openid.jsx b/client/src/pages/authentication/openid.jsx
@@ -7,7 +7,6 @@ import { Checkbox, Grid, Stack, Typography } from '@mui/material';
 import AuthLogin from './auth-forms/AuthLogin';
 import AuthWrapper from './AuthWrapper';
 import { getFaviconURL } from '../../utils/routes';
-import IsLoggedIn from '../../isLoggedIn';
 import { LoadingButton } from '@mui/lab';
 import { Field, useFormik } from 'formik';
 import { useState } from 'react';
@@ -52,7 +51,6 @@ const OpenID = () => {
   }      
 
   return (<AuthWrapper>
-    <IsLoggedIn />
     <Grid container spacing={3}>
       <Grid item xs={12}>
         <Stack spacing={2}>

diff --git a/client/src/pages/config/routeConfigPage.jsx b/client/src/pages/config/routeConfigPage.jsx
@@ -7,7 +7,6 @@ import { useEffect, useState } from "react";
 import * as API  from "../../api";
 import RouteSecurity from "./routes/routeSecurity";
 import RouteOverview from "./routes/routeoverview";
-import IsLoggedIn from "../../isLoggedIn";
 import RouteMetrics from "../dashboard/routeMonitoring";
 import EventExplorerStandalone from "../dashboard/eventsExplorerStandalone";
 
@@ -31,7 +30,6 @@ const RouteConfigPage = () => {
   }, []);
 
   return <div>
-    <IsLoggedIn />
     <h2>
       <Stack spacing={1}>
       <Stack direction="row" spacing={1} alignItems="center">

diff --git a/client/src/pages/config/routes/newRoute.jsx b/client/src/pages/config/routes/newRoute.jsx
@@ -8,7 +8,6 @@ import Paper from '@mui/material/Paper';
 import { styled } from '@mui/material/styles';
 
 import * as API from '../../../api';
-import IsLoggedIn from '../../../isLoggedIn';
 import RestartModal from '../../config/users/restart';
 import RouteManagement from '../../config/routes/routeman';
 import { ValidateRoute, getFaviconURL, sanitizeRoute } from '../../../utils/routes';

diff --git a/client/src/pages/config/routes/routeman.jsx b/client/src/pages/config/routes/routeman.jsx
@@ -83,8 +83,11 @@ const RouteManagement = ({ routeConfig, routeNames, config, TargetContainer, noC
             return false;
           } else {
             let commaSepIps = values.WhitelistInboundIPs;
-            if(commaSepIps) {
+
+            if(commaSepIps && commaSepIps.length) {
               values.WhitelistInboundIPs = commaSepIps.split(',').map((ip) => ip.trim());
+            } else {
+              values.WhitelistInboundIPs = [];
             }
 
             let fullValues = {
@@ -116,6 +119,14 @@ const RouteManagement = ({ routeConfig, routeNames, config, TargetContainer, noC
           }
         }}
         validate={(values) => {
+          let commaSepIps = values.WhitelistInboundIPs;
+
+          if(commaSepIps && commaSepIps.length) {
+            values.WhitelistInboundIPs = commaSepIps.split(',').map((ip) => ip.trim());
+          } else {
+            values.WhitelistInboundIPs = [];
+          }
+
           let fullValues = {
             ...routeConfig,
             ...values,

diff --git a/client/src/pages/config/routes/routeoverview.jsx b/client/src/pages/config/routes/routeoverview.jsx
@@ -7,7 +7,6 @@ import { RouteMode, RouteSecurity } from '../../../components/routeComponents';
 import { getFaviconURL } from '../../../utils/routes';
 import * as API from '../../../api';
 import { CheckOutlined, ClockCircleOutlined, ContainerOutlined, DashboardOutlined, DeleteOutlined, DownOutlined, InfoCircleFilled, InfoCircleOutlined, LockOutlined, NodeExpandOutlined, SafetyCertificateOutlined, UpOutlined } from "@ant-design/icons";
-import IsLoggedIn from '../../../isLoggedIn';
 import { redirectToLocal } from '../../../utils/indexs';
 import { CosmosCheckbox } from '../users/formShortcuts';
 import { Field } from 'formik';