These are chat archives for reactioncommerce/reaction

1st
Jan 2019
Abhishek
@thegtagamer
Jan 01 14:12

Hey guys i tried to customise the addressbook so that i can have the same default shipping/billingaddress..So under AddressGrid i called the onSelect method multiple times with the same id with different usage...But it didnt seem to work
onClick={() => { this.onSelect(_id, "shipping"); this.onSelect(_id, "billing"); }}

Then i created a separate function that wrapped up the call for onSelect(_id, "billing") and onSelect(_id, "billing")
and change my onClick listener to call that function.

So what happens is the the addressGrid is updated (the State gets set) but upon page refresh..The current setting disappears...and the console turns up with this exception:

Exception in delivering result of invoking 'account/getProfile': Error: Trying to set data after component(Tracker(withProps(Reaction(AddressBook)))) has unmounted. at onData (compose.js:77) at Meteor.call (addressBookContainer.js:415) at MethodInvoker._callback (meteor.js?hash=c8108d734cc548d91539b054e14b613d0c4512cc:1185) at MethodInvoker._maybeInvokeCallback (MethodInvoker.js:52) at MethodInvoker.receiveResult (MethodInvoker.js:71) at Connection._livedata_result (livedata_connection.js:1514) at Connection.onMessage (livedata_connection.js:1673) at forEachCallback.callback (browser.js:186) at Array.forEach (<anonymous>) at ClientStream.forEachCallback (common.js:30)

@pnewell4_twitter @loan-laux @loanlaux @zenweasel
Loan Laux
@loan-laux
Jan 01 14:15
Is this on the starterkit?
Abhishek
@thegtagamer
Jan 01 14:16
Nope its 1.14
Abhishek
@thegtagamer
Jan 01 14:22
Abhishek
@thegtagamer
Jan 01 14:28
renderAddressGrid() {
    const { addressBook } = this;
    const { edit, remove } = this.props;
    return addressBook.map((address) => {
      const { defaultBillingAddressId, defaultShippingAddressId } = this.state;
      const { _id, fullName } = address;
      const activeShipping = (defaultShippingAddressId === _id) ? "active" : "";
      const activeBilling = (defaultBillingAddressId === _id) ? "active" : "";
      const activeShippingBilling = (defaultShippingAddressId === _id && defaultBillingAddressId === _id) ? "active" : "";
      return (
        <div className="address-list-item" key={_id}>
          <div
            className={`address ${activeShippingBilling}`}
            role="button"
            tabIndex="0"
            onKeyUp={(e) => { if (e.keyCode === 13) this.onSelect(_id, "shipping"); this.onSelect(_id, "billing");  }}
            onClick={() => { this.onSelect(_id, "shipping");  this.onSelect(_id, "billing"); }}
          >
            <strong>{fullName}</strong>
            {this.renderAddress(address)}
          </div>
          {/*<div
            className={`address ${activeBilling}`}
            role="button"
            tabIndex="0"
            onKeyUp={(e) => { if (e.keyCode === 13) this.onSelect(_id, "billing"); }}
            onClick={() => { this.onSelect(_id, "billing"); }}
          >
            <strong>{fullName}</strong>
            {this.renderAddress(address)}
          </div>*/ }
          {/* <span className="sr-only"> */}
          <div className="controls">
            <Components.Button
              className="btn btn-default"
              onClick={() => { edit(_id); }}
              icon="fa fa-pencil"
              tooltip="Edit Address"
              i18nKeyTooltip="addressBookGrid.edit"
            />
            <Components.Button
              className="btn btn-default danger-action"
              onClick={() => { remove(_id); }}
              icon="fa fa-trash-o"
              tooltip="Remove Address"
              i18nKeyTooltip="addressBookGrid.removeAddress"
            />
          </div>
        </div>
      );
    });
  }
Loan Laux
@loan-laux
Jan 01 14:32
I would have to try and test that for myself, which I can't right now. Hope someone else on here can answer.