From 3f7709c9eeb601bcf30390f1d2e41fbb487090a1 Mon Sep 17 00:00:00 2001 From: Simon Rho Date: Tue, 22 Oct 2024 11:28:03 -0400 Subject: [PATCH] Add product model count to footer status bar --- jccm/package.json | 2 +- jccm/src/Frontend/Layout/Footer.js | 163 ++++++++---------- .../Frontend/Layout/InventoryTreeMenuLocal.js | 2 +- 3 files changed, 78 insertions(+), 89 deletions(-) diff --git a/jccm/package.json b/jccm/package.json index 5f7f30c..30d1420 100644 --- a/jccm/package.json +++ b/jccm/package.json @@ -2,7 +2,7 @@ "name": "jccm", "productName": "Juniper Cloud Connection Manager", "description": "Juniper Cloud Connection Manager", - "version": "1.2.4", + "version": "1.2.5", "main": ".webpack/main", "scripts": { "start": "pkill -9 node; nodemon --watch ./src --ext js,json --ignore ./src/Frontend/ --exec 'electron-forge start'", diff --git a/jccm/src/Frontend/Layout/Footer.js b/jccm/src/Frontend/Layout/Footer.js index 2b25c14..fdf8385 100644 --- a/jccm/src/Frontend/Layout/Footer.js +++ b/jccm/src/Frontend/Layout/Footer.js @@ -52,11 +52,11 @@ export default () => { setConsoleWindowOpen, deviceNetworkCondition, resetDeviceNetworkConditionAll, + supportedDeviceModels, } = useStore(); const [isBastionHostEmpty, setIsBastionHostEmpty] = useState(false); - const [countOfOrgOrSiteUnmatched, setCountOfOrgOrSiteUnmatched] = - useState(0); + const [countOfOrgOrSiteUnmatched, setCountOfOrgOrSiteUnmatched] = useState(0); const countOfDeviceFacts = Object.keys(deviceFacts).length; const countOfAdoptedDevices = Object.values(deviceFacts).filter((fact) => { @@ -73,11 +73,30 @@ export default () => { const deviceConditions = Object.values(deviceNetworkCondition); const countOfDeviceNetworkCondition = deviceConditions.length; + const deviceModelsValidation = settings?.deviceModelsValidation || false; + + const validateDeviceModel = (deviceModel) => { + if (!deviceModelsValidation) return true; + if (!isUserLoggedIn) return true; + return deviceModel?.toUpperCase() in supportedDeviceModels; + }; + let countOfDnsIssue = 0; let countOfRouteIssue = 0; let countOfAccessIssue = 0; let countOfNoIssue = 0; + const { countOfInvalidModel, unsupportedModels } = Object.values(deviceFacts).reduce( + (acc, { systemInformation: { hardwareModel } = {} }) => { + if (!validateDeviceModel(hardwareModel)) { + acc.countOfInvalidModel++; + if (hardwareModel) acc.unsupportedModels.add(hardwareModel); + } + return acc; + }, + { countOfInvalidModel: 0, unsupportedModels: new Set() } + ); + deviceConditions.forEach((device) => { if (device.dns === false) { countOfDnsIssue++; @@ -91,11 +110,7 @@ export default () => { }); const countOfUnknownIssue = - countOfDeviceNetworkCondition - - countOfDnsIssue - - countOfRouteIssue - - countOfAccessIssue - - countOfNoIssue; + countOfDeviceNetworkCondition - countOfDnsIssue - countOfRouteIssue - countOfAccessIssue - countOfNoIssue; const doesSiteNameExist = (orgName, siteName) => { const org = cloudInventory.find((item) => item?.name === orgName); @@ -142,37 +157,6 @@ export default () => { setConsoleWindowOpen(!consoleWindowOpen); }; - const MessageAndCounter = ({ - message, - color = tokens.colorNeutralForeground4, - backgroundColor = tokens.colorNeutralBackground1, - fontSize = '12px', - counterValue, - }) => { - return ( -
- {message} - - -
- ); - }; - return (
{ alignItems: 'center', }} > -
+ } + relationship='label' + withArrow='above' + > + + + )} + {countOfOrgOrSiteUnmatched > 0 && ( + + )} + )} {countOfDeviceNetworkCondition > 0 && ( @@ -268,8 +273,7 @@ export default () => { display: 'flex', flexDirection: 'row', alignItems: 'center', - justifyContent: - 'flex-start', + justifyContent: 'flex-start', gap: '5px', }} > @@ -286,7 +290,7 @@ export default () => { fontSize: '10px', }} > - {`Access to the service endpoint is ready: ${countOfNoIssue}`}{' '} + {`Access to the service endpoint is ready: ${countOfNoIssue}`} )} @@ -296,8 +300,7 @@ export default () => { display: 'flex', flexDirection: 'row', alignItems: 'center', - justifyContent: - 'flex-start', + justifyContent: 'flex-start', gap: '5px', }} > @@ -323,8 +326,7 @@ export default () => { display: 'flex', flexDirection: 'row', alignItems: 'center', - justifyContent: - 'flex-start', + justifyContent: 'flex-start', gap: '5px', }} > @@ -350,8 +352,7 @@ export default () => { display: 'flex', flexDirection: 'row', alignItems: 'center', - justifyContent: - 'flex-start', + justifyContent: 'flex-start', gap: '5px', }} > @@ -377,8 +378,7 @@ export default () => { display: 'flex', flexDirection: 'row', alignItems: 'center', - justifyContent: - 'flex-start', + justifyContent: 'flex-start', gap: '5px', }} > @@ -412,11 +412,7 @@ export default () => { fontSize: '12px', color: tokens.colorNeutralForeground4, }} - onClick={() => - eventBus.emit( - 'device-network-access-check-reset' - ) - } + onClick={() => eventBus.emit('device-network-access-check-reset')} > {`Reset Network Access Check: ${countOfDeviceNetworkCondition} Devices`} @@ -438,10 +434,7 @@ export default () => {
{ - {!consoleWindowOpen - ? 'Open Console Window' - : 'Close Console Window'} + {!consoleWindowOpen ? 'Open Console Window' : 'Close Console Window'} } positioning='before' @@ -466,9 +457,7 @@ export default () => { Icon={ConsoleWindowIcon} size='16px' iconSize='12px' - color={ - tokens.colorNeutralForeground3BrandPressed - } + color={tokens.colorNeutralForeground3BrandPressed} /> } size='small' diff --git a/jccm/src/Frontend/Layout/InventoryTreeMenuLocal.js b/jccm/src/Frontend/Layout/InventoryTreeMenuLocal.js index 0edb898..0f21f6d 100644 --- a/jccm/src/Frontend/Layout/InventoryTreeMenuLocal.js +++ b/jccm/src/Frontend/Layout/InventoryTreeMenuLocal.js @@ -1920,7 +1920,7 @@ const InventoryTreeMenuLocal = () => { for (let attempt = 1; attempt <= maxRetries; attempt++) { response = await getDeviceNetworkCondition( - { ...device, timeout: 5000 }, + { ...device, timeout: 10000 }, bastionHost, termServer, termPort