From 6d5a2eebb609da67239ea37d12d6b2d3bbfef76e Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Wed, 28 Oct 2020 16:41:53 +0100 Subject: ui: Do not clutter component tree with Redux connects This change refactors the frontend to use hooks for obtaining state within the Redux store as opposed to using Higher-Order Components (HOCs). This eliminates a lot of clutter in the components. --- .../containers/projects/VisibleProjectAuthList.js | 26 +++++++++++----------- 1 file changed, 13 insertions(+), 13 deletions(-) (limited to 'opendc-web/opendc-web-ui/src/containers/projects/VisibleProjectAuthList.js') diff --git a/opendc-web/opendc-web-ui/src/containers/projects/VisibleProjectAuthList.js b/opendc-web/opendc-web-ui/src/containers/projects/VisibleProjectAuthList.js index f0010540..b869775c 100644 --- a/opendc-web/opendc-web-ui/src/containers/projects/VisibleProjectAuthList.js +++ b/opendc-web/opendc-web-ui/src/containers/projects/VisibleProjectAuthList.js @@ -1,4 +1,5 @@ -import { connect } from 'react-redux' +import React from 'react' +import { useSelector } from 'react-redux' import ProjectList from '../../components/projects/ProjectAuthList' const getVisibleProjectAuths = (projectAuths, filter) => { @@ -14,19 +15,18 @@ const getVisibleProjectAuths = (projectAuths, filter) => { } } -const mapStateToProps = (state) => { - const denormalizedAuthorizations = state.projectList.authorizationsOfCurrentUser.map((authorizationIds) => { - const authorization = state.objects.authorization[authorizationIds] - authorization.user = state.objects.user[authorization.userId] - authorization.project = state.objects.project[authorization.projectId] - return authorization - }) +const VisibleProjectAuthList = (props) => { + const authorizations = useSelector((state) => { + const denormalizedAuthorizations = state.projectList.authorizationsOfCurrentUser.map((authorizationIds) => { + const authorization = state.objects.authorization[authorizationIds] + authorization.user = state.objects.user[authorization.userId] + authorization.project = state.objects.project[authorization.projectId] + return authorization + }) - return { - authorizations: getVisibleProjectAuths(denormalizedAuthorizations, state.projectList.authVisibilityFilter), - } + return getVisibleProjectAuths(denormalizedAuthorizations, state.projectList.authVisibilityFilter) + }) + return } -const VisibleProjectAuthList = connect(mapStateToProps)(ProjectList) - export default VisibleProjectAuthList -- cgit v1.2.3