Skip to content

Commit 4d5f732

Browse files
arunjaindevarunjaindev
committed
feat: upgrade to react 18
1 parent 9b07131 commit 4d5f732

12 files changed

Lines changed: 3901 additions & 2991 deletions

File tree

‎package-lock.json‎

Lines changed: 3860 additions & 2817 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@devtron-labs/devtron-fe-common-lib",
3-
"version": "1.22.0-alpha-11",
3+
"version": "1.22.0-beta-7",
44
"description": "Supporting common component library",
55
"type": "module",
66
"main": "dist/index.js",
@@ -42,15 +42,13 @@
4242
"@sentry/browser": "^7.119.1",
4343
"@tanstack/eslint-plugin-query": "<5",
4444
"@tanstack/react-query-devtools": "<5",
45-
"@testing-library/jest-dom": "^5.16.2",
46-
"@testing-library/react": "^12.1.4",
4745
"@tippyjs/react": "^4.2.0",
4846
"@typeform/embed-react": "2.20.0",
4947
"@types/dompurify": "^3.0.5",
5048
"@types/json-schema": "^7.0.15",
51-
"@types/react": "17.0.39",
49+
"@types/react": "^18.3.27",
5250
"@types/react-csv": "^1.1.10",
53-
"@types/react-dom": "17.0.13",
51+
"@types/react-dom": "^18.3.7",
5452
"@types/react-router-dom": "^5.3.3",
5553
"@typescript-eslint/eslint-plugin": "8.3.0",
5654
"@typescript-eslint/parser": "8.3.0",
@@ -89,8 +87,8 @@
8987
"@typeform/embed-react": "2.20.0",
9088
"dompurify": "^3.2.4",
9189
"patch-package": "^8.0.0",
92-
"react": "^17.0.2",
93-
"react-dom": "^17.0.2",
90+
"react": "^18.3.1",
91+
"react-dom": "^18.3.1",
9492
"react-ga4": "^1.4.1",
9593
"react-router-dom": "^5.3.0",
9694
"react-select": "5.8.0",
@@ -117,7 +115,7 @@
117115
"@uiw/react-md-editor": "^4.0.11",
118116
"@xyflow/react": "12.4.2",
119117
"ansi_up": "^5.2.1",
120-
"chart.js": "^4.5.0",
118+
"chart.js": "4.5.0",
121119
"codemirror-json-schema": "0.8.0",
122120
"cronstrue": "^3.9.0",
123121
"dayjs": "^1.11.13",
@@ -143,8 +141,8 @@
143141
"vite": "6.3.5"
144142
},
145143
"react-virtualized-sticky-tree": {
146-
"react": "^17.0.2",
147-
"react-dom": "^17.0.2"
144+
"react": "^18.3.1",
145+
"react-dom": "^18.3.1"
148146
}
149147
}
150148
}

‎src/Common/ClipboardButton/__tests__/ClipboardButton.test.tsx‎

Lines changed: 0 additions & 59 deletions
This file was deleted.

‎src/Common/DebouncedSearch/__tests__/DebouncedSearch.test.tsx‎

Lines changed: 0 additions & 77 deletions
This file was deleted.

‎src/Common/Dialogs/DialogForm.tsx‎

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

17-
import React, { Component, createContext } from 'react'
17+
import { Component, createContext, PropsWithChildren } from 'react'
1818
import { VisibleModal } from '../Modals/VisibleModal'
1919
import close from '../../Assets/Icon/ic-cross.svg'
2020
import { Progressing } from '../Progressing'
2121
import { DialogFormProps } from './Types'
2222
// TODO: may not need context
2323
const DialogFormContext = createContext({ title: '', isLoading: false, close: (event) => {}, onSave: (event) => {} })
2424

