Upgrade the package.json dependencies to the recent versions.

Issue-ID: AIMLFW-111

Change-Id: Ib289a9e5dc4d1d1c2528d8a7f29901e8818fba5c
Signed-off-by: Taewan Kim <t25.kim@samsung.com>

diff --git a/package.json b/package.json
index b5a7c0e..3e7125c 100644 (file)
--- a/package.json
+++ b/package.json
@@ -3,20 +3,20 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@testing-library/jest-dom": "^5.12.0",
-    "@testing-library/react": "^11.2.6",
-    "@testing-library/user-event": "^12.8.3",
-    "axios": "^0.21.1",
-    "bootstrap": "^4.6.0",
-    "react": "^17.0.2",
-    "react-bootstrap": "^1.5.2",
-    "react-dom": "^17.0.2",
-    "react-google-charts": "^3.0.15",
-    "react-router-dom": "^5.3.0",
+    "@testing-library/jest-dom": "^6.4.8",
+    "@testing-library/react": "^16.0.0",
+    "@testing-library/user-event": "^14.5.2",
+    "axios": "^1.7.3",
+    "bootstrap": "^5.3.3",
+    "react": "^18.3.1",
+    "react-bootstrap": "^2.10.4",
+    "react-dom": "^18.3.1",
+    "react-google-charts": "^4.0.1",
+    "react-router-dom": "^6.26.0",
     "react-scripts": "^5.0.1",
-    "react-table": "^7.7.0",
-    "recharts": "^2.1.8",
-    "web-vitals": "^1.1.1"
+    "react-table": "^7.8.0",
+    "recharts": "^2.12.7",
+    "web-vitals": "^4.2.2"
   },
   "scripts": {
     "start": "react-scripts start",
@@ -30,6 +30,7 @@
       "react-app/jest"
     ]
   },
+
   "browserslist": {
     "production": [
       ">0.2%",
@@ -43,12 +44,13 @@
     ]
   },
   "devDependencies": {
+    "@babel/plugin-transform-private-property-in-object": "^7.24.7",
     "@eslint/js": "^9.8.0",
     "eslint": "^9.8.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.35.0",
-    "globals": "^15.8.0",
+    "globals": "^15.9.0",
     "prettier": "^3.3.3"
   }
 }

diff --git a/src/components/home/HomePage.js b/src/components/home/HomePage.js
index 35b2060..e5a451b 100644 (file)
--- a/src/components/home/HomePage.js
+++ b/src/components/home/HomePage.js
@@ -21,7 +21,7 @@ import CreateTrainingJob from './create/CreateTrainingJob';
 import StatusPageRows from './status/StatusPageRows';
 import UploadPipelineForm from './pipelines/UploadPipeline';
 import CreateFeatureGroup from './create/CreateFeatureGroup';
-import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
 import NavbarComponent from './navbar/NavbarComponent';
 import * as CONSTANTS from './common/Constants';
 import ListFeatureGroup from './status/ListFeatureGroup';
@@ -39,14 +39,14 @@ class HomePage extends React.Component {
       <>
         <Router>
           <NavbarComponent />
-          <Switch>
+          <Routes>
             <Route path='/' exact component={Home} />
-            <Route path='/TrainingJob/CreateTrainingJob' render={() => <CreateTrainingJob logger={logger} />} />
-            <Route path='/TrainingJob/TrainingJobsStatus' render={() => <StatusPageRows logger={logger} />} />
-            <Route path='/TrainingJob/Pipeline' render={() => <UploadPipelineForm logger={logger} />} />
-            <Route path='/TrainingJob/CreateFeatureGroup' render={() => <CreateFeatureGroup logger={logger} />} />
-            <Route path='/TrainingJob/ListFeatureGroups' render={() => <ListFeatureGroup logger={logger} />} />
-          </Switch>
+            <Route path='/TrainingJob/CreateTrainingJob' element={<CreateTrainingJob logger={logger} />} />
+            <Route path='/TrainingJob/TrainingJobsStatus' element={<StatusPageRows logger={logger} />} />
+            <Route path='/TrainingJob/Pipeline' element={<UploadPipelineForm logger={logger} />} />
+            <Route path='/TrainingJob/CreateFeatureGroup' element={<CreateFeatureGroup logger={logger} />} />
+            <Route path='/TrainingJob/ListFeatureGroups' element={<ListFeatureGroup logger={logger} />} />
+          </Routes>
         </Router>
       </>
     );

