Expiration date update (distributed-system-analysis#3597)

Fix date picker

Author: MVarshini

dashboard/package.json

@@ -30,6 +30,7 @@
     "react-app-rewired": "^2.2.1",
     "react-bootstrap": "^2.1.2",
     "react-chartjs-2": "^5.2.0",
+    "react-datepicker": "^6.1.0",
     "react-dom": "^17.0.2",
     "react-redux": "^7.2.6",
     "react-router": "6.3.0",

dashboard/src/modules/components/OverviewComponent/NewRunsComponent.jsx

@@ -200,7 +200,7 @@ const NewRunsComponent = () => {
                         saveRowData={saveRowData}
                         rowActions={rowActions}
                         item={item}
-                        onDateSelect={(_event, str) =>
+                        onDateSelect={(str) =>
                           updateTblValue(
                             str,
                             SERVER_DELETION_KEY,

dashboard/src/modules/components/OverviewComponent/SavedRunsComponent.jsx

@@ -204,7 +204,7 @@ const SavedRunsComponent = () => {
                           updateTblValue(val, NAME_KEY, item.resource_id)
                         }
                         toggleEdit={toggleEdit}
-                        onDateSelect={(_event, str) =>
+                        onDateSelect={(str) =>
                           updateTblValue(
                             str,
                             SERVER_DELETION_KEY,

dashboard/src/modules/components/OverviewComponent/common-component.jsx

@@ -1,4 +1,5 @@
 import "./index.less";
+import "react-datepicker/dist/react-datepicker.css";
 
 import * as CONSTANTS from "assets/constants/overviewConstants";
 
@@ -13,7 +14,6 @@ import {
 } from "@patternfly/react-table";
 import {
   Button,
-  DatePicker,
   Dropdown,
   DropdownItem,
   DropdownToggle,
@@ -41,6 +41,7 @@ import {
 } from "actions/overviewActions";
 import { useDispatch, useSelector } from "react-redux";
 
+import DatePicker from "react-datepicker";
 import MetadataTreeView from "./MetadataTreeComponent";
 import { formatDateTime } from "utils/dateFunctions";
 import { setRelayModalState } from "actions/relayActions";
@@ -401,7 +402,10 @@ export const SavedRunsRow = (props) => {
 
 export const SelectDateComponent = (props) => (
   <div className="date-picker-container">
-    <DatePicker value={props.value} onChange={props.onDateSelect} />
+    <DatePicker
+      selected={props.value}
+      onChange={(date) => props.onDateSelect(date)}
+    />
   </div>
 );