feat(graph): hover to see source & more UI updates (nrwl#21182)

Co-authored-by: Jack Hsu <[email protected]>

graph/project-details/jest.config.ts

@@ -0,0 +1,11 @@
+/* eslint-disable */
+export default {
+  testEnvironment: 'jsdom',
+  displayName: 'graph-project-details',
+  preset: '../../jest.preset.js',
+  transform: {
+    '^.+\\.[tj]sx?$': 'babel-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../../coverage/graph/project-details',
+};

graph/project-details/project.json

@@ -8,6 +8,13 @@
     "lint": {
       "executor": "@nx/eslint:lint",
       "outputs": ["{options.outputFile}"]
+    },
+    "test": {
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
+      "options": {
+        "jestConfig": "graph/project-details/jest.config.ts"
+      }
     }
   }
 }

graph/project-details/src/lib/project-details.tsx

@@ -12,7 +12,7 @@ import {
   useEnvironmentConfig,
   useRouteConstructor,
 } from '@nx/graph/shared';
-import Target from './target';
+import { TargetConfigurationDetails } from './target/target-configuration-details';
 
 export interface ProjectDetailsProps {
   project: ProjectGraphProjectNode;
@@ -89,7 +89,7 @@ export function ProjectDetails({
               };
               return (
                 <li className="mb-4">
-                  <Target {...props} />
+                  <TargetConfigurationDetails {...props} />
                 </li>
               );
             }