25-
export class DialogForm extends Component<DialogFormProps> {
25+
export class DialogForm extends Component<PropsWithChildren<DialogFormProps>> {
2626
constructor(props) {
2727
super(props)
2828
this.escFunction = this.escFunction.bind(this)
@@ -83,7 +83,7 @@ export class DialogForm extends Component<DialogFormProps> {
8383
}
8484
}
8585

86-
export class DialogFormSubmit extends Component<{ tabIndex: number }> {
86+
export class DialogFormSubmit extends Component<PropsWithChildren<{ tabIndex: number }>> {
8787
render() {
8888
return (
8989
<DialogFormContext.Consumer>

‎src/Common/Modals/VisibleModal.tsx‎

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

17-
import React, { SyntheticEvent } from 'react'
17+
import { Component, PropsWithChildren, SyntheticEvent } from 'react'
1818

1919
import { DTFocusTrapType } from '@Shared/Components/DTFocusTrap'
2020

2121
import { Backdrop, POP_UP_MENU_MODAL_ID } from '../../Shared'
2222

23-
export class VisibleModal extends React.Component<{
23+
export class VisibleModal extends Component<PropsWithChildren<{
2424
className?: string
2525
parentClassName?: string
2626
noBackground?: boolean
2727
close?: (e?) => void
2828
onEscape?: (e?) => void
2929
initialFocus?: DTFocusTrapType['initialFocus']
30-
}> {
30+
}>> {
3131
constructor(props) {
3232
super(props)
3333
this.escFunction = this.escFunction.bind(this)

‎src/Common/Modals/VisibleModal2.tsx‎

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

17-
import React, { SyntheticEvent } from 'react'
17+
import { Component, PropsWithChildren, SyntheticEvent } from 'react'
1818
import { Backdrop } from '@Shared/Components'
1919
import { DTFocusTrapType } from '@Shared/Components/DTFocusTrap'
2020
import { noop } from '@Common/Helper'
2121

22-
export class VisibleModal2 extends React.Component<{
22+
export class VisibleModal2 extends Component<PropsWithChildren<{
2323
className?: string
2424
close?: (e?) => void
2525
initialFocus?: DTFocusTrapType['initialFocus']
26-
}> {
26+
}>> {
2727
constructor(props) {
2828
super(props)
2929
}

‎src/Shared/Components/BulkOperations/types.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export type OtherStatusOperationType = {
5353

5454
export type BulkOperationResultType = {
5555
message?: string
56-
renderContentAtResultRowEnd?: () => void
56+
renderContentAtResultRowEnd?: () => ReactNode
5757
} & (FailedOperationType | OtherStatusOperationType) &
5858
Pick<BulkOperation, 'name' | 'additionalKeys'>
5959

@@ -98,7 +98,8 @@ export type BulkOperationModalProps = {
9898
Pick<DrawerProps, 'disableTransition'>
9999

100100
export interface BulkOperationsResultModalProps
101-
extends Pick<BulkOperationModalProps, 'handleModalClose' | 'getResultsChartSummaryText' | 'disableTransition'>,
101+
extends
102+
Pick<BulkOperationModalProps, 'handleModalClose' | 'getResultsChartSummaryText' | 'disableTransition'>,
102103
Pick<BulkOperationModalProps['textConfig'], 'resultsHeader'> {
103104
resultsStore: OperationResultStoreType
104105
apiCallInProgress: boolean

‎src/Shared/Components/Security/SecurityModal/components/Table.tsx‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -120,15 +120,19 @@ const Table: React.FC<TablePropsType> = ({ headers, rows, defaultSortIndex, hasE
120120
</button>
121121
)}
122122
<div className="flexbox dc__content-space w-100">
123-
{row.cells.map((cell, index) => (
124-
<div
125-
className="flexbox dc__align-start dc__content-start fs-13 lh-20 fw-4 dc__word-break"
126-
style={{ width: `${headers[index].width}px` }}
127-
data-testid={`security-table-cell-${rowIndex}:${index}`}
128-
>
129-
{cell.component || cell.cellContent}
130-
</div>
131-
))}
123+
{row.cells.map((cell, index) => {
124+
const CellComponent =
125+
cell.component ?? (typeof cell.cellContent === 'string' ? cell.cellContent : null)
126+
return CellComponent ? (
127+
<div
128+
className="flexbox dc__align-start dc__content-start fs-13 lh-20 fw-4 dc__word-break"
129+
style={{ width: `${headers[index].width}px` }}
130+
data-testid={`security-table-cell-${rowIndex}:${index}`}
131+
>
132+
{CellComponent}
133+
</div>
134+
) : null
135+
})}
132136
</div>
133137
</div>
134138
{hasExpandableRows && rowExpandedStateArray[rowIndex] && row.expandableComponent}

‎src/Shared/Components/Security/SecurityModal/config/CodeScan.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ import {
4343
stringifySeverities,
4444
} from '../utils'
4545

46-
export const getCodeScanVulnerabilities = (data: CodeScan['vulnerability'], hidePolicy: boolean) => ({
46+
export const getCodeScanVulnerabilities = (data: CodeScan['vulnerability'], hidePolicy: boolean): TablePropsType => ({
4747
headers: [
4848
{ headerText: 'cve id', isSortable: false, width: 150 },
4949
{
@@ -107,7 +107,7 @@ export const getCodeScanVulnerabilities = (data: CodeScan['vulnerability'], hide
107107
defaultSortIndex: 1,
108108
})
109109

110-
export const getCodeScanLicense = (data: CodeScan['license']) => ({
110+
export const getCodeScanLicense = (data: CodeScan['license']): TablePropsType => ({
111111
headers: [
112112
{ headerText: 'classification', isSortable: false, width: 150 },
113113
{
@@ -242,7 +242,7 @@ export const getCodeScanMisconfigurations = (
242242
status: StatusType['status'],
243243
scanToolName: StatusType['scanToolName'],
244244
scanToolUrl: StatusType['scanToolUrl'],
245-
) => ({
245+
): TablePropsType => ({
246246
headers: [
247247
{ headerText: 'file path (relative)', isSortable: true, width: 289 },
248248
{ headerText: 'scan summary', isSortable: true, width: 289, compareFunc: compareSeverities },
@@ -347,7 +347,7 @@ export const getCodeScanExposedSecrets = (
347347
status: StatusType['status'],
348348
scanToolName: StatusType['scanToolName'],
349349
scanToolUrl: StatusType['scanToolUrl'],
350-
) => ({
350+
): TablePropsType => ({
351351
headers: [
352352
{ headerText: 'file path (relative)', isSortable: true, width: 372 },
353353
{ headerText: 'scan summary', isSortable: true, width: 372, compareFunc: compareSeverities },

0 commit comments

Comments
 (0)