Fix: Show documentation URL for supported Resource Explorer items (#2625

)

package.json

@@ -1,6 +1,6 @@
 {
         "name": "graph-explorer-v2",
-        "version": "9.0.0",
+        "version": "9.0.1",
         "private": true,
         "dependencies": {
                 "@augloop/types-core": "file:packages/types-core-2.16.189.tgz",

src/app/views/sidebar/resource-explorer/ResourceLink.tsx

@@ -6,10 +6,13 @@ import { CSSProperties, useEffect } from 'react';
 
 import { useAppSelector } from '../../../../store';
 import { componentNames, eventTypes, telemetry } from '../../../../telemetry';
-import { IResourceLink, ResourceOptions } from '../../../../types/resources';
+import { IResourceLink, IResources, ResourceOptions } from '../../../../types/resources';
+import { GRAPH_URL } from '../../../services/graph-constants';
 import { validateExternalLink } from '../../../utils/external-link-validation';
 import { getStyleFor } from '../../../utils/http-methods.utils';
 import { translateMessage } from '../../../utils/translate-messages';
+import DocumentationService from '../../query-runner/query-input/auto-complete/suffix/documentation';
+import { getUrlFromLink } from './resource-explorer.utils';
 import { existsInCollection, setExisting } from './resourcelink.utils';
 
 interface IResourceLinkProps {
@@ -21,7 +24,7 @@ interface IResourceLinkProps {
 
 const ResourceLink = (props: IResourceLinkProps) => {
   const { classes, version } = props;
-  const { collections } = useAppSelector(state => state);
+  const { collections, resources } = useAppSelector(state => state);
   const link = props.link as IResourceLink;
 
   const paths = collections?.find(k => k.isDefault)?.paths || [];
@@ -78,6 +81,9 @@ const ResourceLink = (props: IResourceLinkProps) => {
     textTransform: 'uppercase'
   }
 
+  resourceLink.docLink = resourceLink.docLink ? resourceLink.docLink
+    : getDocumentationLink(resourceLink, version, resources);
+
   const openDocumentationLink = () => {
     window.open(resourceLink.docLink, '_blank');
     trackDocumentLinkClickedEvent();
@@ -186,3 +192,21 @@ const ResourceLink = (props: IResourceLinkProps) => {
 
 
 export default ResourceLink;
+
+function getDocumentationLink(resourceLink: IResourceLink, version: string, resources: IResources): string | null {
+  if (!resourceLink.method) {
+    return null;
+  }
+
+  return new DocumentationService({
+    sampleQuery: {
+      sampleUrl: `${GRAPH_URL}/${version}${getUrlFromLink(resourceLink.paths)}`,
+      selectedVerb: resourceLink.method,
+      selectedVersion: version,
+      sampleBody: '',
+      sampleHeaders: []
+    },
+    source: resources.data.children
+  }).getDocumentationLink();
+}
+