From 97efcf73d3b149b0764cdea422be2fe9956f9472 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebasti=C3=A1n=20Paredero?= <sebaparedero14@gmail.com>
Date: Wed, 4 Dec 2024 12:32:05 -0300
Subject: [PATCH] docs: added steps for custom integration
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

update catalog-graph integration guide with steps for custom renderNode

Signed-off-by: Sebastian Paredero <sebaparedero14@gmail.com>

Signed-off-by: Sebastián Paredero <sebaparedero14@gmail.com>
---
 plugins/catalog-graph/README.md | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/plugins/catalog-graph/README.md b/plugins/catalog-graph/README.md
index 0862abbc96..b9400e8e8b 100644
--- a/plugins/catalog-graph/README.md
+++ b/plugins/catalog-graph/README.md
@@ -137,6 +137,20 @@ return (
 );
 ```
 
+Once you have your custom implementation, you can follow these steps to modify the required components:
+
+- In the `app.tsx` update the `CatalogGraphPage` component to include your custom styles:
+
+```tsx
+<Route path=“/catalog-graph” element={<CatalogGraphPage renderNode={MyCustomRenderNode} />} />
+```
+
+- In the `Entity.tsx` file, update the `EntityCatalogGraphCard` component to this:
+
+```tsx
+<EntityCatalogGraphCard variant=“gridItem” renderNode={MyCustomRenderNode} height={400} />
+```
+
 ## Development
 
 Run `yarn` in the root of this plugin to install all dependencies and then `yarn start` to run a [development version](./dev/index.tsx) of this plugin.