0

How to achieve the below scenario in react native.

I have 2 screens (refer image below)

Screen 1 : Alacarte Meal Menu

Screen 2 : Combo Meal Menu

Once user logins for the day, he will be allowed to access 2 seperate screens. Once the user has placed the order from Combo Meal Menu, the same screen should be disabled till next day and should be redirected to alacarte meal menu until the combo meal menu enables.

Any help would be much appreciated

Siyam Kumar
  • 112
  • 8

1 Answers1

1

Okay , so it's a problem of lock timer. Ideally you want to lock one screen for 1 whole day and again make it enable the next day. It would be best to maintain a flag at the backend for the same and unlock it after exact 24 hours. Suppose maintain a flag object called disableFood .

let disableFood = {
locked:false,
time:0
}

and in the main screen where pages are loaded , retrieve that data via backend api call and add the condition , if resultOfApi.disabledFood.locked === true , only show the page you want and when its not locked you can allow user to navigate to both the screen. And in the backend you need to maintain an epoc time whenever the user orders a meal , and assign it to disabledFood.time. And next time when the api is called check for epoc time >24 hours, then make disableFood to again locked :false and time:0,

If you have any doubts ask, coz its quite confusing,

Gaurav Roy
  • 11,175
  • 3
  • 24
  • 45
  • Your idea seems to be great. But I'm stuck with disabling the entire combo meal menu component. As combo meal and ala carte present in the tab navigator. So if combo meal disabled it should automatically redirect to alacarte meal. Any reference code would do good. Thanks in advance. – Siyam Kumar Nov 01 '19 at 17:40
  • Also, it's not 24 hour cycle. Everyday it gets enabled and it will be disabled once the user places order. It will re enabled again on next day. – Siyam Kumar Nov 01 '19 at 17:41
  • okay , so time you can set, not a big deal. and with the disbale thing you can disable it and when it's disabled, in componentDidMount of that page, you can navigate to the unlocked page. and after that just disable it. you can see the reference of https://stackoverflow.com/questions/45639304/block-disable-tabs-in-tabnavigator-react-navigation – Gaurav Roy Nov 02 '19 at 05:05
  • This has been achieved in a different way. Thank you for your help. Hence closing it. – Siyam Kumar Jan 08 '20 at 11:55