matlab-proxy 0.10.1__tar.gz → 0.12.0__tar.gz

{matlab-proxy-0.10.1/matlab_proxy.egg-info → matlab-proxy-0.12.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: matlab-proxy
-Version: 0.10.1
+Version: 0.12.0
 Summary: Python® package enables you to launch MATLAB® and access it from a web browser.
 Home-page: https://github.com/mathworks/matlab-proxy/
 Author: The MathWorks, Inc.
@@ -55,9 +55,10 @@ Description: # MATLAB Proxy
         
           $ sudo yum install xorg-x11-server-Xvfb
           ```
+          
+          *Note: The installation of Xvfb is **optional** (w.e.f. v0.11.0 of matlab-proxy). However, we highly recommend installing it.*
         * Python versions: **3.8** | **3.9**  | **3.10** | **3.11**
         * [Browser Requirements](https://www.mathworks.com/support/requirements/browser-requirements.html)
-        
         * Supported Operating Systems:
             * Linux®
             * Windows® Operating System ( starting v0.4.0 of matlab-proxy )

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/README.md

@@ -47,9 +47,10 @@ The MATLAB Proxy is under active development. For support or to report issues, s
 
   $ sudo yum install xorg-x11-server-Xvfb
   ```
+  
+  *Note: The installation of Xvfb is **optional** (w.e.f. v0.11.0 of matlab-proxy). However, we highly recommend installing it.*
 * Python versions: **3.8** | **3.9**  | **3.10** | **3.11**
 * [Browser Requirements](https://www.mathworks.com/support/requirements/browser-requirements.html)
-
 * Supported Operating Systems:
     * Linux®
     * Windows® Operating System ( starting v0.4.0 of matlab-proxy )

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/package.json

@@ -40,7 +40,7 @@
       "last 1 safari version"
     ]
   },
