0

What is the best way to block the ui, when, let's say, a subscription ends? The notification that the subscription ends comes from the back end. But what then? Set a flag in every component whether it is rendered or not? Manage it through redux? Wrap every component in a HOC which gets the information about the end of subscription? Are there libraries? I looked into this https://github.com/tdeekens/flopflip but thats a little too much. I don't want a provider such as launch darkly.

I am a little clueless, never did that and thankful for every finger point...

9000
  • 39,899
  • 9
  • 66
  • 104
four-eyes
  • 10,740
  • 29
  • 111
  • 220
  • You can create an `overlay` which spans the whole screen. Refer here: https://stackoverflow.com/questions/2852276/make-div-overlay-entire-page-not-just-viewport – Saket Patel Jul 15 '19 at 13:01
  • 2
    Why even _render_ the normal UI once you know a subscription is inactive? Render a "renew subscription" link instead. – 9000 Jul 15 '19 at 13:01
  • @9000 What if there are certain features available, depending on the plan you choose? – four-eyes Jul 15 '19 at 13:16
  • @Stophface: as in `if (subscriptionActive) { } else { };`? – 9000 Jul 15 '19 at 16:34

1 Answers1

0

Just after render() function of the component. Use a boolean flag to check if the subscription has ended. And just like @9000 recommends, render a renew-subscription component if it has ended, otherwise an normal UI could be rendered.

bijayshrestha
  • 149
  • 1
  • 14