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

Fix the JSON style to camelCase and rename CONTRIBUTE.md to CONTRIBUTING.md (#274)

Browse Source 
* Fix the JSON style to camelCase and rename `CONTRIBUTE.md` to `CONTRIBUTING.md`

* Move `CONTRIBUTING.md` to `.github/` directory
This commit is contained in:
M. Mert Yıldıran
2021-09-13 10:55:46 +03:00
committed by GitHub
parent 7f880417e9
commit 30f07479cb
6 changed files with 52 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/src/components/EntriesList.tsx
View File

@@ -54,8 +54,8 @@ export const EntriesList: React.FC<EntriesListProps> = ({entries, setEntries, fo
const filterEntries = useCallback((entry) => {
if(methodsFilter.length > 0 && !methodsFilter.includes(entry.method.toLowerCase())) return;
if(pathFilter && entry.path?.toLowerCase()?.indexOf(pathFilter) === -1) return;
if(statusFilter.includes(StatusType.SUCCESS) && entry.status_code >= 400) return;
if(statusFilter.includes(StatusType.ERROR) && entry.status_code < 400) return;
if(statusFilter.includes(StatusType.SUCCESS) && entry.statusCode >= 400) return;
if(statusFilter.includes(StatusType.ERROR) && entry.statusCode < 400) return;
return entry;
},[methodsFilter, pathFilter, statusFilter])

2
ui/src/components/EntryDetailed.tsx
View File

@@ -72,7 +72,7 @@ export const EntryDetailed: React.FC<EntryDetailedProps> = ({entryData}) => {
/>
{entryData.data && <EntrySummary data={entryData.data}/>}
<>
{entryData.data && <EntryViewer representation={entryData.representation} color={entryData.protocol.background_color}/>}
{entryData.data && <EntryViewer representation={entryData.representation} color={entryData.protocol.backgroundColor}/>}
</>
</>
};

22
ui/src/components/EntryListItem/EntryListItem.tsx
View File

@@ -16,13 +16,13 @@ interface Entry {
summary: string,
service: string,
id: string,
status_code?: number;
statusCode?: number;
url?: string;
timestamp: Date;
source_ip: string,
source_port: string,
destination_ip: string,
destination_port: string,
sourceIp: string,
sourcePort: string,
destinationIp: string,
destinationPort: string,
isOutgoing?: boolean;
latency: number;
rules: Rules;
@@ -41,7 +41,7 @@ interface EntryProps {
}
export const EntryItem: React.FC<EntryProps> = ({entry, setFocusedEntryId, isSelected}) => {
const classification = getClassification(entry.status_code)
const classification = getClassification(entry.statusCode)
let ingoingIcon;
let outgoingIcon;
switch(classification) {
@@ -103,11 +103,11 @@ export const EntryItem: React.FC<EntryProps> = ({entry, setFocusedEntryId, isSel
className={`${styles.row}
${isSelected ? styles.rowSelected : backgroundColor}`}
onClick={() => setFocusedEntryId(entry.id)}
style={{border: isSelected ? `1px ${entry.protocol.background_color} solid` : "1px transparent solid"}}
style={{border: isSelected ? `1px ${entry.protocol.backgroundColor} solid` : "1px transparent solid"}}
>
<Protocol protocol={entry.protocol} horizontal={false}/>
{((entry.protocol.name === "http" && "status_code" in entry) || entry.status_code !== 0) && <div>
<StatusCode statusCode={entry.status_code}/>
{((entry.protocol.name === "http" && "statusCode" in entry) || entry.statusCode !== 0) && <div>
<StatusCode statusCode={entry.statusCode}/>
</div>}
<div className={styles.endpointServiceContainer}>
<EndpointPath method={entry.method} path={entry.summary}/>
@@ -116,13 +116,13 @@ export const EntryItem: React.FC<EntryProps> = ({entry, setFocusedEntryId, isSel
</div>
</div>
<div className={styles.directionContainer}>
<span className={styles.port} title="Source Port">{entry.source_port}</span>
<span className={styles.port} title="Source Port">{entry.sourcePort}</span>
{entry.isOutgoing ?
<img src={outgoingIcon} alt="Ingoing traffic" title="Ingoing"/>
:
<img src={ingoingIcon} alt="Outgoing traffic" title="Outgoing"/>
}
<span className={styles.port} title="Destination Port">{entry.destination_port}</span>
<span className={styles.port} title="Destination Port">{entry.destinationPort}</span>
</div>
<div className={styles.timestamp}>
<span title="Timestamp">

28
ui/src/components/UI/Protocol.tsx
View File

@@ -3,12 +3,12 @@ import styles from './style/Protocol.module.sass';
export interface ProtocolInterface {
name: string
long_name: string
longName: string
abbreviation: string
background_color: string
foreground_color: string
font_size: number
reference_link: string
backgroundColor: string
foregroundColor: string
fontSize: number
referenceLink: string
ports: string[]
inbound_ports: string
}
@@ -20,29 +20,29 @@ interface ProtocolProps {
const Protocol: React.FC<ProtocolProps> = ({protocol, horizontal}) => {
if (horizontal) {
return <a target="_blank" rel="noopener noreferrer" href={protocol.reference_link}>
return <a target="_blank" rel="noopener noreferrer" href={protocol.referenceLink}>
<span
className={`${styles.base} ${styles.horizontal}`}
style={{
backgroundColor: protocol.background_color,
color: protocol.foreground_color,
backgroundColor: protocol.backgroundColor,
color: protocol.foregroundColor,
fontSize: 13,
}}
title={protocol.abbreviation}
>
{protocol.long_name}
{protocol.longName}
</span>
</a>
} else {
return <a target="_blank" rel="noopener noreferrer" href={protocol.reference_link}>
return <a target="_blank" rel="noopener noreferrer" href={protocol.referenceLink}>
<span
className={`${styles.base} ${styles.vertical}`}
style={{
backgroundColor: protocol.background_color,
color: protocol.foreground_color,
fontSize: protocol.font_size,
backgroundColor: protocol.backgroundColor,
color: protocol.foregroundColor,
fontSize: protocol.fontSize,
}}
title={protocol.long_name}
title={protocol.longName}
>
{protocol.abbreviation}
</span>