diff --git a/src/components/home/create/CreateFeatureGroup.js b/src/components/home/create/CreateFeatureGroup.js
index 662834a..1035a96 100644 (file)
--- a/src/components/home/create/CreateFeatureGroup.js
+++ b/src/components/home/create/CreateFeatureGroup.js
@@ -28,8 +28,8 @@ class CreateFeatureGroup extends React.Component {
   }
   popover = () => (
     <Popover id='popover-basic'>
-      <Popover.Title as='h3'>Field descriptions</Popover.Title>
-      <Popover.Content>
+      <Popover.Header as='h3'>Field descriptions</Popover.Header>
+      <Popover.Body>
         <strong>Feature Group Name</strong>
         <br></br>
         Name of the Feature Group<br></br>
@@ -51,7 +51,7 @@ class CreateFeatureGroup extends React.Component {
         <br></br>
         Select DME to add the dme job info like SourceName, Measured Obj Class and dmePort.
         <br></br>
-      </Popover.Content>
+      </Popover.Body>
     </Popover>
   );
   render() {

diff --git a/src/components/home/create/CreateTrainingJob.js b/src/components/home/create/CreateTrainingJob.js
index a1aef48..14505f3 100644 (file)
--- a/src/components/home/create/CreateTrainingJob.js
+++ b/src/components/home/create/CreateTrainingJob.js
@@ -29,8 +29,8 @@ class CreateTrainingJob extends React.Component {
   }
   popover = () => (
     <Popover id='popover-basic'>
-      <Popover.Title as='h3'>Field descriptions</Popover.Title>
-      <Popover.Content>
+      <Popover.Header as='h3'>Field descriptions</Popover.Header>
+      <Popover.Body>
         <strong>Training Job Name</strong>
         <br></br>
         Name of the Training Job. <br></br>
@@ -70,7 +70,7 @@ class CreateTrainingJob extends React.Component {
         <br></br>
         Description of Training-job
         <br></br>
-      </Popover.Content>
+      </Popover.Body>
     </Popover>
   );
 

diff --git a/src/components/home/navbar/NavbarComponent.js b/src/components/home/navbar/NavbarComponent.js
index ff1376f..fe257f0 100644 (file)
--- a/src/components/home/navbar/NavbarComponent.js
+++ b/src/components/home/navbar/NavbarComponent.js
@@ -18,7 +18,6 @@
 
 import React from 'react';
 import { Container, Nav, Navbar, NavDropdown } from 'react-bootstrap';
-import { Link } from 'react-router-dom';
 import './NavbarComponent.css';
 function NavbarComponent() {
   return (

diff --git a/src/components/home/pipelines/UploadPipeline.js b/src/components/home/pipelines/UploadPipeline.js
index 377de33..1bc6cd7 100644 (file)
--- a/src/components/home/pipelines/UploadPipeline.js
+++ b/src/components/home/pipelines/UploadPipeline.js
@@ -35,18 +35,20 @@ class UploadPipelineForm extends React.Component {
     };
     this.handleInputChange = this.handleInputChange.bind(this);
   }
+
   popover = () => (
     <Popover id='popover-basic'>
-      <Popover.Title as='h3'>Field descriptions</Popover.Title>
-      <Popover.Content>
+      <Popover.Header as='h3'>Field descriptions</Popover.Header>
+      <Popover.Body>
         <strong> Training Function Name</strong>
         <br></br>
         Name of the Training Function. <br></br>
         should only contain lower or upper case alphanumerical characters and underscore <br></br>
         <br></br>
-      </Popover.Content>
+      </Popover.Body>
     </Popover>
   );
+
   handleInputChange(event) {
     console.log(event);
     this.setState({