From 56cbd909aaa83737b66b8bb6b803e96d1af6e91f Mon Sep 17 00:00:00 2001
From: pkupczyk <piotr.kupczyk@id.ethz.ch>
Date: Fri, 11 Mar 2022 17:15:06 +0100
Subject: [PATCH] Make lastObjectModifications state work with AppController
using React.Context instead of Redux
---
.../src/js/components/AppController.js | 21 ++++++++++++----
.../js/components/common/browser/Browser.jsx | 10 +++++---
.../common/browser/BrowserButtons.jsx | 17 ++-----------
.../src/js/components/common/grid/Grid.jsx | 9 -------
openbis_ng_ui/src/js/store/sagas/page.js | 24 +++++++++++--------
5 files changed, 39 insertions(+), 42 deletions(-)
diff --git a/openbis_ng_ui/src/js/components/AppController.js b/openbis_ng_ui/src/js/components/AppController.js
index 20f17f11ce5..1d84b4353fc 100644
--- a/openbis_ng_ui/src/js/components/AppController.js
+++ b/openbis_ng_ui/src/js/components/AppController.js
@@ -9,7 +9,7 @@ class AppController {
this.context = context
const initialState = {
- lastObjectModifications: 'abc'
+ lastObjectModifications: {}
}
context.initState(initialState)
@@ -19,10 +19,21 @@ class AppController {
return this.context.getState().lastObjectModifications
}
- setLastObjectModifications(lastObjectModifications) {
- this.context.setState({
- lastObjectModifications: lastObjectModifications
- })
+ setLastObjectModification(type, operation, timestamp) {
+ const { lastObjectModifications } = this.context.getState()
+
+ if (
+ !lastObjectModifications[type] ||
+ !lastObjectModifications[type][operation] ||
+ lastObjectModifications[type][operation] < timestamp
+ ) {
+ this.context.setState({
+ lastObjectModifications: {
+ ...lastObjectModifications,
+ [type]: { ...lastObjectModifications[type], [operation]: timestamp }
+ }
+ })
+ }
}
withLastObjectModifications() {
diff --git a/openbis_ng_ui/src/js/components/common/browser/Browser.jsx b/openbis_ng_ui/src/js/components/common/browser/Browser.jsx
index b610cf3116e..f1980f18cc7 100644
--- a/openbis_ng_ui/src/js/components/common/browser/Browser.jsx
+++ b/openbis_ng_ui/src/js/components/common/browser/Browser.jsx
@@ -8,6 +8,7 @@ import ComponentContext from '@src/js/components/common/ComponentContext.js'
import BrowserNodes from '@src/js/components/common/browser/BrowserNodes.jsx'
import BrowserButtons from '@src/js/components/common/browser/BrowserButtons.jsx'
import BrowserDialogRemoveNode from '@src/js/components/common/browser/BrowserDialogRemoveNode.jsx'
+import AppController from '@src/js/components/AppController.js'
import selectors from '@src/js/store/selectors/selectors.js'
import logger from '@src/js/common/logger.js'
@@ -35,8 +36,7 @@ function mapStateToProps() {
selectedObject: selectors.getSelectedObject(
state,
ownProps.controller.getPage()
- ),
- lastObjectModifications: selectors.getLastObjectModifications(state)
+ )
}
}
}
@@ -124,4 +124,8 @@ class Browser extends React.PureComponent {
}
}
-export default _.flow(connect(mapStateToProps), withStyles(styles))(Browser)
+export default _.flow(
+ connect(mapStateToProps),
+ withStyles(styles),
+ AppController.withLastObjectModifications()
+)(Browser)
diff --git a/openbis_ng_ui/src/js/components/common/browser/BrowserButtons.jsx b/openbis_ng_ui/src/js/components/common/browser/BrowserButtons.jsx
index 4aece59442f..ed6505afb94 100644
--- a/openbis_ng_ui/src/js/components/common/browser/BrowserButtons.jsx
+++ b/openbis_ng_ui/src/js/components/common/browser/BrowserButtons.jsx
@@ -1,4 +1,3 @@
-import _ from 'lodash'
import React from 'react'
import { withStyles } from '@material-ui/core/styles'
import Container from '@src/js/components/common/form/Container.jsx'
@@ -6,8 +5,6 @@ import Button from '@src/js/components/common/form/Button.jsx'
import messages from '@src/js/common/messages.js'
import logger from '@src/js/common/logger.js'
-import AppController from '@src/js/components/AppController.js'
-
const styles = theme => ({
container: {
display: 'flex',
@@ -25,13 +22,7 @@ class BrowserButtons extends React.Component {
render() {
logger.log(logger.DEBUG, 'BrowserButtons.render')
- const {
- controller,
- classes,
- addEnabled,
- removeEnabled,
- lastObjectModifications
- } = this.props
+ const { controller, classes, addEnabled, removeEnabled } = this.props
return (
<Container className={classes.container}>
@@ -49,13 +40,9 @@ class BrowserButtons extends React.Component {
onClick={controller.nodeRemove}
disabled={!removeEnabled}
/>
- {lastObjectModifications}
</Container>
)
}
}
-export default _.flow(
- withStyles(styles),
- AppController.withLastObjectModifications()
-)(BrowserButtons)
+export default withStyles(styles)(BrowserButtons)
diff --git a/openbis_ng_ui/src/js/components/common/grid/Grid.jsx b/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
index 2ff2aa5e6e1..c92e7f64234 100644
--- a/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
+++ b/openbis_ng_ui/src/js/components/common/grid/Grid.jsx
@@ -19,8 +19,6 @@ import GridFiltersConfig from '@src/js/components/common/grid/GridFiltersConfig.
import ComponentContext from '@src/js/components/common/ComponentContext.js'
import logger from '@src/js/common/logger.js'
-import AppController from '@src/js/components/AppController.js'
-
const styles = theme => ({
container: {
minWidth: '800px',
@@ -178,13 +176,6 @@ class Grid extends React.PureComponent {
{this.renderPaging()}
{this.renderConfigs()}
{this.renderExports()}
- <button
- onClick={() => {
- AppController.setLastObjectModifications(Math.random())
- }}
- >
- Test
- </button>
</GridRowFullWidth>
)
}
diff --git a/openbis_ng_ui/src/js/store/sagas/page.js b/openbis_ng_ui/src/js/store/sagas/page.js
index 19ab3934782..97d92c09433 100644
--- a/openbis_ng_ui/src/js/store/sagas/page.js
+++ b/openbis_ng_ui/src/js/store/sagas/page.js
@@ -5,6 +5,8 @@ import actions from '@src/js/store/actions/actions.js'
import routes from '@src/js/common/consts/routes.js'
import objectOperation from '@src/js/common/consts/objectOperation.js'
+import AppController from '@src/js/components/AppController.js'
+
export default function* pageSaga() {
yield takeEvery(actions.OBJECT_NEW, objectNew)
yield takeEvery(actions.OBJECT_CREATE, objectCreate)
@@ -46,12 +48,10 @@ function* objectCreate(action) {
}
yield put(actions.replaceOpenTab(page, oldTab.id, newTab))
- yield put(
- actions.setLastObjectModification(
- newType,
- objectOperation.CREATE,
- Date.now()
- )
+ yield AppController.setLastObjectModification(
+ newType,
+ objectOperation.CREATE,
+ Date.now()
)
const route = routes.format({ page, type: newType, id: newId })
@@ -67,16 +67,20 @@ function* objectOpen(action) {
function* objectUpdate(action) {
const { type } = action.payload
- yield put(
- actions.setLastObjectModification(type, objectOperation.UPDATE, Date.now())
+ yield AppController.setLastObjectModification(
+ type,
+ objectOperation.UPDATE,
+ Date.now()
)
}
function* objectDelete(action) {
const { page, type, id } = action.payload
yield put(actions.objectClose(page, type, id))
- yield put(
- actions.setLastObjectModification(type, objectOperation.DELETE, Date.now())
+ yield AppController.setLastObjectModification(
+ type,
+ objectOperation.DELETE,
+ Date.now()
)
}
--
GitLab