Feat/hook tests

.gitignore

@@ -1,3 +1 @@
-node_modules/
-packages/graph-explorer-proxy-server/node_modules/
-packages/graph-explorer/node_modules/
+**/node_modules/

package.json

@@ -21,21 +21,34 @@
   "author": "amazon",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^5.40.0",
-    "@typescript-eslint/parser": "^5.41.0",
-    "concurrently": "^7.5.0",
-    "eslint": "^7.32.0",
-    "eslint-plugin-react": "^7.31.10",
+    "@typescript-eslint/eslint-plugin": "^5.60.0",
+    "@typescript-eslint/parser": "^5.60.0",
+    "concurrently": "^8.2.0",
+    "eslint": "^8.43.0",
+    "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "husky": "^8.0.0",
-    "lint-staged": "^13.0.3",
-    "prettier": "2.1.2",
-    "typescript": "^4.8.4"
+    "husky": "^8.0.3",
+    "lint-staged": "^13.2.2",
+    "prettier": "2.8.8",
+    "typescript": "^5.1.3"
   },
   "lint-staged": {
     "*.{ts,tsx}": [
       "eslint --fix",
       "prettier --write"
     ]
+  },
+  "pnpm": {
+    "overrides": {
+      "json5@>=2.0.0 <2.2.2": ">=2.2.2",
+      "minimatch@<3.0.5": ">=3.0.5",
+      "loader-utils@>=2.0.0 <2.0.4": ">=2.0.4",
+      "webpack@>=5.0.0 <5.76.0": ">=5.76.0",
+      "decode-uri-component@<0.2.1": ">=0.2.1",
+      "yaml@>=2.0.0-5 <2.2.2": ">=2.2.2",
+      "vite@>=3.0.2 <3.2.7": ">=3.2.7",
+      "xml2js@<0.5.0": ">=0.5.0",
+      "semver@<7.5.2": ">=7.5.2"
+    }
   }
 }

packages/graph-explorer/babel.config.js

@@ -1,6 +1,14 @@
 module.exports = {
   presets: [
-    "@babel/preset-env",
-    ["@babel/preset-react", { runtime: "automatic" }],
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          node: 'current',
+        },
+      },
+    ],
+    '@babel/preset-react',
+    '@babel/preset-typescript',
   ],
 };

packages/graph-explorer/jest.config.ts

@@ -2,8 +2,29 @@ import type { Config } from "jest";
 
 const config: Config = {
   verbose: true,
-  preset: "ts-jest",
-  testEnvironment: "jsdom",
+  preset: 'ts-jest',
+  testEnvironment: 'node',
+  moduleFileExtensions: ['js', 'json', 'ts', 'tsx'],
+  rootDir: 'src',
+  testRegex: '.test.ts$',
+  transform: {
+    '^.+\\.(ts|tsx)$': 'ts-jest',
+  },
+  transformIgnorePatterns: [
+    "node_modules/(?!(swiper|dom7)/)",
+    "node_modules/(?!(react-dnd-html5-backend)/)"
+  ],
+  coverageDirectory: '../coverage',
+  testPathIgnorePatterns: [
+    '<rootDir>/node_modules/'
+  ],
+  collectCoverageFrom: [
+    '**/*.(t|j)s',
+  ],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/packages/$1/src',
+  },
+  coverageReporters: ['text', 'lcov'],
 };
 
-export default config;
+export default config;

packages/graph-explorer/package.json

@@ -88,6 +88,7 @@
     "@babel/core": "^7.19.3",
     "@babel/preset-env": "^7.19.4",
     "@babel/preset-react": "^7.18.6",
+    "@babel/preset-typescript": "^7.22.5",
     "@react-aria/overlays": "3.9.1",
     "@react-stately/radio": "^3.5.0",
     "@react-types/button": "^3.6.1",
@@ -131,6 +132,7 @@
     "husky": "^8.0.0",
     "jest": "^28.1.3",
     "jest-environment-jsdom": "^29.0.1",
+    "jest-localstorage-mock": "^2.4.26",
     "lint-staged": "^13.0.3",
     "prettier": "2.1.2",
     "react-test-renderer": "^17.0.2",

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

@@ -32,7 +32,7 @@ const fetchNeighbors = async (
   rawIds: Map<string, "string" | "number">
 ): Promise<NeighborsResponse> => {
   const idType = rawIds.get(req.vertexId) ?? "string";
-  const gremlinTemplate = oneHopTemplate({...req, idType});
+  const gremlinTemplate = oneHopTemplate({ ...req, idType });
   const data = await gremlinFetch<RawOneHopRequest>(gremlinTemplate);
 
   const verticesResponse =

packages/graph-explorer/src/connector/gremlin/templates/edgesSchemaTemplate.test.ts

@@ -6,9 +6,9 @@ describe("Gremlin > edgesSchemaTemplate", () => {
 
     expect(template).toBe(
       'g.E().project("route","contain")' +
-        '.by(V().bothE("route").limit(1))' +
-        '.by(V().bothE("contain").limit(1))' +
-        ".limit(1)"
+      '.by(V().bothE("route").limit(1))' +
+      '.by(V().bothE("contain").limit(1))' +
+      ".limit(1)"
     );
   });
 });

