datacube: separate REPL and DataCube components (#3549)

.changeset/silver-pugs-study.md

@@ -0,0 +1,4 @@
+---
+'@finos/legend-application-data-cube': patch
+'@finos/legend-application-repl': patch
+---

packages/legend-application-data-cube/.npmignore

@@ -0,0 +1,6 @@
+/build
+/style
+**/__mocks__/**
+**/__tests__/**
+/*.*
+!tsconfig.json

packages/legend-application-data-cube/CHANGELOG.md

@@ -0,0 +1 @@
+# @finos/legend-application-data-cube

packages/legend-application-data-cube/README.md

@@ -0,0 +1,3 @@
+# @finos/legend-application-data-cube
+
+Legend Data Cube

packages/legend-application-data-cube/_package.config.js

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default {
+  publish: {
+    typescript: {
+      main: './tsconfig.publish.json',
+      others: ['./tsconfig.package.json'],
+    },
+  },
+};

packages/legend-application-data-cube/jest.config.js

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { getBaseJestDOMProjectConfig } from '../../scripts/test/jest.config.base.js';
+import { loadJSON } from '@finos/legend-dev-utils/DevUtils';
+import { resolve, dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+const packageJson = loadJSON(resolve(__dirname, './package.json'));
+
+export default getBaseJestDOMProjectConfig(
+  packageJson.name,
+  'packages/legend-application-data-cube',
+);

packages/legend-application-data-cube/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@finos/legend-application-data-cube",
+  "version": "0.0.0",
+  "description": "Legend Data Cube",
+  "keywords": [
+    "legend",
+    "legend-application",
+    "legend-data-cube",
+    "data-cube"
+  ],
+  "homepage": "https://github.com/finos/legend-studio/tree/master/packages/legend-application-data-cube",
+  "bugs": {
+    "url": "https://github.com/finos/legend-studio/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/finos/legend-studio.git",
+    "directory": "packages/legend-application-data-cube"
+  },
+  "license": "Apache-2.0",
+  "sideEffects": false,
+  "type": "module",
+  "exports": {
+    ".": "./lib/index.js",
+    "./lib/index.css": "./lib/index.css"
+  },
+  "module": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "scripts": {
+    "build": "yarn clean && yarn build:sass && yarn build:ts",
+    "build:sass": "cross-env INIT_CWD=$INIT_CWD node ../../scripts/workflow/buildSass.js",
+    "build:ts": "tsc --project ./tsconfig.build.json",
+    "clean": "npm-run-all clean:cache clean:lib",
+    "clean:cache": "rimraf \"build\"",
+    "clean:lib": "rimraf \"lib\"",
+    "dev": "npm-run-all --parallel dev:sass dev:ts",
+    "dev:sass": "sass style:lib --watch --load-path=../../node_modules/@finos/legend-art/scss",
+    "dev:ts": "tsc --watch --preserveWatchOutput",
+    "lint:js": "cross-env NODE_ENV=production eslint --cache --cache-location ./build/.eslintcache --report-unused-disable-directives --parser-options=project:\"./tsconfig.json\" \"./src/**/*.{js,ts,tsx}\"",
+    "publish:prepare": "node ../../scripts/release/preparePublishContent.js",
+    "publish:snapshot": "node ../../scripts/release/publishDevSnapshot.js",
+    "test": "jest",
+    "test:watch": "jest --watch"
+  },
+  "dependencies": {
+    "@finos/legend-application": "workspace:*"
+  },
+  "devDependencies": {
+    "@finos/legend-dev-utils": "workspace:*",
+    "@jest/globals": "29.7.0",
+    "cross-env": "7.0.3",
+    "eslint": "8.57.1",
+    "jest": "29.7.0",
+    "npm-run-all": "4.1.5",
+    "rimraf": "6.0.1",
+    "sass": "1.79.1",
+    "typescript": "5.6.2"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0"
+  },
+  "publishConfig": {
+    "directory": "build/publishContent"
+  }
+}

packages/legend-application-data-cube/src/stores/dataCube/DataCubeStore.ts

@@ -0,0 +1,25 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { GenericLegendApplicationStore } from '@finos/legend-application';
+
+export class DataCubeStore {
+  readonly applicationStore: GenericLegendApplicationStore;
+
+  constructor(applicationStore: GenericLegendApplicationStore) {
+    this.applicationStore = applicationStore;
+  }
+}

