Move session initialization to AppInit instead of ConsolePanel

- In Application Mode, we may not have a ConsolePanel - Just initialize the session before the layout is loaded
mofojed · Aug 9, 2021 · 2334c53 · 2334c53
1 parent b05602e
commit 2334c53
Show file tree

Hide file tree

Showing 20 changed files with 213 additions and 121 deletions.
diff --git a/packages/code-studio/src/dashboard/DashboardContainer.jsx b/packages/code-studio/src/dashboard/DashboardContainer.jsx
@@ -4,6 +4,7 @@ import { connect, Provider, ReactReduxContext } from 'react-redux';
 import throttle from 'lodash.throttle';
 import { ChartModelFactory } from '@deephaven/chart';
 import { IrisGridModelFactory, IrisGridUtils } from '@deephaven/iris-grid';
+import { PropTypes as APIPropTypes } from '@deephaven/jsapi-shim';
 import Log from '@deephaven/log';
 import {
   getActiveTool,
@@ -50,7 +51,7 @@ import './DashboardContainer.scss';
 import { UIPropTypes } from '../include/prop-types';
 import PanelErrorBoundary from './panels/PanelErrorBoundary';
 import FileExplorerPanel from './panels/FileExplorerPanel';
-import { ConsoleEvent } from './events';
+import { getSession } from '../redux';
 
 const log = Log.module('DashboardContainer');
 const RESIZE_THROTTLE = 100;
@@ -148,23 +149,12 @@ export class DashboardContainer extends Component {
   makeHydrateComponentPropsMap() {
     const { id: localDashboardId } = this.props;
 
-    const getSessionPromise = () =>
-      new Promise(resolve => {
-        const { layout } = this.state;
-        const { eventHub } = layout;
-        const onSessionOpened = async session => {
-          eventHub.off(ConsoleEvent.SESSION_OPENED, onSessionOpened);
-
-          resolve(session);
-        };
-        eventHub.on(ConsoleEvent.SESSION_OPENED, onSessionOpened);
-      });
-
     return {
       ChartPanel: props => ({
         ...props,
         localDashboardId,
         makeModel: async () => {
+          const { session } = this.props;
           const { metadata, panelState } = props;
           if (panelState) {
             if (panelState.tableSettings) {
@@ -180,8 +170,6 @@ export class DashboardContainer extends Component {
 
           const { settings, table: tableName, tableSettings } = metadata;
 
-          const session = await getSessionPromise();
-
           const table = await session.getTable(tableName);
 
           IrisGridUtils.applyTableSettings(table, tableSettings);
@@ -214,7 +202,7 @@ export class DashboardContainer extends Component {
         ...props,
         localDashboardId,
         makeModel: async () => {
-          const session = await getSessionPromise();
+          const { session } = this.props;
           const { table: tableName } = props.metadata;
           const table = await session.getTable(tableName);
           return IrisGridModelFactory.makeModel(table, false);
@@ -631,6 +619,7 @@ DashboardContainer.propTypes = {
   onDataChange: PropTypes.func,
   onLayoutConfigChange: PropTypes.func,
   onGoldenLayoutChange: PropTypes.func,
+  session: APIPropTypes.IdeSession.isRequired,
   setActiveTool: PropTypes.func.isRequired,
   setDashboardColumns: PropTypes.func.isRequired,
   setDashboardInputFilters: PropTypes.func.isRequired,
@@ -655,6 +644,7 @@ DashboardContainer.contextType = ReactReduxContext;
 
 const mapStateToProps = state => ({
   activeTool: getActiveTool(state),
+  session: getSession(state),
 });
 
 export default connect(mapStateToProps, {

diff --git a/packages/code-studio/src/dashboard/panels/CommandHistoryPanel.jsx b/packages/code-studio/src/dashboard/panels/CommandHistoryPanel.jsx
@@ -10,6 +10,7 @@ import { ConsoleEvent, NotebookEvent } from '../events';
 import './CommandHistoryPanel.scss';
 import { GLPropTypes } from '../../include/prop-types';
 import Panel from './Panel';
+import { getSession } from '../../redux';
 
 const log = Log.module('CommandHistoryPanel');
 
@@ -189,9 +190,19 @@ CommandHistoryPanel.defaultProps = {
   language: null,
 };
 
-const mapStateToProps = state => ({
-  commandHistoryStorage: getCommandHistoryStorage(state),
-});
+const mapStateToProps = state => {
+  const commandHistoryStorage = getCommandHistoryStorage(state);
+  const loadedSession = getSession(state);
+  const { session, config: sessionConfig } = loadedSession;
+  const { type: language, id: sessionId } = sessionConfig;
+
+  return {
+    commandHistoryStorage,
+    language,
+    session,
+    sessionId,
+  };
+};
 
 export default connect(mapStateToProps, null, null, { forwardRef: true })(
   CommandHistoryPanel

diff --git a/packages/code-studio/src/dashboard/panels/ConsolePanel.jsx b/packages/code-studio/src/dashboard/panels/ConsolePanel.jsx
@@ -9,11 +9,10 @@ import { connect } from 'react-redux';
 import { Console, ConsoleConstants, ConsoleUtils } from '@deephaven/console';
 import { FigureChartModel } from '@deephaven/chart';
 import { IrisGridModelFactory } from '@deephaven/iris-grid';
-import dh from '@deephaven/jsapi-shim';
+import { PropTypes as APIPropTypes } from '@deephaven/jsapi-shim';
 import { ThemeExport } from '@deephaven/components';
 import Log from '@deephaven/log';
 import { getCommandHistoryStorage } from '@deephaven/redux';
-import { Pending, PromiseUtils } from '@deephaven/utils';
 import {
   ChartEvent,
   ConsoleEvent,
@@ -25,6 +24,7 @@ import {
 import { GLPropTypes } from '../../include/prop-types';
 import './ConsolePanel.scss';
 import Panel from './Panel';
+import { getSession } from '../../redux';
 
 const log = Log.module('ConsolePanel');
 
@@ -59,7 +59,6 @@ class ConsolePanel extends PureComponent {
     );
 
     this.consoleRef = React.createRef();
-    this.pending = new Pending();
 
     const { panelState: initialPanelState } = props;
     const panelState = {
@@ -70,14 +69,8 @@ class ConsolePanel extends PureComponent {
 
     this.state = {
       consoleSettings,
-      language: null,
       itemIds: new Map(itemIds),
 
-      isLoading: true,
-
-      session: null,
-      sessionId: null,
-
       // eslint-disable-next-line react/no-unused-state
       panelState, // Dehydrated panel state that can load this panel
     };
@@ -89,8 +82,6 @@ class ConsolePanel extends PureComponent {
     // as they may have been saved with the dashboard
     this.closeDisconnectedPanels();
     glEventHub.on(PanelEvent.MOUNT, this.handlePanelMount);
-
-    this.initSession();
   }
 
   componentDidUpdate(prevProps, prevState) {
@@ -107,67 +98,6 @@ class ConsolePanel extends PureComponent {
     const { glEventHub } = this.props;
     this.savePanelState.flush();
     glEventHub.off(PanelEvent.MOUNT, this.handlePanelMount);
-
-    this.pending.cancel();
-
-    const { session } = this.state;
-    session?.close();
-  }
-
-  async initSession() {
-    try {
-      const baseUrl = new URL(
-        process.env.REACT_APP_CORE_API_URL,
-        window.location
-      );
-
-      const websocketUrl = `${baseUrl.protocol}//${baseUrl.host}`;
-
-      log.info(`Starting connection to '${websocketUrl}'...`);
-
-      const connection = new dh.IdeConnection(websocketUrl);
-
-      log.info('Getting console types...');
-
-      const types = await this.pending.add(connection.getConsoleTypes());
-
-      log.info('Available types:', types);
-
-      if (types.length === 0) {
-        throw new Error('No console types available');
-      }
-
-      const type = types[0];
-
-      log.info('Starting session with type', type);
-
-      const session = await this.pending.add(connection.startSession(type));
-
-      const sessionId = shortid.generate();
-
-      log.info('Console session established');
-
-      const { glEventHub } = this.props;
-      glEventHub.emit(ConsoleEvent.SESSION_OPENED, session, {
-        language: type,
-        sessionId,
-      });
-
-      this.setState(
-        { isLoading: false, language: type, session, sessionId },
-        () => {
-          this.consoleRef.current?.focus();
-        }
-      );
-    } catch (error) {
-      if (PromiseUtils.isCanceled(error)) {
-        return;
-      }
-
-      log.error('Error Creating Console: ', error);
-
-      this.setState({ isLoading: false, error });
-    }
   }
 
   setItemId(name, id) {
@@ -228,7 +158,8 @@ class ConsolePanel extends PureComponent {
   }
 
   handleOpenObject(object) {
-    const { session } = this.state;
+    const { loadedSession } = this.props;
+    const { session } = loadedSession;
     const { type } = object;
     if (ConsoleUtils.isTableType(type)) {
       this.openTable(object, session);
@@ -338,15 +269,16 @@ class ConsolePanel extends PureComponent {
   }
 
   render() {
-    const { commandHistoryStorage, glContainer, glEventHub } = this.props;
     const {
-      consoleSettings,
-      error,
-      isLoading,
-      language,
-      session,
-      sessionId,
-    } = this.state;
+      commandHistoryStorage,
+      glContainer,
+      glEventHub,
+      loadedSession,
+    } = this.props;
+    const { consoleSettings, error } = this.state;
+    const { config, session } = loadedSession;
+    const { id: sessionId, type: language } = config;
+
     return (
       <Panel
         componentPanel={this}
@@ -356,7 +288,6 @@ class ConsolePanel extends PureComponent {
         onShow={this.handleShow}
         onTabFocus={this.handleTabFocus}
         onTabBlur={this.handleTabBlur}
-        isLoading={isLoading}
         isLoaded={session != null}
         errorMessage={error != null ? `${error}` : null}
       >
@@ -405,6 +336,11 @@ ConsolePanel.propTypes = {
     consoleSettings: PropTypes.shape({}),
     itemIds: PropTypes.array,
   }),
+
+  loadedSession: PropTypes.shape({
+    session: APIPropTypes.IdeSession,
+    config: PropTypes.shape({ type: PropTypes.string, id: PropTypes.string }),
+  }).isRequired,
 };
 
 ConsolePanel.defaultProps = {
@@ -413,6 +349,7 @@ ConsolePanel.defaultProps = {
 
 const mapStateToProps = state => ({
   commandHistoryStorage: getCommandHistoryStorage(state),
+  loadedSession: getSession(state),
 });
 
 export default connect(mapStateToProps, null, null, { forwardRef: true })(

diff --git a/packages/code-studio/src/dashboard/panels/FileExplorerPanel.tsx b/packages/code-studio/src/dashboard/panels/FileExplorerPanel.tsx
@@ -12,6 +12,7 @@ import { connect } from 'react-redux';
 import Panel from './Panel';
 import { NotebookEvent } from '../events';
 import './FileExplorerPanel.scss';
+import { getSession } from '../../redux';
 
 const log = Log.module('FileExplorerPanel');
 
@@ -221,9 +222,18 @@ export class FileExplorerPanel extends React.Component<
   }
 }
 
-const mapStateToProps = (state: unknown) => ({
-  fileStorage: getFileStorage(state),
-});
+const mapStateToProps = (state: unknown) => {
+  const fileStorage = getFileStorage(state);
+  const loadedSession = getSession(state);
+  const { session, config: sessionConfig } = loadedSession;
+  const language = sessionConfig.type;
+
+  return {
+    fileStorage,
+    language,
+    session,
+  };
+};
 
 export default connect(mapStateToProps, null, null, { forwardRef: true })(
   FileExplorerPanel

diff --git a/packages/code-studio/src/dashboard/panels/LogPanel.jsx b/packages/code-studio/src/dashboard/panels/LogPanel.jsx
@@ -1,11 +1,14 @@
 // Wrapper for the Console for use in a golden layout container
 // Will probably need to handle window popping out from golden layout here.
 import React, { PureComponent } from 'react';
+import { connect } from 'react-redux';
 import Log from '@deephaven/log';
 import { LogView } from '@deephaven/console';
+import { PropTypes as APIPropTypes } from '@deephaven/jsapi-shim';
 import './LogPanel.scss';
 import Panel from './Panel';
-import { GLPropTypes, IrisPropTypes } from '../../include/prop-types';
+import { GLPropTypes } from '../../include/prop-types';
+import { getSession } from '../../redux';
 
 const log = Log.module('LogPanel');
 
@@ -104,11 +107,17 @@ class LogPanel extends PureComponent {
 LogPanel.propTypes = {
   glContainer: GLPropTypes.Container.isRequired,
   glEventHub: GLPropTypes.EventHub.isRequired,
-  session: IrisPropTypes.IdeSession,
+  session: APIPropTypes.IdeSession,
 };
 
 LogPanel.defaultProps = {
   session: null,
 };
 
-export default LogPanel;
+const mapStateToProps = state => ({
+  session: getSession(state).session,
+});
+
+export default connect(mapStateToProps, null, null, { forwardRef: true })(
+  LogPanel
+);