Skip to content

Commit 49a3bee

Browse files
RohitRaj011RohitRaj011
committed
Merge branch 'develop' of github.com:devtron-labs/devtron-fe-common-lib into feat/config-diff-phase-1
2 parents b2f1a8a + 47128b8 commit 49a3bee

File tree

23 files changed

+381
-208
lines changed

23 files changed

+381
-208
lines changed

‎src/Assets/Img/delete-medium.svg

Lines changed: 9 additions & 13 deletions
Loading

‎src/Common/CodeEditor/CodeEditor.tsx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,18 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
115115
},
116116
})
117117

118+
monaco.editor.defineTheme(CodeEditorThemesKeys.networkStatusInterface, {
119+
base: 'vs-dark',
120+
inherit: true,
121+
rules: [
122+
// @ts-ignore
123+
{ background: '#1A1A1A' },
124+
],
125+
colors: {
126+
'editor.background': '#1A1A1A',
127+
},
128+
})
129+
118130
monaco.editor.defineTheme(CodeEditorThemesKeys.deleteDraft, {
119131
base: 'vs',
120132
inherit: true,

‎src/Common/CodeEditor/types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@ export enum CodeEditorThemesKeys {
8484
deleteDraft = 'delete-draft',
8585
unpublished = 'unpublished',
8686
vs = 'vs',
87+
networkStatusInterface = 'network-status-interface',
8788
}
8889

8990
export interface CodeEditorInitialValueType {

‎src/Common/Constants.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ export const URLS = {
6262
GLOBAL_CONFIG_DOCKER: '/global-config/docker',
6363
DEPLOYMENT_HISTORY_CONFIGURATIONS: '/configuration',
6464
GLOBAL_CONFIG_SCOPED_VARIABLES: '/global-config/scoped-variables',
65+
NETWORK_STATUS_INTERFACE: '/network-status-interface',
6566
}
6667

6768
export const ROUTES = {
@@ -96,6 +97,9 @@ export const ROUTES = {
9697
CONFIG_CD_PIPELINE: 'config/cd-pipeline',
9798
MODULE_CONFIGURED: 'module/config',
9899
RESOURCE_HISTORY_DEPLOYMENT: 'resource/history/deployment',
100+
ATTRIBUTES: 'attributes',
101+
ATTRIBUTES_CREATE: 'attributes/create',
102+
ATTRIBUTES_UPDATE: 'attributes/update',
99103
APP_LIST_MIN: 'app/min',
100104
CLUSTER_LIST_MIN: 'cluster/autocomplete',
101105
PLUGIN_GLOBAL_LIST_DETAIL_V2: 'plugin/global/list/detail/v2',
@@ -522,3 +526,11 @@ export const DATE_TIME_FORMATS = {
522526
DD_MMM_YYYY_HH_MM: 'DD MMM YYYY, hh:mm',
523527
DD_MMM_YYYY: 'DD MMM YYYY',
524528
}
529+
530+
export const VULNERABILITIES_SORT_PRIORITY = {
531+
critical: 1,
532+
high: 2,
533+
medium: 3,
534+
low: 4,
535+
unknown: 5,
536+
}

‎src/Common/SearchBar/SearchBar.component.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ const SearchBar = ({
125125
}
126126

127127
return (
128-
<div className={containerClassName}>
128+
<div className={`search-bar-container ${containerClassName || ''}`}>
129129
<div
130130
className={`search-bar ${noBackgroundAndBorder ? 'dc__no-border dc__no-background dc__hover-n50' : 'bc-n50 en-2 dc__hover-border-n300'} focus-within-border-b5 dc__block w-100 min-w-200 dc__position-rel br-4 bw-1 ${getSearchBarHeightFromSize(size)}`}
131131
>

‎src/Common/Security/ScanVulnerabilitiesTable.tsx

Lines changed: 71 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,45 @@
1414
* limitations under the License.
1515
*/
1616

17-
import React from 'react'
1817
import DOMPurify from 'dompurify'
1918
import { ScanVulnerabilitiesTableProps, VulnerabilityType } from '../Types'
2019
import './scanVulnerabilities.css'
20+
import { SortableTableHeaderCell } from '@Common/SortableTableHeaderCell'
21+
import { useMemo } from 'react'
22+
import { numberComparatorBySortOrder, stringComparatorBySortOrder } from '@Shared/Helpers'
23+
import { VulnerabilitiesTableSortKeys } from './types'
24+
import { VULNERABILITIES_SORT_PRIORITY } from '@Common/Constants'
25+
import { useStateFilters } from '@Common/Hooks'
26+
27+
// To be replaced with Scan V2 Modal Table
28+
export default function ScanVulnerabilitiesTable({
29+
vulnerabilities,
30+
hidePolicy,
31+
shouldStick,
32+
}: ScanVulnerabilitiesTableProps) {
33+
const { sortBy, sortOrder, handleSorting } = useStateFilters<VulnerabilitiesTableSortKeys>({
34+
initialSortKey: VulnerabilitiesTableSortKeys.SEVERITY,
35+
})
36+
37+
const sortedVulnerabilities = useMemo(
38+
() =>
39+
vulnerabilities.sort((a, b) => {
40+
if (sortBy === VulnerabilitiesTableSortKeys.PACKAGE) {
41+
return stringComparatorBySortOrder(a.package, b.package, sortOrder)
42+
}
43+
44+
return numberComparatorBySortOrder(
45+
VULNERABILITIES_SORT_PRIORITY[a.severity],
46+
VULNERABILITIES_SORT_PRIORITY[b.severity],
47+
sortOrder,
48+
)
49+
}),
50+
[sortBy, sortOrder, vulnerabilities],
51+
)
52+
53+
const triggerSeveritySorting = () => handleSorting(VulnerabilitiesTableSortKeys.SEVERITY)
54+
const triggerPackageSorting = () => handleSorting(VulnerabilitiesTableSortKeys.PACKAGE)
2155

22-
export default function ScanVulnerabilitiesTable({ vulnerabilities, hidePolicy, shouldStick }: ScanVulnerabilitiesTableProps) {
2356
const renderRow = (vulnerability: VulnerabilityType) => (
2457
<tr
2558
className="dc__security-tab__table-row cursor"
@@ -37,14 +70,21 @@ export default function ScanVulnerabilitiesTable({ vulnerabilities, hidePolicy,
3770
</a>
3871
</td>
3972
<td className="security-tab__cell-severity">
40-
<span className={`dc__fill-${vulnerability.severity?.toLowerCase()}`}>{vulnerability.severity}</span>
73+
<span
74+
className={`severity-chip severity-chip--${vulnerability.severity?.toLowerCase()} dc__capitalize dc__w-fit-content`}
75+
>
76+
{vulnerability.severity}
77+
</span>
4178
</td>
4279
<td className="security-tab__cell-package">{vulnerability.package}</td>
4380
{/* QUERY: Do we need to add DOMPurify at any other key for this table as well? */}
4481
<td className="security-tab__cell-current-ver">
45-
<p className="m-0 cn-9 fs-13 fw-4" dangerouslySetInnerHTML={{
46-
__html: DOMPurify.sanitize(vulnerability.version)
47-
}} />
82+
<p
83+
className="m-0 cn-9 fs-13 fw-4"
84+
dangerouslySetInnerHTML={{
85+
__html: DOMPurify.sanitize(vulnerability.version),
86+
}}
87+
/>
4888
</td>
4989
<td className="security-tab__cell-fixed-ver">{vulnerability.fixedVersion}</td>
5090
{!hidePolicy && (
@@ -60,17 +100,35 @@ export default function ScanVulnerabilitiesTable({ vulnerabilities, hidePolicy,
60100
return (
61101
<table className="security-tab__table">
62102
<tbody>
63-
<tr className={`security-tab__table-header ${shouldStick ? 'dc__position-sticky bcn-0 dc__zi-4 dc__top-0' : ''}`}>
103+
<tr
104+
className={`security-tab__table-header ${shouldStick ? 'dc__position-sticky bcn-0 dc__zi-4 dc__top-0' : ''}`}
105+
>
64106
<th className="security-cell-header security-tab__cell-cve">CVE</th>
65-
<th className="security-cell-header security-tab__cell-severity">Severity</th>
66-
<th className="security-cell-header security-tab__cell-package">Package</th>
107+
<th className="security-cell-header security-tab__cell-severity">
108+
<SortableTableHeaderCell
109+
title="Severity"
110+
isSorted={sortBy === VulnerabilitiesTableSortKeys.SEVERITY}
111+
isSortable
112+
sortOrder={sortOrder}
113+
triggerSorting={triggerSeveritySorting}
114+
disabled={false}
115+
/>
116+
</th>
117+
<th className="security-cell-header security-tab__cell-package">
118+
<SortableTableHeaderCell
119+
title="Package"
120+
isSorted={sortBy === VulnerabilitiesTableSortKeys.PACKAGE}
121+
isSortable
122+
sortOrder={sortOrder}
123+
triggerSorting={triggerPackageSorting}
124+
disabled={false}
125+
/>
126+
</th>
67127
<th className="security-cell-header security-tab__cell-current-ver">Current Version</th>
68128
<th className="security-cell-header security-tab__cell-fixed-ver">Fixed In Version</th>
69-
{!hidePolicy && (
70-
<th className="security-cell-header security-tab__cell-policy">Policy</th>
71-
)}
129+
{!hidePolicy && <th className="security-cell-header security-tab__cell-policy">Policy</th>}
72130
</tr>
73-
{vulnerabilities.map((vulnerability) => renderRow(vulnerability))}
131+
{sortedVulnerabilities.map((vulnerability) => renderRow(vulnerability))}
74132
</tbody>
75133
</table>
76134
)

‎src/Common/Security/types.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export enum VulnerabilitiesTableSortKeys {
2+
SEVERITY = 'severity',
3+
PACKAGE = 'package',
4+
}

‎src/Common/SegmentedBarChart/SegmentedBarChart.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,9 @@ const SegmentedBarChart: React.FC<SegmentedBarChartProps> = ({
2626
labelClassName,
2727
}) => {
2828
const total = entities.reduce((sum, entity) => entity.value + sum, 0)
29+
const filteredEntities = entities.filter((entity) => entity.value)
2930

30-
const calcSegmentWidth = (entity: Entity) => {
31-
if (!entity.value) {
32-
return '100%'
33-
}
34-
return `${(entity.value / total) * 100}%`
35-
}
31+
const calcSegmentWidth = (entity: Entity) => `${(entity.value / total) * 100}%`
3632

3733
return (
3834
<div className={`flexbox-col w-100 dc__gap-12 ${rootClassName}`}>
@@ -50,7 +46,7 @@ const SegmentedBarChart: React.FC<SegmentedBarChartProps> = ({
5046
))}
5147
</div>
5248
<div className="flexbox dc__gap-2">
53-
{entities?.map((entity, index, map) => (
49+
{filteredEntities?.map((entity, index, map) => (
5450
<div
5551
key={entity.label}
5652
className={`h-8 ${index === 0 ? 'dc__left-radius-4' : ''} ${

‎src/Common/SortableTableHeaderCell/SortableTableHeaderCell.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,12 +52,12 @@ const SortableTableHeaderCell = ({
5252
if (isSorted) {
5353
return (
5454
<SortArrowDown
55-
className={`icon-dim-12 mw-12 scn-7 dc__transition--transform ${sortOrder === SortingOrder.DESC ? 'dc__flip-180' : ''}`}
55+
className={`icon-dim-12 mw-12 scn-7 dc__no-shrink dc__transition--transform ${sortOrder === SortingOrder.DESC ? 'dc__flip-180' : ''}`}
5656
/>
5757
)
5858
}
5959

60-
return <SortIcon className="icon-dim-12 mw-12 scn-7" />
60+
return <SortIcon className="icon-dim-12 mw-12 scn-7 dc__no-shrink" />
6161
}
6262

6363
return (

‎src/Common/Types.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import React, { ReactNode, CSSProperties } from 'react'
1818
import { Placement } from 'tippy.js'
1919
import { ImageComment, ReleaseTag } from './ImageTags.Types'
2020
import { ACTION_STATE, DEPLOYMENT_WINDOW_TYPE, DockerConfigOverrideType, SortingOrder, TaskErrorObj } from '.'
21-
import { RegistryType } from '../Shared'
21+
import { RegistryType, Severity } from '../Shared'
2222

2323
/**
2424
* Generic response type object with support for overriding the result type
@@ -569,7 +569,7 @@ export enum DeploymentAppTypes {
569569

570570
export interface VulnerabilityType {
571571
name: string
572-
severity: 'CRITICAL' | 'MODERATE' | 'LOW'
572+
severity: Severity
573573
package: string
574574
version: string
575575
fixedVersion: string

0 commit comments

Comments
 (0)