ANDROID: update web UI dependencies

Author: chrisws

src/platform/android/webui/package.json

@@ -4,20 +4,20 @@
   "private": true,
   "proxy": "http://localhost:8080", 
   "dependencies": {
-    "@emotion/react": "^11.10.5",
-    "@emotion/styled": "^11.10.5",
-    "@mui/icons-material": "^5.10.15",
-    "@mui/material": "^5.10.15",
-    "@mui/x-data-grid": "^5.17.12",
-    "npm-check-updates": "^16.4.3",
+    "@emotion/react": "^11.10.6",
+    "@emotion/styled": "^11.10.6",
+    "@mui/icons-material": "^5.11.11",
+    "@mui/material": "^5.11.14",
+    "@mui/x-data-grid": "^6.0.2",
+    "npm-check-updates": "^16.8.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-scripts": "5.0.1"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "GENERATE_SOURCEMAP=false react-scripts build && rm ../app/src/main/assets/webui/static/js/main.* && cp -R build/* ../app/src/main/assets/webui/",
-    "update": "npm update && ncu"
+    "update": "npm update && ncu -u"
   },
   "eslintConfig": {
     "extends": [

src/platform/android/webui/src/App.js

@@ -45,9 +45,7 @@ const columns = [{
   field: 'fileName',
   headerName: 'Name',
   editable: true,
-  valueGetter: (params) => {
-    return params.row.fileName;
-  },
+  valueGetter: (params) => params.row.fileName,
   flex: 1,
 }, {
   field: 'size',
@@ -58,9 +56,8 @@ const columns = [{
   headerName: 'Modified',
   type: 'date',
   minWidth: 110,
-  renderCell: (params) => {
-    return new Date(params.row.date).toLocaleDateString();
-  }
+  valueGetter: (params) => new Date(params.row.date),
+  renderCell: (params) => params.value.toLocaleDateString()
 }];
 
 function getFetchHeader(body) {
@@ -322,11 +319,11 @@ function FileList(props) {
                 autoPageSize
                 components={{Toolbar: AppToolbar}}
                 componentsProps={{toolbar: toolbarProps}}
-                onSelectionModelChange={(model) => setSelectionModel(model)}
-                selectionModel={selectionModel}
-                rowsPerPageOptions={[5]}
+                onRowSelectionModelChange={(model) => setSelectionModel(model)}
+                rowSelectionModel={selectionModel}
+                pageSizeOptions={[5]}
                 checkboxSelection
-                disableSelectionOnClick/>
+                disableRowSelectionOnClick/>
     </Fragment>
   );
 }