beenull/Cosmos-Server
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[release] v0.12.0-unstable25

Browse source
This commit is contained in:
Yann Stepienik 2023-10-31 19:35:50 +00:00
parent 10fe2d7f25
commit f6b322a92a
10 changed files with 67 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
changelog.md
View file

@ -4,6 +4,8 @@
- Integrated a new docker-less mode of functioning for networking
- Added Button to force reset HTTPS cert in settings
- New color slider with reset buttons
- Fixed blinking modals issues
- Added lazyloading to URL and Servapp pages images
## Version 0.11.3
- Fix missing even subscriber on export

2
client/src/components/apiModal.jsx
View file

@ -57,7 +57,7 @@ const ApiModal = ({ callback, label }) => {
}, [openModal]);
return <>
<Dialog open={openModal} onClose={() => setOpenModal(false)}>
<Dialog open={openModal} onClose={() => setOpenModal(false)} fullWidth maxWidth={'sm'}>
<DialogTitle>Refresh Page</DialogTitle>
<DialogContent>
<DialogContentText>

5
client/src/pages/config/users/proxyman.jsx
View file

@ -39,6 +39,7 @@ import HostChip from '../../../components/hostChip';
import {RouteActions, RouteMode, RouteSecurity} from '../../../components/routeComponents';
import { useNavigate } from 'react-router';
import NewRouteCreate from '../routes/newRoute';
import LazyLoad from 'react-lazyload';
const stickyButton = {
position: 'fixed',
@ -154,7 +155,9 @@ const ProxyManagement = () => {
columns={[
{
title: '',
field: (r) => <img className="loading-image" alt="" src={getFaviconURL(r)} width="64px" />,
field: (r) => <LazyLoad width={"64px"} height={"64px"}>
<img className="loading-image" alt="" src={getFaviconURL(r)} width="64px" height="64px"/>
</LazyLoad>,
style: {
textAlign: 'center',
},

11
client/src/pages/dashboard/components/mini-plot.jsx
View file

@ -1,4 +1,6 @@
import React, { useEffect, useState, useMemo } from 'react';
import { useInView } from 'react-intersection-observer';
// material-ui
import {
Avatar,
@ -34,8 +36,11 @@ const _MiniPlotComponent = ({metrics, labels}) => {
const [dataMetrics, setDataMetrics] = useState([]);
const [series, setSeries] = useState([]);
const slot = 'hourly';
const [ref, inView] = useInView();
useEffect(() => {
if(!inView) return;
let xAxis = [];
if(slot === 'latest') {
@ -88,7 +93,7 @@ const _MiniPlotComponent = ({metrics, labels}) => {
setSeries(_series);
});
}, [metrics]);
}, [metrics, inView]);
const chartOptions = {
colors: [
@ -167,13 +172,13 @@ const _MiniPlotComponent = ({metrics, labels}) => {
fontSize: '110%',
whiteSpace: 'nowrap',
}}>{formaters[di](dataMetric.Values[dataMetric.Values.length - 1].Value)}</div>
<div>{(labels && labels[di]) || dataMetric.Label}</div>
<div>{(labels && labels[dataMetric.Key]) || dataMetric.Label}</div>
</Stack>)}
<div style={{
margin: '-10px 0px -20px 10px',
flexGrow: 1,
}}>
}} ref={ref}>
<ReactApexChart options={chartOptions} series={series} type="line" height={90} />
</div>
</Stack>

4
client/src/pages/servapps/containers/docker-compose.jsx
View file

@ -499,9 +499,9 @@ const DockerComposeImport = ({ refresh, dockerComposeInit, installerInit, defaul
}
return <>
<Dialog open={openModal} onClose={() => setOpenModal(false)}>
<Dialog open={openModal} onClose={() => setOpenModal(false)} fullWidth maxWidth={'sm'}>
<DialogTitle>{installer ? "Installation" : "Import Compose File"}</DialogTitle>
<DialogContent style={{ width: '800px', maxWidth: '100%' }}>
<DialogContent style={{ width: '100%' }}>
<DialogContentText>
{step === 0 && !installer && <><Stack spacing={2}>

10
client/src/pages/servapps/containers/overview.jsx
View file

@ -174,11 +174,17 @@ const ContainerOverview = ({ containerInfo, config, refresh, updatesAvailable, s
<MiniPlotComponent metrics={[
"cosmos.system.docker.cpu." + Name.replace('/', ''),
"cosmos.system.docker.ram." + Name.replace('/', ''),
]} labels={["CPU", "RAM"]}/>
]} labels={{
["cosmos.system.docker.cpu." + Name.replace('/', '')]: "CPU",
["cosmos.system.docker.ram." + Name.replace('/', '')]: "RAM"
}}/>
<MiniPlotComponent metrics={[
"cosmos.system.docker.netTx." + Name.replace('/', ''),
"cosmos.system.docker.netRx." + Name.replace('/', ''),
]} labels={["NTX", "NRX"]}/>
]} labels={{
["cosmos.system.docker.netTx." + Name.replace('/', '')]: "NTX",
["cosmos.system.docker.netTx." + Name.replace('/', '')]: "NRX"
}}/>
</div>
</Stack>
</Stack>

5
client/src/pages/servapps/servapps.jsx
View file

@ -301,7 +301,10 @@ const ServApps = () => {
<MiniPlotComponent metrics={[
"cosmos.system.docker.cpu." + app.Names[0].replace('/', ''),
"cosmos.system.docker.ram." + app.Names[0].replace('/', ''),
]} labels={["CPU", "RAM"]}/>
]} labels={{
["cosmos.system.docker.cpu." + app.Names[0].replace('/', '')]: "CPU",
["cosmos.system.docker.ram." + app.Names[0].replace('/', '')]: "RAM"
}}/>
</div>
<div>
<Link to={`/cosmos-ui/servapps/containers/${app.Names[0].replace('/', '')}`}>

13
client/src/utils/servapp-icon.jsx
View file

@ -1,9 +1,12 @@
import { getFaviconURL } from "./routes";
import logogray from '../assets/images/icons/cosmos_gray.png';
import LazyLoad from 'react-lazyload';
export const ServAppIcon = ({route, container, ...pprops}) => {
return (container && container.Labels["cosmos-icon"]) ?
<img src={container.Labels["cosmos-icon"]} {...pprops}></img> :
route ? <img src={getFaviconURL(route)} {...pprops}></img>
: <img src={logogray} {...pprops}></img>
export const ServAppIcon = ({route, container, width, ...pprops}) => {
return <LazyLoad width={width} height={width}>
{(container && container.Labels["cosmos-icon"]) ?
<img src={container.Labels["cosmos-icon"]} {...pprops} width={width} height={width}></img> :(
route ? <img src={getFaviconURL(route)} {...pprops} width={width} height={width}></img>
: <img src={logogray} {...pprops} width={width} height={width}></img>)}
</LazyLoad>;
};

23
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "cosmos-server",
"version": "0.10.0-unstable16",
"version": "0.12.0-unstable24",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "cosmos-server",
"version": "0.10.0-unstable16",
"version": "0.12.0-unstable24",
"dependencies": {
"@ant-design/colors": "^6.0.0",
"@ant-design/icons": "^4.7.0",
@ -42,6 +42,8 @@
"react-dom": "^18.2.0",
"react-draggable": "^4.4.5",
"react-element-to-jsx-string": "^15.0.0",
"react-intersection-observer": "^9.5.2",
"react-lazyload": "^3.2.0",
"react-material-ui-carousel": "^3.4.2",
"react-number-format": "^4.9.4",
"react-perfect-scrollbar": "^1.5.8",
@ -8992,11 +8994,28 @@
"resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz",
"integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw=="
},
"node_modules/react-intersection-observer": {
"version": "9.5.2",
"resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.5.2.tgz",
"integrity": "sha512-EmoV66/yvksJcGa1rdW0nDNc4I1RifDWkT50gXSFnPLYQ4xUptuDD4V7k+Rj1OgVAlww628KLGcxPXFlOkkU/Q==",
"peerDependencies": {
"react": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/react-is": {
"version": "18.2.0",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
"integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
},
"node_modules/react-lazyload": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/react-lazyload/-/react-lazyload-3.2.0.tgz",
"integrity": "sha512-zJlrG8QyVZz4+xkYZH5v1w3YaP5wEFaYSUWC4CT9UXfK75IfRAIEdnyIUF+dXr3kX2MOtL1lUaZmaQZqrETwgw==",
"peerDependencies": {
"react": "^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0",
"react-dom": "^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0"
}
},
"node_modules/react-material-ui-carousel": {
"version": "3.4.2",
"resolved": "https://registry.npmjs.org/react-material-ui-carousel/-/react-material-ui-carousel-3.4.2.tgz",

10
package.json
View file

@ -1,6 +1,6 @@
{
"name": "cosmos-server",
"version": "0.12.0-unstable24",
"version": "0.12.0-unstable25",
"description": "",
"main": "test-server.js",
"bugs": {
@ -42,6 +42,8 @@
"react-dom": "^18.2.0",
"react-draggable": "^4.4.5",
"react-element-to-jsx-string": "^15.0.0",
"react-intersection-observer": "^9.5.2",
"react-lazyload": "^3.2.0",
"react-material-ui-carousel": "^3.4.2",
"react-number-format": "^4.9.4",
"react-perfect-scrollbar": "^1.5.8",
@ -61,6 +63,12 @@
"whiskers.js": "^1.0.0",
"yup": "^0.32.11"
},
"overrides": {
"react-lazyload": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
},
"scripts": {
"client": "vite",
"client-build": "vite build --base=/cosmos-ui/",