packages/legend-application-data-cube/style/data-cube.scss

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */

packages/legend-application-data-cube/style/index.scss

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@forward 'data-cube';

packages/legend-application-data-cube/tsconfig.build.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "tsBuildInfoFile": "build/prod.tsbuildinfo",
+    "jsx": "react-jsx"
+  },
+  "exclude": ["src/**/__tests__/**/*.*", "src/**/__mocks__/**/*.*"],
+  "references": [{ "path": "../legend-application/tsconfig.build.json" }]
+}

packages/legend-application-data-cube/tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "extends": "@finos/legend-dev-utils/tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "lib",
+    "tsBuildInfoFile": "build/dev.tsbuildinfo",
+    "rootDir": "src",
+    "jsx": "react-jsxdev"
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"],
+  "references": [{ "path": "../legend-application" }]
+}

packages/legend-application-data-cube/tsconfig.package.json

@@ -0,0 +1,9 @@
+{
+  "extends": "@finos/legend-dev-utils/tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "lib",
+    "tsBuildInfoFile": "build/package.tsbuildinfo",
+    "rootDir": "."
+  },
+  "include": ["package.json"]
+}

packages/legend-application-data-cube/tsconfig.publish.json

@@ -0,0 +1,4 @@
+{
+  "extends": "./tsconfig.build.json",
+  "references": [{ "path": "./tsconfig.package.json" }]
+}

packages/legend-application-repl/src/components/REPLStoreProvider.tsx → packages/legend-application-repl/src/components/DataCubeStoreProvider.tsx

@@ -16,21 +16,36 @@
 
 import { createContext, useContext, useEffect } from 'react';
 import { observer, useLocalObservable } from 'mobx-react-lite';
-import { REPLStore } from '../stores/REPLStore.js';
-import { guaranteeNonNullable } from '@finos/legend-shared';
+import { guaranteeNonNullable, NetworkClient } from '@finos/legend-shared';
 import { useApplicationStore } from '@finos/legend-application';
 import type { LegendREPLApplicationConfig } from '../application/LegendREPLApplicationConfig.js';
 import type { LegendREPLPluginManager } from '../application/LegendREPLPluginManager.js';
+import { DataCubeStore } from '../stores/dataCube/DataCubeStore.js';
+import { REPLServerClient } from '../server/REPLServerClient.js';
+import { REPLDataCubeEngine } from '../stores/REPLDataCubeEngine_.js';
 
-const REPLStoreContext = createContext<REPLStore | undefined>(undefined);
+const DataCubeStoreContext = createContext<DataCubeStore | undefined>(
+  undefined,
+);
 
