@finos/legend-extension-dsl-data-space 0.2.0 → 1.0.4

package/src/components/studio/EnterpriseModelExplorerStoreProvider.tsx

@@ -1,61 +0,0 @@
-/**
- * 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 { createContext, useContext } from 'react';
-import { useLocalObservable } from 'mobx-react-lite';
-import { useApplicationStore } from '@finos/legend-application';
-import { guaranteeNonNullable } from '@finos/legend-shared';
-import { useDepotServerClient } from '@finos/legend-server-depot';
-import { useGraphManagerState } from '@finos/legend-graph';
-import { EnterpriseModelExplorerStore } from '../../stores/studio/EnterpriseModelExplorerStore';
-import type { StudioConfig } from '@finos/legend-studio';
-import { useStudioStore } from '@finos/legend-studio';
-
-const EnterpriseModelExplorerStoreContext = createContext<
-  EnterpriseModelExplorerStore | undefined
->(undefined);
-
-export const EnterpriseModelExplorerStoreProvider = ({
-  children,
-}: {
-  children: React.ReactNode;
-}): React.ReactElement => {
-  const applicationStore = useApplicationStore<StudioConfig>();
-  const depotServerClient = useDepotServerClient();
-  const graphManagerState = useGraphManagerState();
-  const studioStore = useStudioStore();
-  const store = useLocalObservable(
-    () =>
-      new EnterpriseModelExplorerStore(
-        applicationStore,
-        depotServerClient,
-        graphManagerState,
-        studioStore.pluginManager,
-      ),
-  );
-  return (
-    <EnterpriseModelExplorerStoreContext.Provider value={store}>
-      {children}
-    </EnterpriseModelExplorerStoreContext.Provider>
-  );
-};
-
-export const useEnterpriseModelExplorerStore =
-  (): EnterpriseModelExplorerStore =>
-    guaranteeNonNullable(
-      useContext(EnterpriseModelExplorerStoreContext),
-      `Can't find enterprise model explorer store in context`,
-    );

package/src/components/studio/TaxonomyTree.tsx

@@ -1,179 +0,0 @@
-/**
- * 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 { useState } from 'react';
-import { observer } from 'mobx-react-lite';
-import type { TaxonomyTreeNodeData } from '../../stores/studio/EnterpriseModelExplorerStore';
-import {
-  generateTaxonomyNodeRoute,
-  TaxonomyViewerState,
-} from '../../stores/studio/EnterpriseModelExplorerStore';
-import type { TreeData, TreeNodeContainerProps } from '@finos/legend-art';
-import {
-  ContextMenu,
-  MenuContent,
-  MenuContentItem,
-  CircleIcon,
-  EmptyCircleIcon,
-  ChevronDownIcon,
-  ChevronRightIcon,
-  clsx,
-  TreeView,
-} from '@finos/legend-art';
-import { useEnterpriseModelExplorerStore } from './EnterpriseModelExplorerStoreProvider';
-import { isNonNullable } from '@finos/legend-shared';
-import { useApplicationStore } from '@finos/legend-application';
-
-const TaxonomyTreeNodeContainer = observer(
-  (
-    props: TreeNodeContainerProps<
-      TaxonomyTreeNodeData,
-      {
-        treeData: TreeData<TaxonomyTreeNodeData>;
-      }
-    >,
-  ) => {
-    const { node, level, stepPaddingInRem, onNodeSelect, innerProps } = props;
-    const { treeData } = innerProps;
-    const [isSelectedFromContextMenu, setIsSelectedFromContextMenu] =
-      useState(false);
-    const applicationStore = useApplicationStore();
-    const enterpriseModelExplorerStore = useEnterpriseModelExplorerStore();
-    const expandIcon = !node.childrenIds.length ? (
-      <div />
-    ) : node.isOpen ? (
-      <ChevronDownIcon />
-    ) : (
-      <ChevronRightIcon />
-    );
-    const selectNode = (): void => onNodeSelect?.(node);
-    const toggleExpand = (event: React.MouseEvent): void => {
-      event.preventDefault();
-      event.stopPropagation();
-      if (node.childrenIds.length) {
-        node.isOpen = !node.isOpen;
-      }
-      enterpriseModelExplorerStore.setTreeData({
-        ...treeData,
-      });
-    };
-    const onContextMenuOpen = (): void => setIsSelectedFromContextMenu(true);
-    const onContextMenuClose = (): void => setIsSelectedFromContextMenu(false);
-    const copyLink = (): void => {
-      applicationStore
-        .copyTextToClipboard(
-          applicationStore.navigator.generateLocation(
-            generateTaxonomyNodeRoute(node.id),
-          ),
-        )
-        .then(() =>
-          applicationStore.notifySuccess(
-            'Copied taxonomy node link to clipboard',
-          ),
-        )
-        .catch(applicationStore.alertIllegalUnhandledError);
-    };
-
-    return (
-      <ContextMenu
-        content={
-          <MenuContent>
-            <MenuContentItem onClick={copyLink}>Copy Link</MenuContentItem>
-          </MenuContent>
-        }
-        menuProps={{ elevation: 7 }}
-        onOpen={onContextMenuOpen}
-        onClose={onContextMenuClose}
-      >
-        <div
-          className={clsx(
-            'tree-view__node__container enterprise-taxonomy-tree__node__container',
-            {
-              'menu__trigger--on-menu-open':
-                !node.isSelected && isSelectedFromContextMenu,
-            },
-            {
-              'enterprise-taxonomy-tree__node__container--selected':
-                node ===
-                enterpriseModelExplorerStore.currentTaxonomyViewerState
-                  ?.taxonomyNode,
-            },
-          )}
-          onClick={selectNode}
-          style={{
-            paddingLeft: `${level * (stepPaddingInRem ?? 1)}rem`,
-            display: 'flex',
-          }}
-        >
-          <div className="tree-view__node__icon enterprise-taxonomy-tree__node__icon">
-            <button
-              className="enterprise-taxonomy-tree__node__icon__expand"
-              tabIndex={-1}
-              onClick={toggleExpand}
-            >
-              {expandIcon}
-            </button>
-            <div className="enterprise-taxonomy-tree__node__icon__type">
-              {node.childrenIds.length ? <CircleIcon /> : <EmptyCircleIcon />}
-            </div>
-          </div>
-          <button
-            className="tree-view__node__label enterprise-taxonomy-tree__node__label"
-            tabIndex={-1}
-          >
-            {node.label}
-          </button>
-        </div>
-      </ContextMenu>
-    );
-  },
-);
-
-export const TaxonomyTree = observer(
-  (props: { treeData: TreeData<TaxonomyTreeNodeData> }) => {
-    const { treeData } = props;
-    const enterpriseModelExplorerStore = useEnterpriseModelExplorerStore();
-
-    const onNodeSelect = (node: TaxonomyTreeNodeData): void => {
-      enterpriseModelExplorerStore.setCurrentTaxonomyViewerState(
-        new TaxonomyViewerState(enterpriseModelExplorerStore, node),
-      );
-      enterpriseModelExplorerStore.setTreeData({ ...treeData });
-    };
-
-    const getChildNodes = (
-      node: TaxonomyTreeNodeData,
-    ): TaxonomyTreeNodeData[] =>
-      node.childrenIds
-        .map((id) => treeData.nodes.get(id))
-        .filter(isNonNullable)
-        .sort((a, b) => a.label.localeCompare(b.label));
-
-    return (
-      <TreeView
-        components={{
-          TreeNodeContainer: TaxonomyTreeNodeContainer,
-        }}
-        treeData={treeData}
-        onNodeSelect={onNodeSelect}
-        getChildNodes={getChildNodes}
-        innerProps={{
-          treeData,
-        }}
-      />
-    );
-  },
-);

package/src/components/studio/TaxonomyViewer.tsx

@@ -1,187 +0,0 @@
-/**
- * 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 { useState } from 'react';
-import { observer } from 'mobx-react-lite';
-import type {
-  RawDataSpace,
-  TaxonomyViewerState,
-} from '../../stores/studio/EnterpriseModelExplorerStore';
-import { generateDataSpaceRoute } from '../../stores/studio/EnterpriseModelExplorerStore';
-import {
-  BlankPanelContent,
-  clsx,
-  PanelLoadingIndicator,
-  SquareIcon,
-  ResizablePanel,
-  ResizablePanelGroup,
-  ResizablePanelSplitter,
-  ContextMenu,
-  MenuContent,
-  MenuContentItem,
-} from '@finos/legend-art';
-import { DataSpaceViewer } from '../DataSpaceViewer';
-import { flowResult } from 'mobx';
-import { useApplicationStore } from '@finos/legend-application';
-import { generateGAVCoordinates } from '@finos/legend-server-depot';
-
-const TaxonomyDataSpaceItem = observer(
-  (props: {
-    rawDataSpace: RawDataSpace;
-    taxonomyViewerState: TaxonomyViewerState;
-    selectDataSpace: () => void;
-  }) => {
-    const { rawDataSpace, taxonomyViewerState, selectDataSpace } = props;
-    const [isSelectedFromContextMenu, setIsSelectedFromContextMenu] =
-      useState(false);
-    const applicationStore = useApplicationStore();
-    const isSelected = rawDataSpace === taxonomyViewerState.currentDataSpace;
-    const onContextMenuOpen = (): void => setIsSelectedFromContextMenu(true);
-    const onContextMenuClose = (): void => setIsSelectedFromContextMenu(false);
-    const copyLink = (): void => {
-      applicationStore
-        .copyTextToClipboard(
-          applicationStore.navigator.generateLocation(
-            generateDataSpaceRoute(
-              taxonomyViewerState.taxonomyNode.id,
-              generateGAVCoordinates(
-                rawDataSpace.groupId,
-                rawDataSpace.artifactId,
-                rawDataSpace.versionId,
-              ),
-              rawDataSpace.path,
-            ),
-          ),
-        )
-        .then(() =>
-          applicationStore.notifySuccess('Copied data space link to clipboard'),
-        )
-        .catch(applicationStore.alertIllegalUnhandledError);
-    };
-
-    return (
-      <ContextMenu
-        content={
-          <MenuContent>
-            <MenuContentItem onClick={copyLink}>Copy Link</MenuContentItem>
-          </MenuContent>
-        }
-        menuProps={{ elevation: 7 }}
-        onOpen={onContextMenuOpen}
-        onClose={onContextMenuClose}
-        key={rawDataSpace.id}
-      >
-        <button
-          className={clsx(
-            'taxonomy-viewer__explorer__entry',
-            {
-              'menu__trigger--on-menu-open':
-                !isSelected && isSelectedFromContextMenu,
-            },
-            {
-              'taxonomy-viewer__explorer__entry--active': isSelected,
-            },
-          )}
-          tabIndex={-1}
-          onClick={selectDataSpace}
-          title={rawDataSpace.id}
-        >
-          <div className="taxonomy-viewer__explorer__entry__icon">
-            <SquareIcon />
-          </div>
-          <div className="taxonomy-viewer__explorer__entry__path">
-            {rawDataSpace.path}
-          </div>
-        </button>
-      </ContextMenu>
-    );
-  },
-);
-
-const TaxonomyViewerExplorer = observer(
-  (props: { taxonomyViewerState: TaxonomyViewerState }) => {
-    const { taxonomyViewerState } = props;
-    const applicationStore = useApplicationStore();
-    const taxonomyNode = taxonomyViewerState.taxonomyNode;
-    const selectDataSpace =
-      (rawDataSpace: RawDataSpace): (() => void) =>
-      (): void => {
-        flowResult(
-          taxonomyViewerState.initializeDataSpaceViewer(rawDataSpace),
-        ).catch(applicationStore.alertIllegalUnhandledError);
-      };
-
-    return (
-      <div className="panel taxonomy-viewer__explorer">
-        <div className="panel__header taxonomy-viewer__explorer__header">
-          <div className="panel__header__title taxonomy-viewer__explorer__header__title">
-            Dataspaces ({taxonomyNode.rawDataSpaces.length})
-          </div>
-        </div>
-        <div className="panel__content taxonomy-viewer__explorer__content">
-          {taxonomyNode.rawDataSpaces.length === 0 && (
-            <BlankPanelContent>No data space available</BlankPanelContent>
-          )}
-          {taxonomyNode.rawDataSpaces.length !== 0 &&
-            taxonomyNode.rawDataSpaces.map((rawDataSpace) => (
-              <TaxonomyDataSpaceItem
-                key={rawDataSpace.id}
-                rawDataSpace={rawDataSpace}
-                selectDataSpace={selectDataSpace(rawDataSpace)}
-                taxonomyViewerState={taxonomyViewerState}
-              />
-            ))}
-        </div>
-      </div>
-    );
-  },
-);
-
-export const TaxonomyViewer = observer(
-  (props: { taxonomyViewerState: TaxonomyViewerState }) => {
-    const { taxonomyViewerState } = props;
-
-    return (
-      <div className="taxonomy-viewer">
-        <ResizablePanelGroup orientation="vertical">
-          <ResizablePanel minSize={300} size={300}>
-            <TaxonomyViewerExplorer taxonomyViewerState={taxonomyViewerState} />
-          </ResizablePanel>
-          <ResizablePanelSplitter />
-          <ResizablePanel minSize={300}>
-            {taxonomyViewerState.dataSpaceViewerState && (
-              <DataSpaceViewer
-                dataSpaceViewerState={taxonomyViewerState.dataSpaceViewerState}
-              />
-            )}
-            {!taxonomyViewerState.dataSpaceViewerState &&
-              taxonomyViewerState.initDataSpaceViewerState.isInProgress && (
-                <div className="taxonomy-viewer__content-placeholder">
-                  <PanelLoadingIndicator isLoading={true} />
-                  <BlankPanelContent>Loading data space...</BlankPanelContent>
-                </div>
-              )}
-            {!taxonomyViewerState.dataSpaceViewerState && (
-              <div className="taxonomy-viewer__content-placeholder">
-                <BlankPanelContent>No data space selected</BlankPanelContent>
-              </div>
-            )}
-          </ResizablePanel>
-        </ResizablePanelGroup>
-      </div>
-    );
-  },
-);