Back button handling

[preetkaran20]

As VulnerableApp-Facade UI is a Single Page Application, hence there is no routing and all communication is done using Ajax hence browser history stack doesn't store any information of the navigations. under this enhancement, we need to introduce the history tied to the browser navigations such that back button navigates to the previous step.

** Solutions **
The general solution in Single page applications is adding the actions into the browser's history e.g: using history api of browser: https://developer.mozilla.org/en-US/docs/Web/API/History_API

The first solution that is coming to my mind is just add the state into the history and on back button, overwriting the state of the react.

Information about VulnerableApp-Facade code:
State interface: https://github.com/SasanLabs/VulnerableApp-facade/blob/main/facade-app/src/interface/State.tsx
Global State manipulation:

VulnerableApp-facade/facade-app/src/App.tsx

Line 181 in e463162

setGlobalState = (globalState: GlobalState) => {

we use react and for state management, we are not using redux, instead, we rely on parent component to expose a method that will be called by a child on state change so that other components can be updated.
The parent component is App.tsx.

[Duy-L]

Hi, I would like to try this.

[preetkaran20]

Hi @Duy-L,

Great, I have assigned the issue to you.

thanks,
Karan

[preetkaran20]

Hi @Duy-L ,

Are you still working on this issue?

[Dripcoding]

React has a feature called Context that can handle global state management if an external library like Redux would be overkill. Using Context and React hooks would organize how state is managed and is better for maintainability.

https://reactjs.org/docs/context.html

[amrendranath]

@Dripcoding Shall I work on this?

[preetkaran20]

@amrendranath yes, please go ahead on this.

thanks,
Karan