chore: Add Popup for timeout

[Ragini-Microsoft]

Purpose

This pull request adds robust handling for session timeouts in the frontend application. The main change is the introduction of a non-dismissible session timeout dialog that appears when the backend notifies the frontend of a session timeout via a new websocket message type. This ensures users receive clear feedback and are guided to return to the home page if their session expires.

Session Timeout Handling:

• Added a new non-dismissible SessionTimeoutDialog component to display a session timeout message and guide users back to the home page. (src/frontend/src/components/common/SessionTimeoutDialog.tsx)
• Integrated the SessionTimeoutDialog into PlanPage, including state management to show/hide the dialog and navigation logic to redirect users home when the dialog is acknowledged. (src/frontend/src/pages/PlanPage.tsx) [1] [2] [3]

Websocket Integration:

• Added a new websocket message type, TIMEOUT_NOTIFICATION, to the WebsocketMessageType enum. (src/frontend/src/models/enums.tsx)
• Updated WebSocketService to handle the new TIMEOUT_NOTIFICATION message type and emit the appropriate event. (src/frontend/src/services/WebSocketService.tsx)
• Added a new effect in PlanPage to listen for the TIMEOUT_NOTIFICATION websocket event, display the session timeout dialog, and disconnect the websocket. (src/frontend/src/pages/PlanPage.tsx)

Does this introduce a breaking change?

• Yes
• No

How to Test

• Get the code

git clone [repo-address]
cd [repo-name]
git checkout [branch-name]
npm install

• Test the code

What to Check

Verify that the following are valid

• ...

Other Information