@finos/legend-query-builder 0.0.2 → 0.1.0

package/src/components/ServiceQuerySetupUtils.tsx

@@ -0,0 +1,54 @@
+/**
+ * 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 { generateGAVCoordinates } from '@finos/legend-storage';
+import type { ServiceInfo } from '../stores/ServiceInfo.js';
+
+export type ServiceOption = { label: string; value: ServiceInfo };
+export const buildServiceOption = (value: ServiceInfo): ServiceOption => ({
+  label: value.name,
+  value,
+});
+
+export const formatServiceOptionLabel = (
+  option: ServiceOption,
+): React.ReactNode => (
+  <div
+    className="query-setup__service-option"
+    title={`${option.label} - ${option.value.urlPattern ?? ''} - ${
+      option.value.path
+    } - ${generateGAVCoordinates(
+      option.value.groupId,
+      option.value.artifactId,
+      option.value.versionId,
+    )}`}
+  >
+    <div className="query-setup__service-option__label">{option.label}</div>
+    <div className="query-setup__service-option__path">{option.value.path}</div>
+    <div className="query-setup__service-option__pattern">
+      {option.value.urlPattern ?? 'no pattern'}
+    </div>
+    <div className="query-setup__service-option__gav">
+      {option.value.groupId && option.value.artifactId
+        ? generateGAVCoordinates(
+            option.value.groupId,
+            option.value.artifactId,
+            option.value.versionId,
+          )
+        : null}
+    </div>
+  </div>
+);

package/src/components/explorer/QueryBuilderExplorerPanel.tsx

@@ -264,9 +264,6 @@ const QueryBuilderExplorerContextMenu = observer(
     }
   >(function QueryBuilderExplorerContextMenu(props, ref) {
     const { queryBuilderState, openNode, node } = props;
-    const applicationStore = useApplicationStore();
-    const viewType = (): void =>
-      applicationStore.notifyUnsupportedFeature('View Type');
     const addNodeToFetchStructure = (): void =>
       queryBuilderState.fetchStructureState.fetchProperty(node);
     const addNodeChildrenToFetchStructure = (): void => {
@@ -305,7 +302,6 @@ const QueryBuilderExplorerContextMenu = observer(
             Add Properties to Fetch Structure
           </MenuContentItem>
         )}
-        <MenuContentItem onClick={viewType}>View Type</MenuContentItem>
       </MenuContent>
     );
   }),
@@ -411,10 +407,6 @@ const QueryBuilderExplorerTreeNodeContainer = observer(
       }
     };
     // context menu
-    const showContextMenu =
-      node instanceof QueryBuilderExplorerTreeRootNodeData ||
-      (node instanceof QueryBuilderExplorerTreePropertyNodeData &&
-        !(node.type instanceof PrimitiveType));
     const onContextMenuOpen = (): void => setIsSelectedFromContextMenu(true);
     const onContextMenuClose = (): void => setIsSelectedFromContextMenu(false);
     const previewData = (): void => {
@@ -442,7 +434,10 @@ const QueryBuilderExplorerTreeNodeContainer = observer(
             node={node}
           />
         }
-        disabled={!showContextMenu || queryBuilderState.backdrop}
+        disabled={
+          !(node instanceof QueryBuilderExplorerTreePropertyNodeData) ||
+          queryBuilderState.backdrop
+        }
         menuProps={{ elevation: 7 }}
         onOpen={onContextMenuOpen}
         onClose={onContextMenuClose}
@@ -789,9 +784,7 @@ export const QueryBuilderExplorerPanel = observer(
       if (explorerState.treeData) {
         if (!propertySearchPanelState.isSearchPanelOpen) {
           propertySearchPanelState.setIsSearchPanelOpen(true);
-          if (!propertySearchPanelState.allMappedPropertyNodes.length) {
-            propertySearchPanelState.fetchAllPropertyNodes();
-          }
+          propertySearchPanelState.initialize();
         } else {
           propertySearchPanelState.setIsSearchPanelOpen(false);
         }

package/src/components/explorer/QueryBuilderFunctionsExplorerPanel.tsx

@@ -56,6 +56,8 @@ import {
   Package,
   ROOT_PACKAGE_NAME,
   getMultiplicityDescription,
+  CORE_PURE_PATH,
+  PURE_DOC_TAG,
 } from '@finos/legend-graph';
 import type { QueryBuilderState } from '../../stores/QueryBuilderState.js';
 
@@ -71,6 +73,15 @@ const QueryBuilderFunctionInfoTooltip: React.FC<{
   placement?: TooltipPlacement | undefined;
 }> = (props) => {
   const { element, children, placement } = props;
+  const documentation = element.taggedValues
+    .filter(
+      (taggedValue) =>
+        taggedValue.tag.ownerReference.value.path ===
+          CORE_PURE_PATH.PROFILE_DOC &&
+        taggedValue.tag.value.value === PURE_DOC_TAG,
+    )
+    .map((taggedValue) => taggedValue.value);
+
   return (
     <Tooltip
       arrow={true}
@@ -100,25 +111,24 @@ const QueryBuilderFunctionInfoTooltip: React.FC<{
             <div className="query-builder__tooltip__item__value">
               {element.parameters
                 .map(
-                  (t) =>
-                    `${t.name}: ${
-                      t.type.value.name
-                    }${getMultiplicityDescription(t.multiplicity)}`,
+                  (param) =>
+                    `${param.name}: ${
+                      param.type.value.name
+                    }${getMultiplicityDescription(param.multiplicity)}`,
                 )
                 .join('; ')}
             </div>
           </div>
-          <div className="query-builder__tooltip__item">
-            <div className="query-builder__tooltip__item__label">
-              Documentation
-            </div>
-            <div className="query-builder__tooltip__item__value">
-              {element.taggedValues
-                .filter((t) => t.tag.value._OWNER.name === 'doc')
-                .map((t) => t.value)
-                .join('; ')}
+          {Boolean(documentation.length) && (
+            <div className="query-builder__tooltip__item">
+              <div className="query-builder__tooltip__item__label">
+                Documentation
+              </div>
+              <div className="query-builder__tooltip__item__value">
+                {documentation.join('\n\n')}
+              </div>
             </div>
-          </div>
+          )}
           <div className="query-builder__tooltip__item">
             <div className="query-builder__tooltip__item__label">
               Return Type

package/src/components/explorer/{QueryBuilderMilestoneEditor.tsx → QueryBuilderMilestoningEditor.tsx}

@@ -145,7 +145,7 @@ const MilestoningParameterEditor = observer(
   },
 );
 
-const BiTemporalMilestoneEditor = observer(
+const BiTemporalMilestoningEditor = observer(
   (props: { queryBuilderState: QueryBuilderState }) => {
     const { queryBuilderState } = props;
     return (
@@ -173,7 +173,7 @@ const BiTemporalMilestoneEditor = observer(
   },
 );
 
-const BusinessTemporalMilestoneEditor = observer(
+const BusinessTemporalMilestoningEditor = observer(
   (props: { queryBuilderState: QueryBuilderState }) => {
     const { queryBuilderState } = props;
     return (
@@ -191,7 +191,7 @@ const BusinessTemporalMilestoneEditor = observer(
   },
 );
 
-const ProcessingTemporalMilestoneEditor = observer(
+const ProcessingTemporalMilestoningEditor = observer(
   (props: { queryBuilderState: QueryBuilderState }) => {
     const { queryBuilderState } = props;
     return (
@@ -209,7 +209,7 @@ const ProcessingTemporalMilestoneEditor = observer(
   },
 );
 
-const TemporalMilestoneEditor: React.FC<{
+const TemporalMilestoningEditor: React.FC<{
   queryBuilderState: QueryBuilderState;
 }> = (props) => {
   const { queryBuilderState } = props;
@@ -218,14 +218,18 @@ const TemporalMilestoneEditor: React.FC<{
     queryBuilderState.milestoningState.processingDate &&
     queryBuilderState.milestoningState.businessDate
   ) {
-    return <BiTemporalMilestoneEditor queryBuilderState={queryBuilderState} />;
+    return (
+      <BiTemporalMilestoningEditor queryBuilderState={queryBuilderState} />
+    );
   } else if (queryBuilderState.milestoningState.businessDate) {
     return (
-      <BusinessTemporalMilestoneEditor queryBuilderState={queryBuilderState} />
+      <BusinessTemporalMilestoningEditor
+        queryBuilderState={queryBuilderState}
+      />
     );
   } else if (queryBuilderState.milestoningState.processingDate) {
     return (
-      <ProcessingTemporalMilestoneEditor
+      <ProcessingTemporalMilestoningEditor
         queryBuilderState={queryBuilderState}
       />
     );
@@ -256,7 +260,7 @@ export const MilestoningParametersEditor = observer(
             <div className="modal__title">Milestoning Parameters</div>
           </div>
           <div className="modal__body query-builder__parameters__modal__body">
-            <TemporalMilestoneEditor queryBuilderState={queryBuilderState} />
+            <TemporalMilestoningEditor queryBuilderState={queryBuilderState} />
             <div className="panel__content__form__section__header__label">
               List of compatible milestoning parameters
             </div>