Going against the optimistic UI (sometimes!)

Meteor’s optimistic UI is great, but there are times when I want to go against it.

I’m building an app where users can paste in a YouTube link to store in their playlist, however the video needs to first be run through the YouTube API to check if it is embeddable / age restricted / etc. before it’s added to the database. As there’s a reasonably high chance videos might not pass the test, it could be bad UX to use the optimistic UI approach.

Is there a good way of bypassing the optimistic UI (only for certain actions, not app-wide), and only updating the client when the data is successfully added to the server?

Do not define method on client :smiley:

1 Like

What this guy said. Do a meteor method with a callback.

Template.youtube.events({
  'submit form#youtube': function (e, template) {
    var link = $(e.target).find('input').val();
    Loading.show($(e.target));  // show a loading indicator
    Meteor.call('Youtube._validated', link, function (err, result) {
      Loading.hide();
      if (err) { 
        // do something with the error
      } else {
        // append to ui
      }
    })
  }
});