Merge pull request #343 from GinaIsaia/updated-print

Updated lineage graph print and includeprocesses

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lfai/egeria-ui-components",
-  "version": "4.3.1",
+  "version": "4.3.2",
   "description": "Encapsulated reactjs components with business logic inside.",
   "license": "Apache-2.0",
   "repository": {

src/components/Lineage/Graph/GraphActions/index.tsx

@@ -10,7 +10,7 @@ import {
   AiOutlinePrinter
 } from 'react-icons/ai';
 import { RequirePermissions } from '@lfai/egeria-ui-core';
-import { VISIBLE_COMPONENTS } from '@lfai/egeria-js-commons';
+import { LINEAGE_TYPES, VISIBLE_COMPONENTS } from '@lfai/egeria-js-commons';
 
 import '@lfai/happi-graph/src/components/HappiGraph/happi-graph.scss';
 import '../index.scss';
@@ -42,7 +42,7 @@ export function EgeriaLineageGraphActions (props: Props) {
             <AiOutlinePrinter size={25}/>
           </ActionIcon>
         </Tooltip>} />
-      { selectedNodeGroup !== 'Process' && <Tooltip label="Processes" position="right">
+      { !(selectedNodeGroup === 'Process' || lineageType === LINEAGE_TYPES.VERTICAL_LINEAGE) && <Tooltip label="Processes" position="right">
           <ActionIcon variant="subtle" size={35} onClick={() => onSwitchChange(lineageType, !includeProcess)}>
             { includeProcess ? <ToggleRight size={25} color="var(--happi-graph-primary-color)"/> : <ToggleLeft size={25} /> }
           </ActionIcon>

src/components/Lineage/Graph/index.tsx

@@ -1,5 +1,5 @@
 import { Modal, LoadingOverlay, Tabs } from '@mantine/core';
-import { egeriaFetch, authHeader, getAssetLineagePrintPath, LINEAGE_TYPES, hasTab, VISIBLE_COMPONENTS } from '@lfai/egeria-js-commons';
+import { egeriaFetch, authHeader, LINEAGE_TYPES, hasTab, VISIBLE_COMPONENTS } from '@lfai/egeria-js-commons';
 
 import {
   HappiGraph
@@ -42,7 +42,6 @@ export function EgeriaLineageGraph(props: Props) {
   const [searchParams] = useSearchParams();
   const includeProcess = !(searchParams.get('includeProcess') === 'false');
   const initialData: IGraphData = {nodes: [], edges: []};
-
   const [rawData, setRawData] = useState(initialData);
   const [loading, setLoading] = useState(false);
   const [opened, setOpened] = useState(false);
@@ -52,7 +51,11 @@ export function EgeriaLineageGraph(props: Props) {
   // TODO: extract URL to URL Map
   const uri = (lineageType: any, includeProcess:any) => `/api/lineage/entities/${guid}/${lineageType}?includeProcesses=${includeProcess}`;
 
-  const printUri = getAssetLineagePrintPath(guid, lineageType);
+  const getAssetLineagePrintPath = (guid: any, lineageType: any, includeProcess: any) => {
+    return `/asset-lineage/${ guid }/${ lineageType }/print?includeProcesses=${includeProcess}`;
+  };
+
+  const printUri = getAssetLineagePrintPath(guid, lineageType, includeProcess);
 
   const fetchData = async (uri: string) => {
     const res = await egeriaFetch(uri, 'GET', { ...authHeader() }, {});

src/components/Lineage/Graph/print.tsx

@@ -1,4 +1,4 @@
-import { useParams } from 'react-router-dom';
+import { useParams, useSearchParams } from 'react-router-dom';
 
 import {
   HappiGraph,
@@ -17,22 +17,28 @@ import { getApiDataUrl} from './index';
 import { authHeader, egeriaFetch, getFormattedDate, LINEAGE_TYPES} from '@lfai/egeria-js-commons';
 
 export function EgeriaLineageGraphPrint() {
-  const { guid, lineageType, includeProcess }: any = useParams();
+  const { guid, lineageType }: any = useParams();
   const [ isLoading, setIsLoading ] = useState(true);
   const [label, setLabel] = useState<any[]>([]);
   const [group, setGroup] = useState<any[]>([]);
 
+  const [searchParams] = useSearchParams();
+  const includeProcess = searchParams.get('includeProcesses');
+
   const [rawData, setRawData] = useState({nodes: [], edges: []});
   const isVerticalLineage = lineageType == LINEAGE_TYPES.VERTICAL_LINEAGE;
 
   const fetchData = async (uri: string) => {
     const res = await egeriaFetch(uri, 'GET', { ...authHeader() }, {});
-    const data = await res.json();
+    if (res) {
+      const data = await res.json();
+
+      setRawData(data);
+      setIsLoading(false);
 
-    setRawData(data);
-    setIsLoading(false);
-    setLabel(data.nodes.filter((d: { [x: string]: any; }) => d['id'] == guid)[0]['label']);
-    setGroup(data.nodes.filter((d: { [x: string]: any; }) => d['id'] == guid)[0]['group']);
+      setLabel(data.nodes.filter((d: { [x: string]: any; }) => d['id'] == guid)[0]['label']);
+      setGroup(data.nodes.filter((d: { [x: string]: any; }) => d['id'] == guid)[0]['group']);
+   }
   };
 
   useEffect(() => {