CODEWITHSUNDEEP
javascripthtmlcssreactjs
andy wilson
andy wilson

Reputation: 970

ReactJs Stop someone loading a page if someone is already inside of it

I am writing a system where multiple people will be logged into it at a time but we can't have two users looking at the same user record at the same time. how would i make it so that two people cant be looking at the same data. so say if username: admin is looking at record: 123, and username: user wants to access record: 123 user would be given a prompt saying "sorry admin is already looking at that record please wait until they have finished thank you"

how would i go about locking the other user out.

so you search for your record in the left box and click search it then brings up this results pane on the right with the results. i want it so when you click open it takes you to the record but if theres someone in the record i want it to say what i wrote above.

enter image description here

Upvotes: 2

Views: 1143

Answers (1)

Dragomir Kolev
Dragomir Kolev

Reputation: 1108

There is no simple way of achieving this, and you cannot do it client side as the browser is unaware of what is happening on other browsers.

You will have to implement something on your Server Side like socket.io.

With the socket you can issue a websocket push to all currently logged in users when another user goes to a record.

  1. For instance with your example lets say user Admin goes into record 123.
  2. Then you can send a notification to all other currently logged in users and tell them user Admin is currently looking at record 123.
  3. On the client side ( presuming you are using something like Redux for the store ) you can then update the records and make 123 unreadable or not displayable.

*There is something you need to keep in mind though, when the user navigates out of the screen you will need to unlock that record. The problem with that is that users can leave the page by doing multiple actions ( pressing browser back button, closing the page, or navigating to some other page on your application ). You will need a way to figure this out, once you have done so you can then update all users with a notification saying the record is now available and repeat the steps above.

Hope that explains it well enough, tell me if you need more clarification.

Upvotes: 1

Related Questions