-  "proxy": "http://127.0.0.1:8000",
+  "proxy": "http://127.0.0.1:8888",
   "homepage": "./",
   "devDependencies": {
     "@babel/preset-env": "^7.11.0",

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/src/actionCreators/actionCreators.spec.js

@@ -1,10 +1,13 @@
-// Copyright 2020-2023 The MathWorks, Inc.
+// Copyright 2020-2024 The MathWorks, Inc.
 
 import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 import fetchMock from 'fetch-mock';
 import * as actions from '../actions';
 import * as actionCreators from './index';
+import state from '../test/utils/state';
+
+const _ = require("lodash");
 
 const middlewares = [thunk];
 const mockStore = configureMockStore(middlewares);
@@ -60,25 +63,7 @@ describe.each([
 
 describe('Test Sync actionCreators', () => {
   it('should dispatch action of type RECEIVE_SERVER_STATUS ', () => {
-    const store = mockStore({
-      overlayVisibility: false,
-      error: null,
-      serverStatus: {
-        matlabStatus: 'starting',
-        isFetching: true,
-        hasFetched: false,
-        fetchFailCount: 0,
-        licensingInfo: {
-          type: 'NLM',
-          connectionString: 'abc@nlm',
-        }
-      },
-      authInfo: {
-        authEnabled: false,
-        authStatus: false,
-        authToken: null,
-      }
-    });
+    const store = mockStore(state);
 
     const status = {
       matlab: {
@@ -101,19 +86,7 @@ describe('Test Sync actionCreators', () => {
 describe('Test fetchWithTimeout method', () => {
   let store;
   beforeEach(() => {
-    store = mockStore({
-      error: null,
-      serverStatus: {
-        licensingInfo: {
-          type: 'NLM',
-          connectionString: 'abc@nlm',
-        },
-        isFetching: false,
-        isSubmitting: false,
-        hasFetched: false,
-        fetchFailCount: 0,
-      },
-    });
+    store = mockStore(state);
   });
 
   afterEach(() => {
@@ -121,7 +94,7 @@ describe('Test fetchWithTimeout method', () => {
   });
 
   it('should fetch requested data without raising an exception or dispatching any action', async () => {
-    fetchMock.getOnce('/get_status', {
+    fetchMock.getOnce('/get_status?IS_DESKTOP=TRUE', {
       body: {
         matlab: {
           status: 'down',
@@ -131,7 +104,7 @@ describe('Test fetchWithTimeout method', () => {
       headers: { 'content-type': 'application/json' },
     });
 
-    const response = await actionCreators.fetchWithTimeout(store.dispatch, '/get_status', {}, 10000);
+    const response = await actionCreators.fetchWithTimeout(store.dispatch, '/get_status?IS_DESKTOP=TRUE', {}, 10000);
     const body = await response.json()
 
     expect(body).not.toBeNull();
@@ -143,7 +116,7 @@ describe('Test fetchWithTimeout method', () => {
     ];
 
     try {
-      const response = await actionCreators.fetchWithTimeout(store.dispatch, '/get_status', {}, 100);
+      const response = await actionCreators.fetchWithTimeout(store.dispatch, '/get_status?IS_DESKTOP=TRUE', {}, 100);
     } catch (error) {
       expect(error).toBeInstanceOf(TypeError)
       const received = store.getActions();
@@ -157,14 +130,14 @@ describe('Test fetchWithTimeout method', () => {
 
     // Send a delayed response, well after the timeout for the request has expired.
     // This should trigger the abort() method of the AbortController()
-    fetchMock.getOnce('/get_status', new Promise(resolve => setTimeout(() => resolve({ body: 'ok' }), 1000 + timeout)));
+    fetchMock.getOnce('/get_status?IS_DESKTOP=TRUE', new Promise(resolve => setTimeout(() => resolve({ body: 'ok' }), 1000 + timeout)));
 
     const abortSpy = jest.spyOn(global.AbortController.prototype, 'abort');
     const expectedActions = [
       actions.RECEIVE_ERROR,
     ];
 
-    await actionCreators.fetchWithTimeout(store.dispatch, '/get_status', {}, timeout);
+    await actionCreators.fetchWithTimeout(store.dispatch, '/get_status?IS_DESKTOP=TRUE', {}, timeout);
 
     expect(abortSpy).toBeCalledTimes(1);
     const received = store.getActions();
@@ -174,26 +147,10 @@ describe('Test fetchWithTimeout method', () => {
 });
 
 describe('Test Async actionCreators', () => {
-  let store;
+  let store, initialState;
   beforeEach(() => {
-    store = mockStore({
-      error: null,
-      serverStatus: {
-        licensingInfo: {
-          type: 'NLM',
-          connectionString: 'abc@nlm',
-        },
-        isFetching: false,
-        isSubmitting: false,
-        hasFetched: false,
-        fetchFailCount: 0,
-      },
-      authInfo: {
-        authEnabled: false,
-        authStatus: false,
-        authToken: null,
-      },
-    });
+    initialState = _.cloneDeep(state)
+    store = mockStore(initialState);
   });
 
   afterEach(() => {
@@ -236,15 +193,17 @@ describe('Test Async actionCreators', () => {
     });
   });
 
-
-
   it('dispatches REQUEST_SERVER_STATUS, RECEIVE_SERVER_STATUS when fetching status', () => {
-    fetchMock.getOnce('/get_status', {
+    fetchMock.getOnce('/get_status?IS_DESKTOP=TRUE', {
       body: {
         matlab: {
           status: 'down',
+          version: 'R2023a'
         },
-        licensing: {},
+        licensing: null,
+        loadUrl: null,
+        error: null,
+        wsEnv: "",
       },
       headers: { 'content-type': 'application/json' },
     });

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/src/actionCreators/index.js

@@ -1,4 +1,4 @@
-// Copyright 2020-2023 The MathWorks, Inc.
+// Copyright 2020-2024 The MathWorks, Inc.
 
 import {
     SET_TRIGGER_POSITION,
@@ -19,10 +19,19 @@ import {
     RECEIVE_START_MATLAB,
     RECEIVE_ERROR,
     RECEIVE_ENV_CONFIG,
+    RECEIVE_CONCURRENCY_CHECK,
     SET_AUTH_STATUS,
-    SET_AUTH_TOKEN
+    SET_AUTH_TOKEN,
+    RECEIVE_SESSION_STATUS,
+    WAS_EVER_ACTIVE,
+    REQUEST_SESSION_STATUS,
+    SET_CLIENT_ID,
 } from '../actions';
-import { selectMatlabPending } from '../selectors';
+import { 
+    selectMatlabPending, 
+    selectIsConcurrencyEnabled, 
+    selectClientId,
+} from '../selectors';
 import sha256 from 'crypto-js/sha256';
 
 export function setAuthStatus(authInfo) {
@@ -61,12 +70,25 @@ export function setOverlayVisibility(visibility) {
     };
 }
 
+export function setClientId(client_id) {
+    return {
+        type: SET_CLIENT_ID,
+        client_id
+    };
+}
+
 export function requestServerStatus() {
     return {
         type: REQUEST_SERVER_STATUS,
     };
 }
 
+export function wasEverActive() {
+    return {
+        type: WAS_EVER_ACTIVE,
+    }
+}
+
 export function receiveServerStatus(status) {
     return function (dispatch, getState) {
         return dispatch({
@@ -76,6 +98,20 @@ export function receiveServerStatus(status) {
         });
     }
 }
+export function requestSessionStatus() {
+    return {
+        type: REQUEST_SESSION_STATUS,
+    };
+}
+
+export function receiveSessionStatus(status) {
+    return function (dispatch, getState) {
+        return dispatch({
+            type: RECEIVE_SESSION_STATUS,
+            status,
+        })
+    }
+}
 
 export function requestEnvConfig() {
     return {
@@ -90,6 +126,13 @@ export function receiveEnvConfig(config) {
     };
 }
 
+export function receiveConcurrencyCheck(config) {
+    return {
+        type: RECEIVE_CONCURRENCY_CHECK,
+        config,
+    }
+}
+
 export function requestSetLicensing() {
     return {
         type: REQUEST_SET_LICENSING,
@@ -193,14 +236,43 @@ export async function fetchWithTimeout(dispatch, resource, options = {}, timeout
     }
 }
 
-export function fetchServerStatus() {
+export function fetchServerStatus(requestTransferSession = false) {
     return async function (dispatch, getState) {
+        const isConcurrencyEnabled = selectIsConcurrencyEnabled(getState());
+        const clientIdInState = selectClientId(getState());
+        const clientId = clientIdInState ? clientIdInState : sessionStorage.getItem("MWI_CLIENT_ID");
 
         dispatch(requestServerStatus());
-        const response = await fetchWithTimeout(dispatch, './get_status', {}, 10000);
+
+        let url = './get_status?IS_DESKTOP=TRUE'
+
+        if (isConcurrencyEnabled && clientId) {
+            let params = new URLSearchParams();     
+            params.append("MWI_CLIENT_ID",encodeURIComponent(clientId))
+
+            if (requestTransferSession){
+params.append("TRANSFER_SESSION",encodeURIComponent(requestTransferSession))
+            }
+
+            url = url + '&' + params.toString();   
+
+        }
+
+        const response = await fetchWithTimeout(dispatch, url, {}, 10000);
+        
         const data = await response.json();
         dispatch(receiveServerStatus(data));
 
+        if (clientId == null && data["clientId"]) {
+            sessionStorage.setItem("MWI_CLIENT_ID", data["clientId"]);
+            dispatch(setClientId(data["clientId"]));
+        }
+        if ("isActiveClient" in data) { 
+            dispatch(receiveSessionStatus(data))
+            if (data["isActiveClient"] === true) {
+                dispatch(wasEverActive())
+            }
+        }
     }
 }
 

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/src/actions/index.js

@@ -1,8 +1,9 @@
-// Copyright (c) 2020-2023 The MathWorks, Inc.
+// Copyright 2020-2024 The MathWorks, Inc.
 
 export const SET_TRIGGER_POSITION = 'SET_TRIGGER_POSITION';
 export const SET_TUTORIAL_HIDDEN = 'SET_TUTORIAL_HIDDEN';
 export const SET_OVERLAY_VISIBILITY = 'SET_OVERLAY_VISIBILITY';
+export const SET_CLIENT_ID = 'SET_CLIENT_ID';
 export const REQUEST_SERVER_STATUS = 'REQUEST_SERVER_STATUS';
 export const RECEIVE_SERVER_STATUS = 'RECEIVE_SERVER_STATUS';
 export const REQUEST_SET_LICENSING = 'REQUEST_SET_LICENSING';
@@ -18,5 +19,10 @@ export const RECEIVE_START_MATLAB = 'RECEIVE_START_MATLAB';
 export const RECEIVE_ERROR = 'RECEIVE_ERROR';
 export const REQUEST_ENV_CONFIG = 'REQUEST_ENV_CONFIG';
 export const RECEIVE_ENV_CONFIG = 'RECEIVE_ENV_CONFIG';
+export const RECEIVE_CONCURRENCY_CHECK = 'RECEIVE_CONCURRENCY_CHECK';
 export const SET_AUTH_STATUS = 'SET_AUTH_STATUS';
 export const SET_AUTH_TOKEN = 'SET_AUTH_TOKEN';
+export const REQUEST_SERVER_INITIALIZATION = 'REQUEST_SERVER_INITIALIZATION';
+export const RECEIVE_SESSION_STATUS = 'RECEIVE_SESSION_STATUS';
+export const WAS_EVER_ACTIVE = 'WAS_EVER_ACTIVE';
+export const REQUEST_SESSION_STATUS = 'REQUEST_SESSION_STATUS';

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/src/components/App/App.spec.js

@@ -4,31 +4,28 @@ import React from 'react';
 import { render, fireEvent } from '../../test/utils/react-test';
 import App from './index';
 import * as actionCreators from '../../actionCreators';
+import state from '../../test/utils/state';
+
+const _ = require("lodash");
 
 describe('App Component', () => {
   let initialState;
   beforeEach(() => {
-    initialState = {
-      triggerPosition: { x: 539, y: 0 },
-      tutorialHidden: false,
-      overlayVisibility: false,
-      serverStatus: {
-        licensingInfo: { type: 'MHLM', emailAddress: 'abc@mathworks.com' },
-        matlabStatus: 'up',
-        isFetching: false,
-        hasFetched: true,
-        isSubmitting: false,
-        fetchFailCount: 0,
-        wsEnv: 'mw'
-      },
-      loadUrl: null,
-      error: null,
-      authInfo: {
-        authEnabled: false,
-        authStatus: false,
-        authToken: null,
-      },
-    };
+    initialState = _.cloneDeep(state);
+
+    // As the tests are run in a NodeJS environment whereas the correct values for document.URL and window.location.href
+    // are set by the browser, for tests, set the appropriate values for document.URL, window.location.href and window.location.origin
+    // for the component to render without errors
+    // Delete and redefine 'origin' and 'href' properties as they are read-only. 
+    delete window.location;
+    window.location = {      
+      origin: "/",
+      href : "http://127.0.0.1/"
+    }
+
+    initialState.serverStatus.licensingInfo.entitlements = [{ id: "1234567", label: null, license_number: "7654321" }];
+    initialState.serverStatus.licensingInfo.entitlementId = "1234567";
+  
     const mockIntersectionObserver = jest.fn();
     mockIntersectionObserver.mockReturnValue({
       observe: () => null,
@@ -42,17 +39,15 @@ describe('App Component', () => {
     jest.clearAllMocks();
   });
 
-  // it('renders app without crashing', () => {
-  //   const { getByTestId } = render(<App />);
-  //   expect(getByTestId('app')).toBeInTheDocument();
-  // });
+  it('renders app without crashing', () => {
+    const { getByTestId } = render(<App />);
+    expect(getByTestId('app')).toBeInTheDocument();
+  });
 
   it('should render overlayTrigger (after closing the tutorial)', () => {
-
     // Hide the tutorial before rendering the component.
-    initialState.tutorialHidden = true;
-    initialState.authInfo.authEnabled = true;
-    initialState.authInfo.authStatus = true;
+    initialState.tutorialHidden = true; 
+    initialState.overlayVisibility = false; 
 
     const { getByTestId } = render(<App />, {
       initialState: initialState,
@@ -67,12 +62,11 @@ describe('App Component', () => {
   });
 
   it('should render LicensingGatherer component within the App component when no licensing is provided and user is authenticated', () => {
-
     //Set lincensingInfo to empty object.
     initialState.overlayVisibility = true;
     initialState.serverStatus.licensingInfo = {};
-    initialState.authInfo.authEnabled = true;
-    initialState.authInfo.authStatus = true;
+    initialState.authentication.enabled = true;
+    initialState.authentication.status = true;
     
     const { getByRole } = render(<App />, { initialState: initialState });
 
@@ -83,28 +77,26 @@ describe('App Component', () => {
   });
 
   it('should render LicensingGatherer component within the App component when no licensing is provided and authentication is disabled', () => {
-
     //Set lincensingInfo to empty object.
     initialState.overlayVisibility = true;
     initialState.serverStatus.licensingInfo = {};
-    initialState.authInfo.authEnabled = false;
+    initialState.authentication.enabled = false;
     
     const { getByRole } = render(<App />, { initialState: initialState });
 
     const licensingGathererComponent = getByRole(
       'dialog', { description: "licensing-dialog" });
-  
+
     expect(licensingGathererComponent).toBeInTheDocument();
   });
 
   it('should render Information Component within App Component after licensing is provided and user is authenticated', () => {
-
     // Hide the tutorial and make the overlay visible.
     initialState.tutorialHidden = true;
     initialState.overlayVisibility = true;
 
-    initialState.authInfo.authEnabled = true;
-    initialState.authInfo.authStatus = true;
+    initialState.authentication.enabled = true;
+    initialState.authentication.status = true;
 
     //Rendering the App component with the above changes to the initial
     // state should render the Information Component.
@@ -118,12 +110,11 @@ describe('App Component', () => {
   });
 
   it('should render Information Component within App Component after licensing is provided and auth is not enabled', () => {
-
     // Hide the tutorial and make the overlay visible.
     initialState.tutorialHidden = true;
     initialState.overlayVisibility = true;
 
-    initialState.authInfo.authEnabled = false;
+    initialState.authentication.enabled = false;
 
     //Rendering the App component with the above changes to the initial
     // state should render the Information Component.
@@ -138,7 +129,6 @@ describe('App Component', () => {
   });
 
   it('should display integration terminated error', () => {
-
     //Hide the tutorial, make the overlay visible and set fetchFailCount to 10
     initialState.tutorialHidden = true;
     initialState.overlayVisibility = true;
@@ -183,7 +173,6 @@ describe('App Component', () => {
   });
 
   it('should display Confirmation component ', () => {
-
     //Hide the tutorial and make the overlay visible
     initialState.tutorialHidden = true;
     initialState.overlayVisibility = true;
@@ -208,16 +197,14 @@ describe('App Component', () => {
   });
 
   it('should display Help Component', () => {
-
     //Hide the tutorial and make the overlay visible
     initialState.tutorialHidden = true;
     initialState.overlayVisibility = true;
 
-    const { getByTestId, container, getByRole } = render(<App />, {
+    const { getByTestId, container } = render(<App />, {
       initialState: initialState,
     });
 
-
     // Grab the help button and click it.
     const helpBtn = getByTestId('helpBtn');
     fireEvent.click(helpBtn);
@@ -231,19 +218,9 @@ describe('App Component', () => {
     const url = 'http://localhost.com:5555/matlab/index.html'  
     
     // define new complete url for document.URL for baseUrl variable to evaluate correctly
-    // As the tests are run in a NodeJS environment where as the correct values for document.URL and window.location.href
-    // are set by the browser, set the appropriate values for document.URL, window.location.href and window.location.origin
-    // for the component to render without errors
     delete document.URL;
     document = {URL: url}
 
-    // Delete and redefine 'origin' and 'href' properties as they are read-only. 
-    delete window.location;
-    window.location = {      
-      origin: "/",
-      href : "http://127.0.0.1/"
-    }
-
     initialState.loadUrl =  url;
     render(<App />, { initialState: initialState });  
     // Check if href has been set to loadUrl by the useEffect  
@@ -259,7 +236,6 @@ describe('App Component', () => {
     ("should pick the token correctly when the query parameters are '%s'", (queryParams, expectedToken) => {
     const url = `http://localhost.com:5555`
     const mockUpdateAuthStatus = jest.spyOn(actionCreators, 'updateAuthStatus');
-    delete window.location;
     window.location = {
       origin: '/',
       href: url,

{matlab-proxy-0.10.1 → matlab-proxy-0.12.0}/gui/src/components/App/index.js

@@ -1,4 +1,4 @@
-// Copyright 2020-2023 The MathWorks, Inc.
+// Copyright 2020-2024 The MathWorks, Inc.
 
 import React, { useState, useCallback, useEffect, useMemo } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
@@ -30,6 +30,9 @@ import {
     selectLicensingInfo,
     selectUseMOS,
     selectUseMRE,
+    selectIsConcurrent,
+    selectWasEverActive,
+    selectIsConcurrencyEnabled,
 } from "../../selectors";
 
 import {
@@ -55,11 +58,14 @@ function App() {
     const error = useSelector(selectError);
     const loadUrl = useSelector(selectLoadUrl);
     const isConnectionError = useSelector(selectIsConnectionError);
-    const isAuthenticated = useSelector(selectIsAuthenticated)
+    const isAuthenticated = useSelector(selectIsAuthenticated);
     const authEnabled = useSelector(selectAuthEnabled);
     const licensingInfo = useSelector(selectLicensingInfo);
     const useMOS = useSelector(selectUseMOS);
     const useMRE = useSelector(selectUseMRE);
+    const isSessionConcurrent = useSelector(selectIsConcurrent);
+    const isConcurrencyEnabled = useSelector(selectIsConcurrencyEnabled);
+    const wasEverActive = useSelector(selectWasEverActive);
 
     const baseUrl = useMemo(() => {
         const url = document.URL
@@ -92,7 +98,10 @@ function App() {
     );
 
     const [dialogModel, setDialogModel] = useState(null);
+    const [isTerminated, setIsTerminated] = useState(false);
 
+    // sessionDialog stores the state of concurrent session based on which either matlab gets rendered or the concurrent session dialog gets rendered 
+    let sessionDialog = null;
     let dialog;
     if (dialogModel) {
         const closeHandler = () => setDialogModel(null);
@@ -135,6 +144,35 @@ function App() {
         );
     } else if (error && error.type === "MatlabInstallError") {
         dialog = <Error message={error.message} />;
+    } 
+    // check the user authentication before giving them the option to transfer the session.
+    else if ((!authEnabled || isAuthenticated) && isSessionConcurrent && isConcurrencyEnabled) {
+        // Transfer the session to this tab 
+        // setting the query parameter of requestTransferSession to true
+        const transferSessionOnClick= () => {
+            dispatch(fetchServerStatus(true));
+            sessionDialog=null;
+        }
+        const endSession = () => {
+            setIsTerminated(true);
+        }
+        if(isTerminated) {
+            sessionDialog = <Error message="Your session has been terminated. Refresh the page to restart the session." />;
+        }
+        else {
+            sessionDialog = (
+                <Confirmation
+                    confirm={transferSessionOnClick}
+                    cancel={endSession}
+                    title='MATLAB is currently open in another window'
+                    cancelButton={wasEverActive?('Cancel'):('Continue in existing window')}
+                    confirmButton = {wasEverActive?('Confirm'):('Continue in this window')}>
+                    {wasEverActive
+                        ? 'You have been disconnected because MATLAB is open in another window. Click on Confirm to continue using MATLAB here.'
+                        : <div>MATLAB is open in another window and cannot be opened in a second window or tab at the same time.<br></br>Would you like to continue in this window?</div> }
+                </Confirmation>
+            );
+        }
     }
 
     useEffect(() => {
@@ -147,11 +185,11 @@ function App() {
 
     useEffect(() => {
         // Initial fetch server status
-        if (!hasFetchedServerStatus) {
+        if (hasFetchedEnvConfig && !hasFetchedServerStatus) {
             dispatch(fetchServerStatus());
         }
 
-    }, [dispatch, hasFetchedServerStatus]);
+    }, [dispatch, hasFetchedServerStatus, hasFetchedEnvConfig]);
 
     // Periodic fetch server status
     useInterval(() => {
@@ -233,11 +271,22 @@ function App() {
     const overlayTrigger = overlayVisible ? null : <OverlayTrigger />;
 
     return (
-        <div data-testid="app" className="main">
-            {overlayTrigger}
-            {matlabJsd}
-            {overlay}
-        </div>
+        // If we use div instead of React.Fragment then the editor screen becomes white / doesn't fully render.
+        // Have noticed this behavior both in windows and Linux.
+        // If session dialog is not 'null' then render the transfer dialog or error dialog otherwise render the normal MATLAB.
+        <React.Fragment>
+            {sessionDialog?(
+                <Overlay>
+                    {sessionDialog}
+                </Overlay>
+            ):(
+                <div data-testid="app" className="main">
+                    {overlayTrigger}
+                    {matlabJsd}
+                    {overlay}
+                </div>
+            )}
+        </React.Fragment>
     );
 }