-export const REPLStoreProvider = observer(
+export const DataCubeStoreProvider = observer(
   ({ children }: { children: React.ReactNode }): React.ReactElement => {
     const application = useApplicationStore<
       LegendREPLApplicationConfig,
       LegendREPLPluginManager
     >();
-    const store = useLocalObservable(() => new REPLStore(application));
+    const baseAddress = guaranteeNonNullable(application.config.baseAddress);
+    const client = new REPLServerClient(
+      new NetworkClient({
+        baseUrl: application.config.useDynamicREPLServer
+          ? window.location.origin + baseAddress.replace('/repl/', '')
+          : application.config.replUrl,
+      }),
+    );
+    const engine = new REPLDataCubeEngine(client);
+    const dataCubeStore = new DataCubeStore(application, engine);
+    engine.init(dataCubeStore);
+    const store = useLocalObservable(() => dataCubeStore);
 
     useEffect(() => {
       store.initialize().catch(application.logUnhandledError);
@@ -40,24 +55,24 @@ export const REPLStoreProvider = observer(
       return <></>;
     }
     return (
-      <REPLStoreContext.Provider value={store}>
+      <DataCubeStoreContext.Provider value={store}>
         {children}
-      </REPLStoreContext.Provider>
+      </DataCubeStoreContext.Provider>
     );
   },
 );
 
-export const useREPLStore = () =>
+export const useDataCubeStore = () =>
   guaranteeNonNullable(
-    useContext(REPLStoreContext),
+    useContext(DataCubeStoreContext),
     `Can't find REPL store in context`,
   );
 
-export const withREPLStore = (WrappedComponent: React.FC): React.FC =>
-  function WithREPLStore() {
+export const withDataCubeStore = (WrappedComponent: React.FC): React.FC =>
+  function WithDATACUBEStore() {
     return (
-      <REPLStoreProvider>
+      <DataCubeStoreProvider>
         <WrappedComponent />
-      </REPLStoreProvider>
+      </DataCubeStoreProvider>
     );
   };

packages/legend-application-repl/src/components/LegendREPLApplication.tsx

@@ -20,17 +20,17 @@ import {
   Switch,
   type TEMPORARY__ReactRouterComponentType,
 } from '@finos/legend-application/browser';
-import { DataCube } from './dataCube/DataCube.js';
 import { LegendREPLFrameworkProvider } from './LegendREPLFrameworkProvider.js';
 import { observer } from 'mobx-react-lite';
-import { withREPLStore } from './REPLStoreProvider.js';
+import { withDataCubeStore } from './DataCubeStoreProvider.js';
 import { BlockingActionAlert } from './repl/Alert.js';
+import { DataCube } from './dataCube/DataCube.js';
 
 export const LEGEND_REPL_GRID_CLIENT_ROUTE_PATTERN = Object.freeze({
   DATA_CUBE: `/dataCube`,
 });
 
-export const LegendREPLRouter = withREPLStore(
+export const LegendREPLRouter = withDataCubeStore(
   observer(() => (
     <div className="app">
       <Switch>

packages/legend-application-repl/src/components/dataCube/DataCube.tsx

@@ -15,7 +15,6 @@
  */
 
 import { observer } from 'mobx-react-lite';
-import { useREPLStore } from '../REPLStoreProvider.js';
 import { useEffect } from 'react';
 import { DataCubeGrid } from './grid/DataCubeGrid.js';
 import { useApplicationStore } from '@finos/legend-application';
@@ -29,6 +28,7 @@ import {
 import { LayoutManager } from '../repl/LayoutManager.js';
 import type { DataCubeState } from '../../stores/dataCube/DataCubeState.js';
 import { INTERNAL__MonacoEditorWidgetsRoot } from '../repl/PureCodeEditor.js';
+import { useDataCubeStore } from '../DataCubeStoreProvider.js';
 
 const DataCubeStatusBar = observer((props: { dataCube: DataCubeState }) => {
   const { dataCube } = props;
@@ -75,7 +75,6 @@ const DataCubeStatusBar = observer((props: { dataCube: DataCubeState }) => {
 
 const DataCubeTitleBar = observer((props: { dataCube: DataCubeState }) => {
   const { dataCube } = props;
-  const repl = useREPLStore();
   const application = useApplicationStore();
   const [openMenuDropdown, closeMenuDropdown, menuDropdownProps] =
     useDropdownMenu();
@@ -123,7 +122,7 @@ const DataCubeTitleBar = observer((props: { dataCube: DataCubeState }) => {
           <DropdownMenuItem
             className="flex h-[22px] w-full items-center px-2.5 text-base hover:bg-neutral-100 focus:bg-neutral-100"
             onClick={() => {
-              repl.settingsDisplay.open();
+              dataCube.store.settingsDisplay.open();
               closeMenuDropdown();
             }}
           >
@@ -136,9 +135,9 @@ const DataCubeTitleBar = observer((props: { dataCube: DataCubeState }) => {
 });
 
 export const DataCube = observer(() => {
-  const repl = useREPLStore();
-  const application = useApplicationStore();
-  const dataCube = repl.dataCube;
+  const dataCubeStore = useDataCubeStore();
+  const application = dataCubeStore.application;
+  const dataCube = dataCubeStore.dataCubeState;
 
   useEffect(() => {
     dataCube.initialize().catch(application.logUnhandledError);
@@ -149,7 +148,7 @@ export const DataCube = observer(() => {
       <DataCubeTitleBar dataCube={dataCube} />
       <DataCubeGrid dataCube={dataCube} />
       <DataCubeStatusBar dataCube={dataCube} />
-      <LayoutManager layoutManagerState={repl.layout} />
+      <LayoutManager layoutManagerState={dataCubeStore.layout} />
 
       <INTERNAL__MonacoEditorWidgetsRoot />
     </div>