From a08b21637615d3149767dc9d58ac79ebe1d5b4d7 Mon Sep 17 00:00:00 2001
From: pkupczyk <piotr.kupczyk@id.ethz.ch>
Date: Tue, 9 Apr 2019 21:27:02 +0200
Subject: [PATCH] SSDM-7569 NEW openBIS UI - General Template/Infrastructure
for Forms - Visualisation/Creation/Edit - open dedicated content components
depending on a selected object type + simplify browserNodeSelect action
(remove object parameter)
---
.../src/components/browser/Browser.jsx | 2 +-
.../src/components/browser/BrowserNodes.jsx | 2 +-
.../src/components/content/Content.jsx | 25 ++++++++++++++++---
.../src/components/content/ContentTab.jsx | 14 -----------
.../content/collectionType/CollectionType.jsx | 13 ++++++++++
.../content/dataSetType/DataSetType.jsx | 13 ++++++++++
.../src/components/content/group/Group.jsx | 13 ++++++++++
.../content/materialType/MaterialType.jsx | 13 ++++++++++
.../content/objectType/ObjectType.jsx | 13 ++++++++++
.../src/components/content/user/User.jsx | 13 ++++++++++
openbis_ng_ui/src/store/actions/browser.js | 5 ++--
openbis_ng_ui/src/store/consts/objectType.js | 6 +++++
.../src/store/sagas/browser/browser.js | 15 ++++++++---
.../src/store/sagas/browser/types.js | 9 ++++---
.../src/store/sagas/browser/users.js | 9 ++++---
.../srcTest/store/sagas/browser.test.js | 5 ++--
.../srcTest/store/sagas/page.test.js | 7 +++---
17 files changed, 137 insertions(+), 40 deletions(-)
delete mode 100644 openbis_ng_ui/src/components/content/ContentTab.jsx
create mode 100644 openbis_ng_ui/src/components/content/collectionType/CollectionType.jsx
create mode 100644 openbis_ng_ui/src/components/content/dataSetType/DataSetType.jsx
create mode 100644 openbis_ng_ui/src/components/content/group/Group.jsx
create mode 100644 openbis_ng_ui/src/components/content/materialType/MaterialType.jsx
create mode 100644 openbis_ng_ui/src/components/content/objectType/ObjectType.jsx
create mode 100644 openbis_ng_ui/src/components/content/user/User.jsx
create mode 100644 openbis_ng_ui/src/store/consts/objectType.js
diff --git a/openbis_ng_ui/src/components/browser/Browser.jsx b/openbis_ng_ui/src/components/browser/Browser.jsx
index 8d6bb245241..90956174cb7 100644
--- a/openbis_ng_ui/src/components/browser/Browser.jsx
+++ b/openbis_ng_ui/src/components/browser/Browser.jsx
@@ -27,7 +27,7 @@ function mapDispatchToProps(dispatch){
init: (page) => { dispatch(actions.browserInit(page)) },
release: (page) => { dispatch(actions.browserRelease(page)) },
filterChange: (event) => { dispatch(actions.browserFilterChange(getCurrentPage(), event.currentTarget.value)) },
- nodeSelect: (id, object) => { dispatch(actions.browserNodeSelect(getCurrentPage(), id, object)) },
+ nodeSelect: (id) => { dispatch(actions.browserNodeSelect(getCurrentPage(), id)) },
nodeExpand: (id) => { dispatch(actions.browserNodeExpand(getCurrentPage(), id)) },
nodeCollapse: (id) => { dispatch(actions.browserNodeCollapse(getCurrentPage(), id)) }
}
diff --git a/openbis_ng_ui/src/components/browser/BrowserNodes.jsx b/openbis_ng_ui/src/components/browser/BrowserNodes.jsx
index ca5ecad1ea5..3f14f95d79e 100644
--- a/openbis_ng_ui/src/components/browser/BrowserNodes.jsx
+++ b/openbis_ng_ui/src/components/browser/BrowserNodes.jsx
@@ -59,7 +59,7 @@ class BrowserNodes extends React.Component {
renderText(node){
logger.log(logger.DEBUG, 'BrowserNode.renderText "' + node.text + '"')
- return <ListItemText primary={node.text} inset={true} onClick={() => this.props.nodeSelect(node.id, node.object)} />
+ return <ListItemText primary={node.text} inset={true} onClick={() => this.props.nodeSelect(node.id)} />
}
}
diff --git a/openbis_ng_ui/src/components/content/Content.jsx b/openbis_ng_ui/src/components/content/Content.jsx
index 3f4d6c58b98..a42a21fd6f5 100644
--- a/openbis_ng_ui/src/components/content/Content.jsx
+++ b/openbis_ng_ui/src/components/content/Content.jsx
@@ -1,12 +1,28 @@
import React from 'react'
import ContentTabs from './ContentTabs.jsx'
-import ContentTab from './ContentTab.jsx'
import {connect} from 'react-redux'
import logger from '../../common/logger.js'
import store from '../../store/store.js'
+import * as objectType from '../../store/consts/objectType.js'
import * as selectors from '../../store/selectors/selectors.js'
import * as actions from '../../store/actions/actions.js'
+import ObjectType from './objectType/ObjectType.jsx'
+import CollectionType from './collectionType/CollectionType.jsx'
+import DataSetType from './dataSetType/DataSetType.jsx'
+import MaterialType from './materialType/MaterialType.jsx'
+import User from './user/User.jsx'
+import Group from './group/Group.jsx'
+
+const objectTypeToComponent = {
+ [objectType.OBJECT_TYPE]: ObjectType,
+ [objectType.COLLECTION_TYPE]: CollectionType,
+ [objectType.DATA_SET_TYPE]: DataSetType,
+ [objectType.MATERIAL_TYPE]: MaterialType,
+ [objectType.USER]: User,
+ [objectType.GROUP]: Group,
+}
+
function getCurrentPage(){
return selectors.getCurrentPage(store.getState())
}
@@ -31,6 +47,8 @@ class Content extends React.Component {
render() {
logger.log(logger.DEBUG, 'Content.render')
+ let ObjectContent = this.props.selectedObject ? objectTypeToComponent[this.props.selectedObject.type] : null
+
return (
<div>
<ContentTabs
@@ -38,9 +56,8 @@ class Content extends React.Component {
selectedObject={this.props.selectedObject}
objectSelect={this.props.objectSelect}
objectClose={this.props.objectClose} />
- {this.props.selectedObject &&
- <ContentTab
- object={this.props.selectedObject} />
+ {ObjectContent &&
+ <ObjectContent />
}
</div>
)
diff --git a/openbis_ng_ui/src/components/content/ContentTab.jsx b/openbis_ng_ui/src/components/content/ContentTab.jsx
deleted file mode 100644
index d7a948604fa..00000000000
--- a/openbis_ng_ui/src/components/content/ContentTab.jsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from 'react'
-import logger from '../../common/logger.js'
-
-class ContentTab extends React.Component {
-
- render() {
- logger.log(logger.DEBUG, 'ContentTab.render')
-
- return <div>Content of {this.props.object.id}</div>
- }
-
-}
-
-export default ContentTab
diff --git a/openbis_ng_ui/src/components/content/collectionType/CollectionType.jsx b/openbis_ng_ui/src/components/content/collectionType/CollectionType.jsx
new file mode 100644
index 00000000000..c15e8e68333
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/collectionType/CollectionType.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class CollectionType extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'CollectionType.render')
+ return <div>CollectionType</div>
+ }
+
+}
+
+export default CollectionType
diff --git a/openbis_ng_ui/src/components/content/dataSetType/DataSetType.jsx b/openbis_ng_ui/src/components/content/dataSetType/DataSetType.jsx
new file mode 100644
index 00000000000..ee4f5aa81ff
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/dataSetType/DataSetType.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class DataSetType extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'DataSetType.render')
+ return <div>DataSetType</div>
+ }
+
+}
+
+export default DataSetType
diff --git a/openbis_ng_ui/src/components/content/group/Group.jsx b/openbis_ng_ui/src/components/content/group/Group.jsx
new file mode 100644
index 00000000000..a1fa93d6cd0
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/group/Group.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class Group extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'Group.render')
+ return <div>Group</div>
+ }
+
+}
+
+export default Group
diff --git a/openbis_ng_ui/src/components/content/materialType/MaterialType.jsx b/openbis_ng_ui/src/components/content/materialType/MaterialType.jsx
new file mode 100644
index 00000000000..8493629f2cf
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/materialType/MaterialType.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class MaterialType extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'MaterialType.render')
+ return <div>MaterialType</div>
+ }
+
+}
+
+export default MaterialType
diff --git a/openbis_ng_ui/src/components/content/objectType/ObjectType.jsx b/openbis_ng_ui/src/components/content/objectType/ObjectType.jsx
new file mode 100644
index 00000000000..43cf63499eb
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/objectType/ObjectType.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class ObjectType extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'ObjectType.render')
+ return <div>ObjectType</div>
+ }
+
+}
+
+export default ObjectType
diff --git a/openbis_ng_ui/src/components/content/user/User.jsx b/openbis_ng_ui/src/components/content/user/User.jsx
new file mode 100644
index 00000000000..8642343df0b
--- /dev/null
+++ b/openbis_ng_ui/src/components/content/user/User.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import logger from '../../../common/logger.js'
+
+class User extends React.Component {
+
+ render() {
+ logger.log(logger.DEBUG, 'User.render')
+ return <div>User</div>
+ }
+
+}
+
+export default User
diff --git a/openbis_ng_ui/src/store/actions/browser.js b/openbis_ng_ui/src/store/actions/browser.js
index 0ce46e67ed9..afc3bedfd4f 100644
--- a/openbis_ng_ui/src/store/actions/browser.js
+++ b/openbis_ng_ui/src/store/actions/browser.js
@@ -35,12 +35,11 @@ export const browserFilterChange = (page, filter) => ({
}
})
-export const browserNodeSelect = (page, id, object) => ({
+export const browserNodeSelect = (page, id) => ({
type: BROWSER_NODE_SELECT,
payload: {
page,
- id,
- object
+ id
}
})
diff --git a/openbis_ng_ui/src/store/consts/objectType.js b/openbis_ng_ui/src/store/consts/objectType.js
new file mode 100644
index 00000000000..0ceeccaaabc
--- /dev/null
+++ b/openbis_ng_ui/src/store/consts/objectType.js
@@ -0,0 +1,6 @@
+export const OBJECT_TYPE = 'objectType'
+export const COLLECTION_TYPE = 'collectionType'
+export const DATA_SET_TYPE = 'dataSetType'
+export const MATERIAL_TYPE = 'materialType'
+export const USER = 'user'
+export const GROUP = 'group'
diff --git a/openbis_ng_ui/src/store/sagas/browser/browser.js b/openbis_ng_ui/src/store/sagas/browser/browser.js
index 4021dfa69ad..d9508d6ca8d 100644
--- a/openbis_ng_ui/src/store/sagas/browser/browser.js
+++ b/openbis_ng_ui/src/store/sagas/browser/browser.js
@@ -63,10 +63,17 @@ function* browserFilterChange(action){
}
function* browserNodeSelect(action){
- let {page, id, object} = action.payload
- yield put(actions.browserSetSelectedNode(page, id))
- if(object){
- yield put(actions.objectOpen(page, object.type, object.id))
+ let {page, id} = action.payload
+ let allNodes = yield select(selectors.getAllBrowserNodes, page)
+ let allNodesAllLevels = common.getAllNodes(allNodes)
+
+ let nodeToSelect = _.find(allNodesAllLevels, node => {
+ return node.id === id
+ })
+ yield put(actions.browserSetSelectedNode(page, nodeToSelect ? nodeToSelect.id : null))
+
+ if(nodeToSelect && nodeToSelect.object){
+ yield put(actions.objectOpen(page, nodeToSelect.object.type, nodeToSelect.object.id))
}
}
diff --git a/openbis_ng_ui/src/store/sagas/browser/types.js b/openbis_ng_ui/src/store/sagas/browser/types.js
index 4450e78cd9b..7d4268173ec 100644
--- a/openbis_ng_ui/src/store/sagas/browser/types.js
+++ b/openbis_ng_ui/src/store/sagas/browser/types.js
@@ -1,5 +1,6 @@
import _ from 'lodash'
import {putAndWait} from './../effects.js'
+import * as objectType from '../../consts/objectType.js'
import * as actions from '../../actions/actions.js'
import * as common from '../../common/browser.js'
@@ -16,10 +17,10 @@ export function* createNodes() {
})
}
- let objectTypeNodes = convert(objectTypes, 'objectType')
- let collectionTypeNodes = convert(collectionTypes, 'collectionType')
- let dataSetTypeNodes = convert(dataSetTypes, 'dataSetType')
- let materialTypeNodes = convert(materialTypes, 'materialType')
+ let objectTypeNodes = convert(objectTypes, objectType.OBJECT_TYPE)
+ let collectionTypeNodes = convert(collectionTypes, objectType.COLLECTION_TYPE)
+ let dataSetTypeNodes = convert(dataSetTypes, objectType.DATA_SET_TYPE)
+ let materialTypeNodes = convert(materialTypes, objectType.MATERIAL_TYPE)
common.sortNodes(objectTypeNodes)
common.sortNodes(collectionTypeNodes)
diff --git a/openbis_ng_ui/src/store/sagas/browser/users.js b/openbis_ng_ui/src/store/sagas/browser/users.js
index ba589607727..edb4d1fc629 100644
--- a/openbis_ng_ui/src/store/sagas/browser/users.js
+++ b/openbis_ng_ui/src/store/sagas/browser/users.js
@@ -1,5 +1,6 @@
import _ from 'lodash'
import {putAndWait} from './../effects.js'
+import * as objectType from '../../consts/objectType.js'
import * as actions from '../../actions/actions.js'
import * as common from '../../common/browser.js'
@@ -10,13 +11,13 @@ export function* createNodes() {
return {
id: `users/${user.userId}`,
text: user.userId,
- object: { type: 'user', id: user.userId },
+ object: { type: objectType.USER, id: user.userId },
children: user.groupIds.map(groupId => {
let group = groups[groupId]
return {
id: `users/${user.userId}/${group.code}`,
text: group.code,
- object: { type: 'group', id: group.code }
+ object: { type: objectType.GROUP, id: group.code }
}
})
}
@@ -28,13 +29,13 @@ export function* createNodes() {
return {
id: `groups/${group.code}`,
text: group.code,
- object: { type: 'group', id: group.code },
+ object: { type: objectType.GROUP, id: group.code },
children: group.userIds.map(userId => {
let user = users[userId]
return {
id: `groups/${group.code}/${user.userId}`,
text: user.userId,
- object: { type: 'user', id: user.userId }
+ object: { type: objectType.USER, id: user.userId }
}
})
}
diff --git a/openbis_ng_ui/srcTest/store/sagas/browser.test.js b/openbis_ng_ui/srcTest/store/sagas/browser.test.js
index 0d3634457a3..ba6910b20dc 100644
--- a/openbis_ng_ui/srcTest/store/sagas/browser.test.js
+++ b/openbis_ng_ui/srcTest/store/sagas/browser.test.js
@@ -3,6 +3,7 @@ import openbis from '../../../src/services/openbis.js'
import * as actions from '../../../src/store/actions/actions.js'
import * as selectors from '../../../src/store/selectors/selectors.js'
import * as pages from '../../../src/store/consts/pages.js'
+import * as objectType from '../../../src/store/consts/objectType.js'
import * as common from '../../../src/store/common/browser.js'
import { createStore } from '../../../src/store/store.js'
import * as fixture from './fixture.js'
@@ -105,10 +106,10 @@ describe('browser', () => {
objects: []
})
- let object = fixture.object('user', fixture.TEST_USER_DTO.userId)
+ let object = fixture.object(objectType.USER, fixture.TEST_USER_DTO.userId)
store.dispatch(actions.browserInit(pages.USERS))
- store.dispatch(actions.browserNodeSelect(pages.USERS, nodeId(['users', fixture.TEST_USER_DTO.userId]), object))
+ store.dispatch(actions.browserNodeSelect(pages.USERS, nodeId(['users', fixture.TEST_USER_DTO.userId])))
let state = store.getState()
expectNodes(selectors.getBrowserNodes(state, pages.USERS), [
diff --git a/openbis_ng_ui/srcTest/store/sagas/page.test.js b/openbis_ng_ui/srcTest/store/sagas/page.test.js
index 55a23d4760f..bb59b99375e 100644
--- a/openbis_ng_ui/srcTest/store/sagas/page.test.js
+++ b/openbis_ng_ui/srcTest/store/sagas/page.test.js
@@ -1,5 +1,6 @@
import * as actions from '../../../src/store/actions/actions.js'
import * as selectors from '../../../src/store/selectors/selectors.js'
+import * as objectType from '../../../src/store/consts/objectType.js'
import * as pages from '../../../src/store/consts/pages.js'
import { createStore } from '../../../src/store/store.js'
import * as fixture from './fixture.js'
@@ -16,9 +17,9 @@ beforeEach(() => {
describe('page', () => {
test('objectOpen objectClose', () => {
- let object1 = fixture.object('user', fixture.TEST_USER_DTO.userId)
- let object2 = fixture.object('user', fixture.ANOTHER_USER_DTO.userId)
- let object3 = fixture.object('group', fixture.TEST_GROUP_DTO.code)
+ let object1 = fixture.object(objectType.USER, fixture.TEST_USER_DTO.userId)
+ let object2 = fixture.object(objectType.USER, fixture.ANOTHER_USER_DTO.userId)
+ let object3 = fixture.object(objectType.GROUP, fixture.TEST_GROUP_DTO.code)
store.dispatch(actions.objectOpen(pages.USERS, object1.type, object1.id))
--
GitLab