From 12537aac325f8cf12ef7cff81531abf6675e53e8 Mon Sep 17 00:00:00 2001 From: Hilda Stastna Date: Wed, 28 Nov 2018 16:40:21 +0100 Subject: [PATCH] Remove unnecessary code,redux and other changes to make the component work --- .../Portfolio/PortfolioItems.js | 55 +++++++++++-------- .../Portfolio/RemovePortfolioItems.js | 22 +++----- .../ActionTypes/PortfolioItemActionTypes.js | 4 -- src/Store/Actions/PortfolioItemActions.js | 21 ------- src/Store/Reducers/PortfolioItemReducer.js | 19 ------- 5 files changed, 40 insertions(+), 81 deletions(-) delete mode 100644 src/Store/ActionTypes/PortfolioItemActionTypes.js delete mode 100644 src/Store/Actions/PortfolioItemActions.js delete mode 100644 src/Store/Reducers/PortfolioItemReducer.js diff --git a/src/SmartComponents/Portfolio/PortfolioItems.js b/src/SmartComponents/Portfolio/PortfolioItems.js index be247fc37..93dacb71a 100644 --- a/src/SmartComponents/Portfolio/PortfolioItems.js +++ b/src/SmartComponents/Portfolio/PortfolioItems.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import { bindActionCreators } from 'redux'; import { withRouter, Link, Route } from 'react-router-dom'; import { connect } from 'react-redux'; import propTypes from 'prop-types'; @@ -13,21 +14,21 @@ import RemovePortfolioItems from '../../SmartComponents/Portfolio/RemovePortfoli import Select from 'react-select'; class PortfolioItems extends Component { - constructor(props) { - super(props); - this.state = { - showItems: '', - filteredItems: [], - selectItems: [] - }; - } + state = { + showItems: '', + filteredItems: [], + selectItems: [], + isLoaded: false, + }; fetchData(apiProps) { if (apiProps && apiProps.portfolio) { - this.props.fetchPortfolioItemsWithPortfolio(apiProps.portfolio); + this.props.fetchPortfolioItemsWithPortfolio(apiProps.portfolio).then(() => + this.setState({ isLoaded: true })); } else { - this.props.fetchPortfolioItems({ ...apiProps }); + this.props.fetchPortfolioItems({ ...apiProps }).then(() => + this.setState({ isLoaded: true })); } } @@ -55,28 +56,38 @@ class PortfolioItems extends Component { ); } + handleItemSelect = (selectItems) => { + this.setState(selectItems); + console.log(`==== Option selected: `, selectItems); + } + render() { + const { isLoaded } = this.state; + if(!isLoaded) { + return
Loading...
+ } - const isRemoving = this.props.loaction.pathname.match(/.*\/remove$/) + const isRemoving = this.props.location.pathname.match(/.*\/remove$/) + const { selectItems } = this.state; const filteredItems = { items: this.props.portfolioItems.portfolioItems.map(item => ({ ...item, - //isSelecatble: isRemoving, - //onSelect: this.handleItemSelect {/** to zadefinujes ako metodu komponenty tu, ak nebude treba ten redux. A ak ano, tak tomu handle das akci*/} + isSelectable: isRemoving, + onSelect: this.handleItemSelect, })), isLoading: this.props.isLoading }; - console.log('isRemoving: ', isRemoving); - const intialRoute = this.props.loaction.pathname; + const intialRoute = this.props.location.pathname; const removeRoute = `/portfolio_items/${this.props.computedMatch.params.filter}/remove`; + return (
( - {/** tu pojde tvoja komponenta - urcite? potrebujeme tu vobec daco?*/} + )} /> @@ -92,7 +103,7 @@ class PortfolioItems extends Component { /> - {/** TODO*/} {/** portfolioItems.map(({ id, title }) => ({ value: id, label: title, @@ -111,12 +122,10 @@ function mapStateToProps(state) { }; } -const mapDispatchToProps = dispatch => { - return { - fetchPortfolioItems: apiProps => dispatch(fetchPortfolioItems(apiProps)), - fetchPortfolioItemsWithPortfolio: apiProps => dispatch(fetchPortfolioItemsWithPortfolio(apiProps)) - }; -}; +const mapDispatchToProps = dispatch => bindActionCreators({ + fetchPortfolioItems, + fetchPortfolioItemsWithPortfolio, +}, dispatch); PortfolioItems.propTypes = { filteredItems: propTypes.object, diff --git a/src/SmartComponents/Portfolio/RemovePortfolioItems.js b/src/SmartComponents/Portfolio/RemovePortfolioItems.js index 82cd6200e..f11dc9434 100644 --- a/src/SmartComponents/Portfolio/RemovePortfolioItems.js +++ b/src/SmartComponents/Portfolio/RemovePortfolioItems.js @@ -1,14 +1,15 @@ import React, { Component } from 'react'; -import { connect } from 'react-redux'; import propTypes from 'prop-types'; import { Link } from 'react-router-dom'; import { Button } from '@patternfly/react-core'; const RemovePortfolioItems = ({ items, cancelRoute }) => ( -
-

Remove Products

+
+
+

Remove Products

+
- + {/** TODO: cancelRoute is undefined! */} @@ -16,8 +17,9 @@ const RemovePortfolioItems = ({ items, cancelRoute }) => (
); +// TODO: //function removeItems(items) { -// api na odstranenie portfolio items z portfolia ?, mozno by si to mala dat do PortfolioHelper.js a odtial to tu zavolat ? +// api //} RemovePortfolioItems.propTypes = { @@ -29,12 +31,4 @@ RemovePortfolioItems.defaultProps = { items: [] } -const mapStateToProps = ({ PortfolioItemReducer: { selectItems }}) => ({ - selectItems -}); - -// const mapDispatchToProps = dispatch => ({ -// }); - -//export default connect(mapStateToProps, mapDispatchToProps)(RemovePortfolioItems); -export default connect(mapStateToProps)(RemovePortfolioItems); +export default RemovePortfolioItems; diff --git a/src/Store/ActionTypes/PortfolioItemActionTypes.js b/src/Store/ActionTypes/PortfolioItemActionTypes.js deleted file mode 100644 index 0729d3421..000000000 --- a/src/Store/ActionTypes/PortfolioItemActionTypes.js +++ /dev/null @@ -1,4 +0,0 @@ -const prefix = '@@portfolio-item' - -export const SELECT_PORTFOLIO_ITEM = `${prefix}select` -export const UNSELECT_PORTFOLIO_ITEM = `${prefix}unselect` diff --git a/src/Store/Actions/PortfolioItemActions.js b/src/Store/Actions/PortfolioItemActions.js deleted file mode 100644 index 3625420df..000000000 --- a/src/Store/Actions/PortfolioItemActions.js +++ /dev/null @@ -1,21 +0,0 @@ -import { SELECT_PORTFOLIO_ITEM, UNSELECT_PORTFOLIO_ITEM } from '../ActionTypes/PortfolioItemActionTypes' -import ReducerRegistry from '../../Utilities/ReducerRegistry'; -import PortfolioItemReducer from '../Reducers/PortfolioItemReducer'; - -ReducerRegistry.register({ PortfolioItemReducer }); - -/** -* @param id id of portfolio item -*/ -export const selectItem = id => ({ - type: SELECT_PORTFOLIO_ITEM, - payload: id -}) - -/** -* @param index index of portfolio item -*/ -export const unselectItem = index => ({ - type: UNSELECT_PORTFOLIO_ITEM, - payload: index -}) diff --git a/src/Store/Reducers/PortfolioItemReducer.js b/src/Store/Reducers/PortfolioItemReducer.js deleted file mode 100644 index 3ae3a9072..000000000 --- a/src/Store/Reducers/PortfolioItemReducer.js +++ /dev/null @@ -1,19 +0,0 @@ -import { SELECT_PORTFOLIO_ITEM, UNSELECT_PORTFOLIO_ITEM } from '../ActionTypes/PortfolioItemActionTypes' - -const initialState = { - selectItems: [] -} - -const portfolioItemReducer = (state = initialState, action) => { - switch (action.type) { - case SELECT_PORTFOLIO_ITEM: { - return {...state, selectItems: [...state.selectItems, action.payload]} - } - case UNSELECT_PORTFOLIO_ITEM: { - return {...state, selectItems: [...state.selectItems.slice(0, action.payload), ...state.selectItems.slice(action.payload + 1)]} - } - } - return state -} - -export default portfolioItemReducer