LiveQuery on Update Based on Column Updated

#1

I’m building an instant messenger but have an issue I’m trying to resolve.

I encrypt the messages prior to pushing to parse and then decrypt the message when it’s pulled. I have a little decryption animation that fires while waiting on the message to decrypt and be displayed in the dom.

Like any other instant messenger I have the option to select an emoji to react to a message and those reactions are stored as a key:value array in that message’s column in the Parse class.

When that new reaction is added or someone changes their reaction it fires the live query update subscription listener which is needed so that the new emoji is displayed there.

I also have the ability to edit your own messages.

My issue is that the message being reacted to gets repulled and goes through the decryption process again. This is a crappy UI since the message itself isn’t updating so it shouldn’t be redecrypting and updating the message itself, plus I don’t want to go through the overhead of re-decrypting something I don’t need to.

Is there anyway to pass into the live query subscription listener on which column was updated so I could prevent the decryption effect from firing on the main message in this case?

I have no way of telling if the new value matches the existing value prior to firing the decryption message client side because the value being passed from Parse is an encrypted string and what is displayed is the decrypted value. I can at least prevent the UI from being wonky by at least checking if the DECRYPTED value matches the displayed value but the fact still remains that I’m eating the overhead of running decryption when I don’t need to.

Looking through the docs I’m not really finding any way to determine what column within a row was updated at all unless I’m missing something?

#2

Hey there,

I understand the issue you are facing with the instant messenger and the unnecessary re-decryption process. It would be great if we could find a way to determine which column within a row was updated so that we can prevent the decryption effect from firing on the main message. Let’s keep looking through the documentation to see if we can find a solution. Thanks for bringing this to our attention.

#3

So far I haven’t found a very clean elegant way of handling this outside of rebuilding the reactions to sit in their own class with a pointer instead of as a column within the message class. That would be fine I guess but adds an extra layer of overhead and complexity to solve something that would seemingly be simple if we just had a data point to determine which column was updated on the event handler.

It’s not even as simple as just checking if the message string value is the same after decryption with how the decrypt animation works. Basically that animation starts once the ajax call goes to decrypt as a placeholder until the decrypted value is returned. It’s making for a very irritating UI and that decryption process just adds server-side overhead it doesn’t need to.

Maybe I’m over thinking this or something.

#4

You can use something like:

Parse.Cloud.afterLiveQueryEvent("Message", req => {
  if (req.object.dirtyKeys().length === 1 && req.object.dirty("reactions")) {
  // only reactions was updated, do not send LQ event
  req.sendEvent = false;
  return;
  }
});

Alternatively you can specify the watch parameter when subscribing, as this can specify which query fields you would like to listen to changes for.

#6

How and where to I set watch parameters on the subscription?

const query = new Parse.Query('Messages');
        query.subscribe().then(messages => {
            messages.on('update', (obj) => {
                updateMessageHandler(obj);
            });
        });

I tried creating a second query just selecting the reaction field and setting a new update subscription on that but it still fires if the message field is updated.

const reactionQuery = new Parse.Query("Messages");
        reactionQuery.select('reaction');
        reactionQuery.subscribe().then(reactions => {
            reactions.on('update', (obj) => {
                console.log(obj);
            });
        });

I’m just not finding anything in the docs relating to watch params at all or actually anything that can be set on the actual subscribe() function?