Frontend changes
This commit is contained in:
10
frontend/package-lock.json
generated
10
frontend/package-lock.json
generated
@@ -5185,7 +5185,6 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"anymatch": "~3.1.2",
|
"anymatch": "~3.1.2",
|
||||||
"braces": "~3.0.2",
|
"braces": "~3.0.2",
|
||||||
"fsevents": "~2.3.2",
|
|
||||||
"glob-parent": "~5.1.2",
|
"glob-parent": "~5.1.2",
|
||||||
"is-binary-path": "~2.1.0",
|
"is-binary-path": "~2.1.0",
|
||||||
"is-glob": "~4.0.1",
|
"is-glob": "~4.0.1",
|
||||||
@@ -6542,8 +6541,7 @@
|
|||||||
"esprima": "^4.0.1",
|
"esprima": "^4.0.1",
|
||||||
"estraverse": "^5.2.0",
|
"estraverse": "^5.2.0",
|
||||||
"esutils": "^2.0.2",
|
"esutils": "^2.0.2",
|
||||||
"optionator": "^0.8.1",
|
"optionator": "^0.8.1"
|
||||||
"source-map": "~0.6.1"
|
|
||||||
},
|
},
|
||||||
"bin": {
|
"bin": {
|
||||||
"escodegen": "bin/escodegen.js",
|
"escodegen": "bin/escodegen.js",
|
||||||
@@ -9057,7 +9055,6 @@
|
|||||||
"@types/node": "*",
|
"@types/node": "*",
|
||||||
"anymatch": "^3.0.3",
|
"anymatch": "^3.0.3",
|
||||||
"fb-watchman": "^2.0.0",
|
"fb-watchman": "^2.0.0",
|
||||||
"fsevents": "^2.3.2",
|
|
||||||
"graceful-fs": "^4.2.9",
|
"graceful-fs": "^4.2.9",
|
||||||
"jest-regex-util": "^27.5.1",
|
"jest-regex-util": "^27.5.1",
|
||||||
"jest-serializer": "^27.5.1",
|
"jest-serializer": "^27.5.1",
|
||||||
@@ -9780,7 +9777,6 @@
|
|||||||
"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
|
||||||
"integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
|
"integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"graceful-fs": "^4.1.6",
|
|
||||||
"universalify": "^2.0.0"
|
"universalify": "^2.0.0"
|
||||||
},
|
},
|
||||||
"optionalDependencies": {
|
"optionalDependencies": {
|
||||||
@@ -12410,7 +12406,6 @@
|
|||||||
"eslint-webpack-plugin": "^3.1.1",
|
"eslint-webpack-plugin": "^3.1.1",
|
||||||
"file-loader": "^6.2.0",
|
"file-loader": "^6.2.0",
|
||||||
"fs-extra": "^10.0.0",
|
"fs-extra": "^10.0.0",
|
||||||
"fsevents": "^2.3.2",
|
|
||||||
"html-webpack-plugin": "^5.5.0",
|
"html-webpack-plugin": "^5.5.0",
|
||||||
"identity-obj-proxy": "^3.0.0",
|
"identity-obj-proxy": "^3.0.0",
|
||||||
"jest": "^27.4.3",
|
"jest": "^27.4.3",
|
||||||
@@ -12823,9 +12818,6 @@
|
|||||||
"version": "2.75.6",
|
"version": "2.75.6",
|
||||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.75.6.tgz",
|
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.75.6.tgz",
|
||||||
"integrity": "sha512-OEf0TgpC9vU6WGROJIk1JA3LR5vk/yvqlzxqdrE2CzzXnqKXNzbAwlWUXis8RS3ZPe7LAq+YUxsRa0l3r27MLA==",
|
"integrity": "sha512-OEf0TgpC9vU6WGROJIk1JA3LR5vk/yvqlzxqdrE2CzzXnqKXNzbAwlWUXis8RS3ZPe7LAq+YUxsRa0l3r27MLA==",
|
||||||
"dependencies": {
|
|
||||||
"fsevents": "~2.3.2"
|
|
||||||
},
|
|
||||||
"bin": {
|
"bin": {
|
||||||
"rollup": "dist/bin/rollup"
|
"rollup": "dist/bin/rollup"
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -9,7 +9,6 @@ import { deleteservice, errorNotify, fireUpdateRequest, okNotify, startservice,
|
|||||||
import { BsTrashFill } from 'react-icons/bs';
|
import { BsTrashFill } from 'react-icons/bs';
|
||||||
import { BiRename } from 'react-icons/bi'
|
import { BiRename } from 'react-icons/bi'
|
||||||
|
|
||||||
//"status":"stop"/"wait"/"active"/"pause",
|
|
||||||
function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void }) {
|
function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void }) {
|
||||||
|
|
||||||
let status_color = "gray";
|
let status_color = "gray";
|
||||||
@@ -18,7 +17,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
case "active": status_color = "teal"; break;
|
case "active": status_color = "teal"; break;
|
||||||
}
|
}
|
||||||
|
|
||||||
const [stopModal, setStopModal] = useState(false);
|
|
||||||
const [buttonLoading, setButtonLoading] = useState(false)
|
const [buttonLoading, setButtonLoading] = useState(false)
|
||||||
const [tooltipStopOpened, setTooltipStopOpened] = useState(false);
|
const [tooltipStopOpened, setTooltipStopOpened] = useState(false);
|
||||||
const [deleteModal, setDeleteModal] = useState(false)
|
const [deleteModal, setDeleteModal] = useState(false)
|
||||||
@@ -27,7 +25,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
setButtonLoading(true)
|
setButtonLoading(true)
|
||||||
await stopservice(service.port).then(res => {
|
await stopservice(service.port).then(res => {
|
||||||
if(!res){
|
if(!res){
|
||||||
okNotify(`Service ${service.port} stopped successfully!`,`The service ${service.name} has been stopped!`)
|
okNotify(`Service ${service.name} stopped successfully!`,`The service on ${service.port} has been stopped!`)
|
||||||
fireUpdateRequest();
|
fireUpdateRequest();
|
||||||
}else{
|
}else{
|
||||||
errorNotify(`An error as occurred during the stopping of the service ${service.port}`,`Error: ${res}`)
|
errorNotify(`An error as occurred during the stopping of the service ${service.port}`,`Error: ${res}`)
|
||||||
@@ -42,7 +40,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
setButtonLoading(true)
|
setButtonLoading(true)
|
||||||
await startservice(service.port).then(res => {
|
await startservice(service.port).then(res => {
|
||||||
if(!res){
|
if(!res){
|
||||||
okNotify(`Service ${service.port} started successfully!`,`The service ${service.name} has been started!`)
|
okNotify(`Service ${service.name} started successfully!`,`The service on ${service.port} has been started!`)
|
||||||
fireUpdateRequest();
|
fireUpdateRequest();
|
||||||
}else{
|
}else{
|
||||||
errorNotify(`An error as occurred during the starting of the service ${service.port}`,`Error: ${res}`)
|
errorNotify(`An error as occurred during the starting of the service ${service.port}`,`Error: ${res}`)
|
||||||
@@ -56,7 +54,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
const deleteService = () => {
|
const deleteService = () => {
|
||||||
deleteservice(service.port).then(res => {
|
deleteservice(service.port).then(res => {
|
||||||
if (!res){
|
if (!res){
|
||||||
okNotify("Service delete complete!",`The service ${service.port} has been deleted!`)
|
okNotify("Service delete complete!",`The service ${service.name} has been deleted!`)
|
||||||
fireUpdateRequest();
|
fireUpdateRequest();
|
||||||
}else
|
}else
|
||||||
errorNotify("An error occurred while deleting a service",`Error: ${res}`)
|
errorNotify("An error occurred while deleting a service",`Error: ${res}`)
|
||||||
@@ -114,9 +112,9 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
<Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item>
|
<Menu.Item color="red" icon={<BsTrashFill size={18} />} onClick={()=>setDeleteModal(true)}>Delete Service</Menu.Item>
|
||||||
</Menu>
|
</Menu>
|
||||||
<Space w="md"/>
|
<Space w="md"/>
|
||||||
<Tooltip label="Stop service" zIndex={0} transition="pop" transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="red" opened={tooltipStopOpened} tooltipId="tooltip-stop-id">
|
<Tooltip label="Stop service" zIndex={0} transition="pop" transitionDuration={200} transitionTimingFunction="ease" color="red" opened={tooltipStopOpened} tooltipId="tooltip-stop-id">
|
||||||
<ActionIcon color="red" loading={buttonLoading}
|
<ActionIcon color="red" loading={buttonLoading}
|
||||||
onClick={()=>setStopModal(true)} size="xl" radius="md" variant="filled"
|
onClick={stopService} size="xl" radius="md" variant="filled"
|
||||||
disabled={service.status === "stop"}
|
disabled={service.status === "stop"}
|
||||||
aria-describedby="tooltip-stop-id"
|
aria-describedby="tooltip-stop-id"
|
||||||
onFocus={() => setTooltipStopOpened(false)} onBlur={() => setTooltipStopOpened(false)}
|
onFocus={() => setTooltipStopOpened(false)} onBlur={() => setTooltipStopOpened(false)}
|
||||||
@@ -125,7 +123,7 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
</ActionIcon>
|
</ActionIcon>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Space w="md"/>
|
<Space w="md"/>
|
||||||
<Tooltip label="Start service" transition="pop" zIndex={0} transitionDuration={200} /*openDelay={500}*/ transitionTimingFunction="ease" color="teal">
|
<Tooltip label="Start service" transition="pop" zIndex={0} transitionDuration={200} transitionTimingFunction="ease" color="teal">
|
||||||
<ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading}
|
<ActionIcon color="teal" size="xl" radius="md" onClick={startService} loading={buttonLoading}
|
||||||
variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}>
|
variant="filled" disabled={!["stop","pause"].includes(service.status)?true:false}>
|
||||||
<FaPlay size="20px" />
|
<FaPlay size="20px" />
|
||||||
@@ -143,13 +141,6 @@ function ServiceRow({ service, onClick }:{ service:Service, onClick?:()=>void })
|
|||||||
|
|
||||||
</Grid.Col>
|
</Grid.Col>
|
||||||
</Grid>
|
</Grid>
|
||||||
<YesNoModal
|
|
||||||
title='Are you sure to stop this service?'
|
|
||||||
description={`You are going to delete the service '${service.port}', causing the firewall to stop. This will cause the shutdown of your service! ⚠️`}
|
|
||||||
onClose={()=>{setStopModal(false);}}
|
|
||||||
action={stopService}
|
|
||||||
opened={stopModal}
|
|
||||||
/>
|
|
||||||
<hr style={{width:"100%"}}/>
|
<hr style={{width:"100%"}}/>
|
||||||
<YesNoModal
|
<YesNoModal
|
||||||
title='Are you sure to delete this service?'
|
title='Are you sure to delete this service?'
|
||||||
|
|||||||
Reference in New Issue
Block a user