Make sure Explorer always has a value

Changelog.md

@@ -25,7 +25,8 @@
   [#767](https://github.com/aws/graph-explorer/pull/767),
   [#768](https://github.com/aws/graph-explorer/pull/768),
   [#769](https://github.com/aws/graph-explorer/pull/769),
-  [#770](https://github.com/aws/graph-explorer/pull/770))
+  [#770](https://github.com/aws/graph-explorer/pull/770),
+  [#775](https://github.com/aws/graph-explorer/pull/775),
 - **Updated** dependencies
   ([#764](https://github.com/aws/graph-explorer/pull/764))
 

packages/graph-explorer/src/connector/emptyExplorer.ts

@@ -0,0 +1,57 @@
+/* eslint-disable @typescript-eslint/require-await */
+import { Explorer } from "./useGEFetchTypes";
+
+/**
+ * Empty explorer for when there is no connection.
+ */
+export const emptyExplorer: Explorer = {
+  connection: {
+    url: "",
+    queryEngine: "gremlin",
+    proxyConnection: false,
+    awsAuthEnabled: false,
+  },
+  fetchSchema: async () => {
+    return {
+      totalVertices: 0,
+      vertices: [],
+      totalEdges: 0,
+      edges: [],
+    };
+  },
+  fetchVertexCountsByType: async () => {
+    return {
+      total: 0,
+    };
+  },
+  fetchNeighbors: async () => {
+    return {
+      vertices: [],
+      edges: [],
+      scalars: [],
+    };
+  },
+  fetchNeighborsCount: async () => {
+    return {
+      totalCount: 0,
+      counts: {},
+    };
+  },
+  keywordSearch: async () => {
+    return {
+      vertices: [],
+      edges: [],
+      scalars: [],
+    };
+  },
+  vertexDetails: async () => {
+    return {
+      vertex: null,
+    };
+  },
+  edgeDetails: async () => {
+    return {
+      edge: null,
+    };
+  },
+};

packages/graph-explorer/src/connector/queries.ts

@@ -1,6 +1,5 @@
 import { QueryClient, queryOptions } from "@tanstack/react-query";
 import {
-  CountsByTypeResponse,
   EdgeDetailsRequest,
   EdgeDetailsResponse,
   Explorer,
@@ -20,14 +19,13 @@ import { Edge, Vertex, VertexId } from "@/core";
  */
 export function searchQuery(
   request: KeywordSearchRequest,
-  explorer: Explorer | null,
+  explorer: Explorer,
   queryClient: QueryClient
 ) {
   return queryOptions({
     queryKey: ["keyword-search", request, explorer, queryClient],
-    enabled: Boolean(explorer),
-    queryFn: async ({ signal }): Promise<KeywordSearchResponse | null> => {
-      if (!explorer || !request) {
+    queryFn: async ({ signal }): Promise<KeywordSearchResponse> => {
+      if (!request) {
         return { vertices: [], edges: [], scalars: [] };
       }
       const results = await explorer.keywordSearch(request, { signal });
@@ -58,19 +56,11 @@ export type NeighborCountsQueryResponse = {
  */
 export function neighborsCountQuery(
   request: NeighborCountsQueryRequest,
-  explorer: Explorer | null
+  explorer: Explorer
 ) {
   return queryOptions({
     queryKey: ["neighborsCount", request, explorer],
     queryFn: async (): Promise<NeighborCountsQueryResponse> => {
-      if (!explorer) {
-        return {
-          nodeId: request.vertexId,
-          totalCount: 0,
-          counts: {},
-        };
-      }
-
       const limit = explorer.connection.nodeExpansionLimit;
 
       const result = await explorer.fetchNeighborsCount({
@@ -95,45 +85,35 @@ export function neighborsCountQuery(
  */
 export const nodeCountByNodeTypeQuery = (
   nodeType: string,
-  explorer: Explorer | null
+  explorer: Explorer
 ) =>
   queryOptions({
     queryKey: ["node-count-by-node-type", nodeType, explorer],
-    enabled: Boolean(explorer),
     queryFn: () =>
-      explorer?.fetchVertexCountsByType({
+      explorer.fetchVertexCountsByType({
         label: nodeType,
-      }) ?? nodeCountByNodeTypeEmptyResponse,
+      }),
   });
-const nodeCountByNodeTypeEmptyResponse: CountsByTypeResponse = { total: 0 };
 
 export function vertexDetailsQuery(
   request: VertexDetailsRequest,
-  explorer: Explorer | null
+  explorer: Explorer
 ) {
   return queryOptions({
     queryKey: ["db", "vertex", "details", request, explorer],
-    queryFn: async ({ signal }): Promise<VertexDetailsResponse> => {
-      if (!explorer) {
-        return { vertex: null };
-      }
-      return await explorer.vertexDetails(request, { signal });
-    },
+    queryFn: ({ signal }): Promise<VertexDetailsResponse> =>
+      explorer.vertexDetails(request, { signal }),
   });
 }
 
 export function edgeDetailsQuery(
   request: EdgeDetailsRequest,
-  explorer: Explorer | null
+  explorer: Explorer
 ) {
   return queryOptions({
     queryKey: ["db", "edge", "details", request, explorer],
-    queryFn: async ({ signal }): Promise<EdgeDetailsResponse> => {
-      if (!explorer) {
-        return { edge: null };
-      }
-      return await explorer.edgeDetails(request, { signal });
-    },
+    queryFn: ({ signal }): Promise<EdgeDetailsResponse> =>
+      explorer.edgeDetails(request, { signal }),
   });
 }
 

packages/graph-explorer/src/core/connector.ts

@@ -14,6 +14,7 @@ import { ConnectionConfig } from "@shared/types";
 import { logger } from "@/utils";
 import { featureFlagsSelector } from "./featureFlags";
 import { Explorer } from "@/connector/useGEFetchTypes";
+import { emptyExplorer } from "@/connector/emptyExplorer";
 
 /**
  * Active connection where the value will only change when one of the
@@ -62,7 +63,7 @@ export const explorerSelector = selector({
     const featureFlags = get(featureFlagsSelector);
 
     if (!connection) {
-      return null;
+      return emptyExplorer;
     }
     switch (connection.queryEngine) {
       case "openCypher":
@@ -77,9 +78,6 @@ export const explorerSelector = selector({
 
 export function useExplorer() {
   const explorer = useRecoilValue(explorerSelector);
-  if (!explorer) {
-    throw new Error("No explorer found");
-  }
   return explorer;
 }
 

packages/graph-explorer/src/hooks/useExpandNode.tsx

@@ -64,14 +64,14 @@ export default function useExpandNode() {
         limit,
       };
 
-      if (!explorer || !request) {
+      if (!request) {
         return null;
       }
 
       return await explorer.fetchNeighbors(request);
     },
     onSuccess: data => {
-      if (!data || !explorer) {
+      if (!data) {
         return;
       }
 

packages/graph-explorer/src/hooks/useSchemaSync.ts

@@ -18,7 +18,7 @@ const useSchemaSync = (onSyncChange?: (isSyncing: boolean) => void) => {
 
   const { replaceSchema, setSyncFailure } = useUpdateSchema();
   return useCallback(async () => {
-    if (!config || !explorer) {
+    if (!config) {
       return;
     }