How to Remove Board from Redux store-React js, red

Question

Here i am creating new board by clicking on button, Once i enter board page i have option of creating new widgets

If user is not creating new widget and click backtoboards button , boards should not be created

here board is getting created,i am able to see the boards with out saving,

If i refresh the page board is not seen.

can i get some suggestion on how to prevent creating board if back to board button is clicked

click on back to board below function will be called

Back to board

manageShowBoard = (selectedBoard) => {
this.setState({ selectedBoard });
};

Answer 1

The simple approach can be in your new Board component (where you are creating widgets), you can keep the widgets count. When the user clicks the back button, you can check the widgets count. If your widgets count is greater than 0, then you can add that board in the Parent component where you can maintain all boards data.

Parent:

class Parent {
  constructor(props){
    super(props);
    this.boardsList = [];
  }

  updateBoards = (newBoard) => {
    this.boardsList.push(newBoard);
    this.setState({renderAgain: true});
  }

  render(){
    return <Board updateBoards={this.updateBoards} />;
  }

}

Board:

class Board {

  onClickBackButton = () => {
    if(widgetsCount > 0){
      this.props.updateBoards(boardData);
    }
    else {
      ...normal back button functionality...
    }
  }

}

Answer 2

First of all, you have to pass the selectedStoryboard as the payload of the action, then simply:

case types.REMOVE_STORYBOARD:
{
  const boardToRemove = ... // get from action payload
  return {
     ...state,
    boardList: state.boardList.filter(board => board !== boardToRemove);
  };
}