fix: improve autocompleting

src/app/utils/query-url-sanitization.ts

@@ -58,7 +58,7 @@ export function sanitizeGraphAPISandboxUrl(url: string): string {
 export function sanitizeQueryUrl(url: string): string {
   try {
     return sanitizedQueryUrl(url);
-  } catch (e: any) {
+  } catch (e: unknown) {
     return '';
   }
 }

src/app/utils/resources/resources-filter.ts

@@ -35,7 +35,18 @@ function getMatchingResourceForUrl(url: string, resources: IResource[]): IResour
   return node;
 }
 
+const getResourceFromURL = (url: string, resource: IResource): IResource | null =>{
+  url.split('/').filter(u=>u!=='').forEach((segment:string)=>{
+    const foundResource = resource?.children?.find(res=> res.segment === segment);
+    if(foundResource){
+      resource = foundResource
+    }
+  })
+  return resource;
+}
+
 export {
   searchResources,
-  getMatchingResourceForUrl
+  getMatchingResourceForUrl,
+  getResourceFromURL
 }

src/app/views/query-runner/query-input/auto-complete/AutoComplete.tsx

@@ -1,4 +1,4 @@
-import { getTheme, ITextFieldProps, KeyCodes, mergeStyles, Text, TextField } from '@fluentui/react';
+import { getTheme, ITextField, ITextFieldProps, mergeStyles, Text, TextField } from '@fluentui/react';
 import { useContext, useEffect, useRef, useState } from 'react';
 
 import { delimiters, getLastDelimiterInUrl, getSuggestions, SignContext } from '../../../../../modules/suggestions';
@@ -24,8 +24,7 @@ const AutoComplete = (props: IAutoCompleteProps) => {
 
   const dispatch = useAppDispatch();
   const validation = useContext(ValidationContext);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const focusRef = useRef<any>(null);
+  const focusRef = useRef<ITextField>(null);
 
   let element: HTMLDivElement | null | undefined = null;
 
@@ -99,34 +98,35 @@ const AutoComplete = (props: IAutoCompleteProps) => {
   };
 
   const onKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
-    switch (event.keyCode) {
-      case KeyCodes.enter:
+    const keyCode = event.code
+    switch (keyCode) {
+      case 'Enter':
         event.preventDefault();
         handleEnterKeyPressed();
         break;
 
-      case KeyCodes.tab:
+      case 'Tab':
         if (shouldShowSuggestions) {
           event.preventDefault();
           handleTabKeyPressed();
         }
         break;
 
-      case KeyCodes.up:
+      case 'ArrowUp':
         event.preventDefault();
         handleUpKeyPressed();
         break;
 
-      case KeyCodes.down:
+      case 'ArrowDown':
         event.preventDefault();
         handleDownKeyPressed();
         break;
 
-      case KeyCodes.escape:
+      case 'Escape':
         handleEscapeKeyPressed();
         break;
 
-      case KeyCodes.backspace:
+      case 'Backspace':
         setBackspacing(true);
         break;
 

src/app/views/query-runner/query-input/auto-complete/use-previous.ts

@@ -1,7 +1,7 @@
 import { useRef, useEffect } from 'react';
 
 const usePrevious = (value: string) => {
-  const reference = useRef<any>(null);
+  const reference = useRef<string>('');
   useEffect(() => {
     reference.current = value;
   });

src/modules/suggestions/suggestions.ts

@@ -1,8 +1,6 @@
 import { ISuggestions, SignContext } from '.';
 import { parseOpenApiResponse } from '../../app/utils/open-api-parser';
-import {
-  getMatchingResourceForUrl
-} from '../../app/utils/resources/resources-filter';
+import { getResourceFromURL } from '../../app/utils/resources/resources-filter';
 import { IOpenApiParseContent, IOpenApiResponse, IParsedOpenApiResponse } from '../../types/open-api';
 import { IRequestOptions } from '../../types/request';
 import { IResource } from '../../types/resources';
@@ -12,7 +10,6 @@ class Suggestions implements ISuggestions {
 
   public async getSuggestions(url: string, api: string,
     version: string, context: SignContext, resources?: IResource): Promise<IParsedOpenApiResponse | null> {
-
     if (context === 'paths') {
       const resourceOptions = await this.getSuggestionsFromResources(url, resources!);
       if (resourceOptions) {
@@ -43,7 +40,8 @@ class Suggestions implements ISuggestions {
     if (!url) {
       return this.createOpenApiResponse(resources.children, url);
     } else {
-      const matching = getMatchingResourceForUrl(url, resources.children);
+      // const matching = getMatchingResourceForUrl(url, resources.children);
+      const matching = getResourceFromURL(url, resources)
       if (matching && matching.children && matching.children.length > 0) {
         return this.createOpenApiResponse(matching.children, url)
       }