React Native, how to make redux state false again

Question

I created a view cart in which I show total price and view cart button, when I add item it makes condition true and display that cart below in every screen, but when I click view cart it's not making it false again, how can I do this? can someone check my code and tell me please. Below is my code

Viewcart.js

<View>
        {this.props.show && this.props.items.length > 0 ? (
          <View style={styles.total}>
            <Text style={styles.totaltext}>Total:</Text>
            <Text style={styles.priceTotal}>{this.props.total}</Text>
            <View style={styles.onPress}>
              <Text
                style={styles.pressText}
                onPress={() => {
                  RootNavigation.navigate("Cart");
                  this.props.show;
                }}
              >
                View Cart
              </Text>
            </View>
          </View>
        ) : null}
      </View>
const mapStateToProps = (state) => {
  return {
    show: state.clothes.show,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    showCart: () => dispatch(showCart()),
  };
};

reducer.js

if (action.type === SHOW_CART) {
    let addedItem = state.addedItems;
    if (addedItem.length === 0) {
      return {
        ...state,
        show: state.showCart,
      };
    } else {
      return {
        ...state,
        show: action.showCart,
      };
    }
  }
const initialstate = {
  showCart: false
}

action.js

export const showCart = (id) => {
  return {
    type: SHOW_CART,
    showCart: true,
    id,
  };
};

Answer 1

As per the chat the requirement is to toggle this when exiting the screen so the easiest way to do that is to use the lifecycle methods.

To hide use componentDidMount

componentDidMount(){
 this.props.showCartOff(); 
}

to show use component

componentWillUnmount(){
  this.props.showCart();
}