packages/graph-explorer/src/connector/utils/isErrorResponse.test.ts

@@ -0,0 +1,37 @@
+import isErrorResponse from './isErrorResponse';
+
+describe('isErrorResponse', () => {
+    it('should return true for error response', () => {
+        const errorResponse = {
+            code: 400,
+            detailedMessage: 'Detailed error message',
+        };
+
+        expect(isErrorResponse(errorResponse)).toBe(true);
+    });
+
+    it('should return false for non-error response', () => {
+        const nonErrorResponse = {
+            status: 200,
+            message: 'OK',
+        };
+
+        expect(isErrorResponse(nonErrorResponse)).toBe(false);
+    });
+
+    it('should return false for error-like response missing code', () => {
+        const errorLikeResponse = {
+            detailedMessage: 'Detailed error message',
+        };
+
+        expect(isErrorResponse(errorLikeResponse)).toBe(false);
+    });
+
+    it('should return false for error-like response missing detailedMessage', () => {
+        const errorLikeResponse = {
+            code: 400,
+        };
+
+        expect(isErrorResponse(errorLikeResponse)).toBe(false);
+    });
+});

packages/graph-explorer/src/hooks/useEntities.test.ts

@@ -0,0 +1,174 @@
+import { act, renderHook } from '@testing-library/react-hooks';
+import { RecoilRoot } from 'recoil';
+import useEntities from "./useEntities";
+import { Vertex } from '../@types/entities';
+
+
+jest.mock('localforage', () => ({
+    config: jest.fn(),
+    getItem: jest.fn(),
+}));
+
+describe('useEntities', () => {
+    beforeEach(() => {
+        jest.resetAllMocks();
+    });
+
+    it("should handle single node data correctly", async () => {
+        const randomNode = { data: { id: Math.random().toString(), type: 'type1', neighborsCount: Math.floor(Math.random() * 100), neighborsCountByType: {} } } as Vertex;
+        const expectedRandomNodes = {
+            data: {
+                id: randomNode.data.id,
+                type: randomNode.data.type,
+                neighborsCount: randomNode.data.neighborsCount,
+                neighborsCountByType: {},
+                __unfetchedNeighborCounts: {},
+                __fetchedOutEdgeCount: 0,
+                __fetchedInEdgeCount: 0,
+                __unfetchedNeighborCount: 0
+            }
+        };
+
+        const { result, waitForNextUpdate } = renderHook(
+            () => {
+                const [entities, setEntities] = useEntities({ disableFilters: true });
+                return { entities, setEntities };
+            },
+            {
+                wrapper: RecoilRoot,
+            }
+        );
+
+        act(() => {
+            result.current.setEntities({ nodes: [randomNode], edges: [] });
+        });
+
+        await waitForNextUpdate();
+
+        expect(result.current.entities).toEqual({ nodes: [expectedRandomNodes], edges: [] });
+        expect(result.current.entities.nodes[0].data.id).toEqual(randomNode.data.id);
+        expect(result.current.entities.nodes[0].data.type).toEqual(randomNode.data.type);
+        expect(result.current.entities.nodes[0].data.neighborsCount).toEqual(randomNode.data.neighborsCount);
+        expect(result.current.entities.nodes[0].data.neighborsCountByType).toEqual({});
+        expect(result.current.entities.nodes[0].data.__unfetchedNeighborCounts).toEqual({});
+        expect(result.current.entities.nodes[0].data.__fetchedOutEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[0].data.__fetchedInEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[0].data.__unfetchedNeighborCount).toEqual(0);
+
+    });
+
+    it("should handle multiple nodes correctly", async () => {
+        const node1 = { data: { id: '1', type: 'type1', neighborsCount: 1, neighborsCountByType: {} } } as Vertex;
+        const node2 = { data: { id: '2', type: 'type2', neighborsCount: 2, neighborsCountByType: {} } } as Vertex;
+        const node3 = { data: { id: '3', type: 'type3', neighborsCount: 3, neighborsCountByType: {} } } as Vertex;
+        const expectedNodes = [
+            {
+                data: {
+                    id: node1.data.id,
+                    type: node1.data.type,
+                    neighborsCount: node1.data.neighborsCount,
+                    neighborsCountByType: {},
+                    __unfetchedNeighborCounts: {},
+                    __fetchedOutEdgeCount: 0,
+                    __fetchedInEdgeCount: 0,
+                    __unfetchedNeighborCount: 0
+                }
+            },
+            {
+                data: {
+                    id: node2.data.id,
+                    type: node2.data.type,
+                    neighborsCount: node2.data.neighborsCount,
+                    neighborsCountByType: {},
+                    __unfetchedNeighborCounts: {},
+                    __fetchedOutEdgeCount: 0,
+                    __fetchedInEdgeCount: 0,
+                    __unfetchedNeighborCount: 0
+                }
+            },
+            {
+                data: {
+                    id: node3.data.id,
+                    type: node3.data.type,
+                    neighborsCount: node3.data.neighborsCount,
+                    neighborsCountByType: {},
+                    __unfetchedNeighborCounts: {},
+                    __fetchedOutEdgeCount: 0,
+                    __fetchedInEdgeCount: 0,
+                    __unfetchedNeighborCount: 0
+                }
+            }
+        ];
+
+        const { result, waitForNextUpdate } = renderHook(
+            () => {
+                const [entities, setEntities] = useEntities({ disableFilters: true });
+                return { entities, setEntities };
+            },
+            {
+                wrapper: RecoilRoot,
+            }
+        );
+
+        act(() => {
+            result.current.setEntities({ nodes: [node1, node2, node3], edges: [] });
+        });
+
+        await waitForNextUpdate();
+
+        expect(result.current.entities).toEqual({ nodes: expectedNodes, edges: [] });
+        expect(result.current.entities.nodes[0].data.id).toEqual(node1.data.id);
+        expect(result.current.entities.nodes[0].data.type).toEqual(node1.data.type);
+        expect(result.current.entities.nodes[0].data.neighborsCount).toEqual(node1.data.neighborsCount);
+        expect(result.current.entities.nodes[0].data.neighborsCountByType).toEqual({});
+        expect(result.current.entities.nodes[0].data.__unfetchedNeighborCounts).toEqual({});
+        expect(result.current.entities.nodes[0].data.__fetchedOutEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[0].data.__fetchedInEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[0].data.__unfetchedNeighborCount).toEqual(0);
+
+        expect(result.current.entities.nodes[1].data.id).toEqual(node2.data.id);
+        expect(result.current.entities.nodes[1].data.type).toEqual(node2.data.type);
+        expect(result.current.entities.nodes[1].data.neighborsCount).toEqual(node2.data.neighborsCount);
+        expect(result.current.entities.nodes[1].data.neighborsCountByType).toEqual({});
+        expect(result.current.entities.nodes[1].data.__unfetchedNeighborCounts).toEqual({});
+        expect(result.current.entities.nodes[1].data.__fetchedOutEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[1].data.__fetchedInEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[1].data.__unfetchedNeighborCount).toEqual(0);
+
+        expect(result.current.entities.nodes[2].data.id).toEqual(node3.data.id);
+        expect(result.current.entities.nodes[2].data.type).toEqual(node3.data.type);
+        expect(result.current.entities.nodes[2].data.neighborsCount).toEqual(node3.data.neighborsCount);
+        expect(result.current.entities.nodes[2].data.neighborsCountByType).toEqual({});
+        expect(result.current.entities.nodes[2].data.__unfetchedNeighborCounts).toEqual({});
+        expect(result.current.entities.nodes[2].data.__fetchedOutEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[2].data.__fetchedInEdgeCount).toEqual(0);
+        expect(result.current.entities.nodes[2].data.__unfetchedNeighborCount).toEqual(0);
+    });
+
+    it("should return original entities before any filters were applied", async () => {
+        // Define newNode and newEdge
+        const newNode = { data: { id: '1', type: 'type1', neighborsCount: 1, neighborsCountByType: {} } };
+        const newEdge = { data: { id: '1', source: '1', target: '2', type: 'type1' } };
+
+        // Define originalEntities
+        const originalEntities = {
+            nodes: [newNode],
+            edges: [newEdge]
+        };
+
+        // Mock the useEntities hook
+        const useEntitiesMock = jest.fn();
+        useEntitiesMock.mockReturnValue([originalEntities, jest.fn(), originalEntities]);
+
+        // Override the useEntities function in the module
+        jest.doMock('../../src/hooks/useEntities', () => useEntitiesMock);
+
+        // Render the hook
+        const { result } = renderHook(() => useEntitiesMock(), { wrapper: RecoilRoot });
+
+        // Since we have mocked useEntitiesMock, it should return the originalEntities immediately
+        expect(result.current[0]).toEqual(originalEntities);
+        expect(result.current[2]).toEqual(originalEntities);
+    });
+
+});