2.6.7: displaying entity/venue/subscriber wth buttons to go to provisioning directly within device details

This commit is contained in:
Charles
2022-03-15 18:17:55 +00:00
parent e6bb26ce12
commit 54186575e0
3 changed files with 102 additions and 45 deletions

90
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "ucentral-client", "name": "ucentral-client",
"version": "2.6.6", "version": "2.6.7",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "ucentral-client", "name": "ucentral-client",
"version": "2.6.6", "version": "2.6.7",
"dependencies": { "dependencies": {
"@coreui/coreui": "^3.4.0", "@coreui/coreui": "^3.4.0",
"@coreui/icons": "^2.0.1", "@coreui/icons": "^2.0.1",
@@ -2945,6 +2945,18 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/ansi-escapes/node_modules/type-fest": {
"version": "0.21.3",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
"integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
"dev": true,
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/ansi-html": { "node_modules/ansi-html": {
"version": "0.0.7", "version": "0.0.7",
"resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz", "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
@@ -3944,9 +3956,9 @@
} }
}, },
"node_modules/cliui/node_modules/ansi-regex": { "node_modules/cliui/node_modules/ansi-regex": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==", "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": ">=6" "node": ">=6"
@@ -6741,9 +6753,9 @@
"dev": true "dev": true
}, },
"node_modules/follow-redirects": { "node_modules/follow-redirects": {
"version": "1.14.7", "version": "1.14.9",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
"integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==", "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w==",
"funding": [ "funding": [
{ {
"type": "individual", "type": "individual",
@@ -13320,10 +13332,12 @@
} }
}, },
"node_modules/type-fest": { "node_modules/type-fest": {
"version": "0.21.3", "version": "0.13.1",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.13.1.tgz",
"integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==", "integrity": "sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==",
"dev": true, "dev": true,
"optional": true,
"peer": true,
"engines": { "engines": {
"node": ">=10" "node": ">=10"
}, },
@@ -13582,9 +13596,9 @@
} }
}, },
"node_modules/url-parse": { "node_modules/url-parse": {
"version": "1.5.4", "version": "1.5.10",
"resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.4.tgz", "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
"integrity": "sha512-ITeAByWWoqutFClc/lRZnFplgXgEZr3WJ6XngMM/N9DMIm4K8zXPCZ1Jdu0rERwO84w1WC5wkle2ubwTA4NTBg==", "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"querystringify": "^2.1.1", "querystringify": "^2.1.1",
@@ -14816,9 +14830,9 @@
} }
}, },
"node_modules/yargs/node_modules/ansi-regex": { "node_modules/yargs/node_modules/ansi-regex": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==", "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": ">=6" "node": ">=6"
@@ -17012,6 +17026,14 @@
"dev": true, "dev": true,
"requires": { "requires": {
"type-fest": "^0.21.3" "type-fest": "^0.21.3"
},
"dependencies": {
"type-fest": {
"version": "0.21.3",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
"integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
"dev": true
}
} }
}, },
"ansi-html": { "ansi-html": {
@@ -17792,9 +17814,9 @@
}, },
"dependencies": { "dependencies": {
"ansi-regex": { "ansi-regex": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==", "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
"dev": true "dev": true
}, },
"emoji-regex": { "emoji-regex": {
@@ -19936,9 +19958,9 @@
"dev": true "dev": true
}, },
"follow-redirects": { "follow-redirects": {
"version": "1.14.7", "version": "1.14.9",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
"integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==" "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w=="
}, },
"for-in": { "for-in": {
"version": "1.0.2", "version": "1.0.2",
@@ -24862,10 +24884,12 @@
} }
}, },
"type-fest": { "type-fest": {
"version": "0.21.3", "version": "0.13.1",
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.13.1.tgz",
"integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==", "integrity": "sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==",
"dev": true "dev": true,
"optional": true,
"peer": true
}, },
"type-is": { "type-is": {
"version": "1.6.18", "version": "1.6.18",
@@ -25080,9 +25104,9 @@
} }
}, },
"url-parse": { "url-parse": {
"version": "1.5.4", "version": "1.5.10",
"resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.4.tgz", "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
"integrity": "sha512-ITeAByWWoqutFClc/lRZnFplgXgEZr3WJ6XngMM/N9DMIm4K8zXPCZ1Jdu0rERwO84w1WC5wkle2ubwTA4NTBg==", "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"querystringify": "^2.1.1", "querystringify": "^2.1.1",
@@ -26001,9 +26025,9 @@
}, },
"dependencies": { "dependencies": {
"ansi-regex": { "ansi-regex": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==", "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
"dev": true "dev": true
}, },
"emoji-regex": { "emoji-regex": {

View File

@@ -1,6 +1,6 @@
{ {
"name": "ucentral-client", "name": "ucentral-client",
"version": "2.6.6", "version": "2.6.7",
"dependencies": { "dependencies": {
"@coreui/coreui": "^3.4.0", "@coreui/coreui": "^3.4.0",
"@coreui/icons": "^2.0.1", "@coreui/icons": "^2.0.1",

View File

@@ -15,14 +15,17 @@ import {
import CIcon from '@coreui/icons-react'; import CIcon from '@coreui/icons-react';
import { cilSync } from '@coreui/icons'; import { cilSync } from '@coreui/icons';
import { prettyDate } from 'utils/helper'; import { prettyDate } from 'utils/helper';
import { CopyToClipboardButton, HideTextButton } from 'ucentral-libs'; import { CopyToClipboardButton, HideTextButton, useAuth } from 'ucentral-libs';
import { getCountryFromLocale } from 'utils/countries'; import { getCountryFromLocale } from 'utils/countries';
import ReactCountryFlag from 'react-country-flag'; import ReactCountryFlag from 'react-country-flag';
import axiosInstance from 'utils/axiosInstance';
import styles from './index.module.scss'; import styles from './index.module.scss';
const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats }) => { const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats }) => {
const [showPassword, setShowPassword] = useState(false); const [showPassword, setShowPassword] = useState(false);
const [subName, setSubName] = useState('');
const { currentToken, endpoints } = useAuth();
const toggleShowPassword = () => { const toggleShowPassword = () => {
setShowPassword(!showPassword); setShowPassword(!showPassword);
@@ -34,21 +37,51 @@ const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats })
return showPassword ? password : '******'; return showPassword ? password : '******';
}; };
const displayExtra = (key, value, extraData) => { const getSubData = async (subId) => {
if (!extraData || !extraData[key]) return value; const options = {
headers: {
Accept: 'application/json',
Authorization: `Bearer ${currentToken}`,
},
};
if (!localStorage.getItem('owprov-ui') || key === 'owner') return extraData[key].name; axiosInstance
.get(`${endpoints.owsec}/api/v1/subuser/${subId}`, options)
.then((response) => setSubName(response.data.name ?? ''))
.catch(() => setSubName(''));
};
const getSubscriber = () => {
if (!deviceConfig?.subscriber || deviceConfig.subscriber === '') return '';
getSubData(deviceConfig.subscriber);
return ( return (
<CLink <CLink
className="c-subheader-nav-link align-self-center" className="c-subheader-nav-link align-self-center"
aria-current="page" aria-current="page"
href={`${localStorage.getItem('owprov-ui')}/#/${key === 'entity' ? 'entity' : 'venue'}/${ href={`${localStorage.getItem('owprov-ui')}/#/subscriber/${deviceConfig.subscriber}`}
extraData[key].id
}`}
target="_blank" target="_blank"
> >
{extraData[key].name} {subName !== '' ? subName : deviceConfig.subscriber}
</CLink>
);
};
const displayExtra = (key, value, extraData) => {
if (!extraData || !extraData[key]) return value;
if (!localStorage.getItem('owprov-ui')) return extraData[key].name;
return (
<CLink
className="c-subheader-nav-link align-self-center"
aria-current="page"
href={`${localStorage.getItem('owprov-ui')}/#/${
key === 'entity' ? 'entity' : 'venue'
}/${value}`}
target="_blank"
>
{!extraData || !extraData[key] ? value : extraData[key].name}
</CLink> </CLink>
); );
}; };
@@ -104,7 +137,7 @@ const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats })
<CLabel>{t('inventory.subscriber')}:</CLabel> <CLabel>{t('inventory.subscriber')}:</CLabel>
</CCol> </CCol>
<CCol lg="2" xl="3" xxl="3"> <CCol lg="2" xl="3" xxl="3">
{deviceConfig?.subscriber} {getSubscriber()}
</CCol> </CCol>
<CCol lg="2" xl="1" xxl="1"> <CCol lg="2" xl="1" xxl="1">
<CLabel>MAC:</CLabel> <CLabel>MAC:</CLabel>
@@ -122,7 +155,7 @@ const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats })
<CLabel>{t('entity.entity')}:</CLabel> <CLabel>{t('entity.entity')}:</CLabel>
</CCol> </CCol>
<CCol lg="2" xl="3" xxl="3"> <CCol lg="2" xl="3" xxl="3">
{deviceConfig?.venue?.substring(0, 3) === 'ent' {deviceConfig?.entity !== ''
? displayExtra( ? displayExtra(
'entity', 'entity',
deviceConfig?.venue?.slice(4), deviceConfig?.venue?.slice(4),
@@ -146,7 +179,7 @@ const DeviceDetails = ({ t, loading, getData, status, deviceConfig, lastStats })
<CLabel>{t('inventory.venue')}:</CLabel> <CLabel>{t('inventory.venue')}:</CLabel>
</CCol> </CCol>
<CCol lg="2" xl="3" xxl="3"> <CCol lg="2" xl="3" xxl="3">
{deviceConfig?.venue?.substring(0, 3) === 'ven' {deviceConfig?.venue !== ''
? displayExtra('venue', deviceConfig?.venue?.slice(4), deviceConfig?.extendedInfo) ? displayExtra('venue', deviceConfig?.venue?.slice(4), deviceConfig?.extendedInfo)
: ''} : ''}
</CCol> </CCol>