github/kubeshark
1
0
Fork 0
mirror of https://github.com/kubeshark/kubeshark.git synced 2025-06-28 09:10:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

added map object (#1119)

Browse Source 
Co-authored-by: Leon <>
This commit is contained in:
leon-up9 2022-05-30 13:13:07 +03:00 committed by GitHub
parent 45b368b33e
commit 02b3672e09
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui-common/src/components/ServiceMapModal/ServiceMapModal.module.sass
View File

@ -34,8 +34,6 @@
font-weight: 600
margin-right: 35px
& .actions
.graphSection
flex: 85%

15
ui-common/src/components/ServiceMapModal/ServiceMapModal.tsx
View File

@ -33,6 +33,11 @@ const modalStyle = {
padding: "1px 1px",
paddingBottom: "15px"
};
const protocolDisplayNameMap = {
"GQL": "GraphQL"
}
interface LegentLabelProps {
color: string,
name: string
@ -119,7 +124,11 @@ export const ServiceMapModal: React.FC<ServiceMapModalProps> = ({ isOpen, onClos
const getProtocolsForFilter = useMemo(() => {
return serviceMapApiData.edges.reduce<ProtocolType[]>((returnArr, currentValue, currentIndex, array) => {
if (!returnArr.find(prot => prot.key === currentValue.protocol.abbr))
returnArr.push({ key: currentValue.protocol.abbr, value: currentValue.protocol.abbr, component: <LegentLabel color={currentValue.protocol.backgroundColor} name={currentValue.protocol.abbr} /> })
returnArr.push({
key: currentValue.protocol.abbr, value: currentValue.protocol.abbr,
component: <LegentLabel color={currentValue.protocol.backgroundColor}
name={protocolDisplayNameMap[currentValue.protocol.abbr] ? protocolDisplayNameMap[currentValue.protocol.abbr] : currentValue.protocol.abbr} />
})
return returnArr
}, new Array<ProtocolType>())
}, [serviceMapApiData])
@ -221,12 +230,12 @@ export const ServiceMapModal: React.FC<ServiceMapModalProps> = ({ isOpen, onClos
<div className={styles.card}>
<SelectList items={getProtocolsForFilter} checkBoxWidth="5%" tableName={"PROTOCOLS"} multiSelect={true}
checkedValues={checkedProtocols} setCheckedValues={onProtocolsChange} tableClassName={styles.filters}
inputSearchClass={styles.servicesFilterSearch} isFilterable={false}/>
inputSearchClass={styles.servicesFilterSearch} isFilterable={false} />
</div>
<div className={styles.servicesFilterWrapper + ` ${styles.card}`}>
<div className={styles.servicesFilterList}>
<SelectList items={getServicesForFilter} tableName={"SERVICES"} tableClassName={styles.filters} multiSelect={true}
checkBoxWidth="5%" checkedValues={checkedServices} setCheckedValues={onServiceChanges} inputSearchClass={styles.servicesFilterSearch}/>
checkBoxWidth="5%" checkedValues={checkedServices} setCheckedValues={onServiceChanges} inputSearchClass={styles.servicesFilterSearch} />
</div>
</div>
</div>