From c7eaf69c1e25f532067a5459693ede4ef55a651c Mon Sep 17 00:00:00 2001
From: Georgi Manev <61829525+Georgi2704@users.noreply.github.com>
Date: Thu, 12 Dec 2024 15:52:25 +0100
Subject: [PATCH] Add subscriptionPath option for WfoRelatedSubscriptions,
 WfoSubscriptionDetailTree (#1627)

---
 .changeset/thick-melons-agree.md                       |  5 +++++
 .../WfoSubscription/WfoRelatedSubscriptions.tsx        |  4 +++-
 .../WfoSubscription/WfoSubscriptionDetailTree.tsx      |  5 ++++-
 .../WfoSubscriptionProductBlock.tsx                    | 10 ++++------
 4 files changed, 16 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/thick-melons-agree.md

diff --git a/.changeset/thick-melons-agree.md b/.changeset/thick-melons-agree.md
new file mode 100644
index 000000000..6c103518c
--- /dev/null
+++ b/.changeset/thick-melons-agree.md
@@ -0,0 +1,5 @@
+---
+'@orchestrator-ui/orchestrator-ui-components': minor
+---
+
+1620 Add subscriptionPath option for WfoRelatedSubscriptions, WfoSubscriptionDetailTree
diff --git a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoRelatedSubscriptions.tsx b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoRelatedSubscriptions.tsx
index e6967e3de..7f8a5db7a 100644
--- a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoRelatedSubscriptions.tsx
+++ b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoRelatedSubscriptions.tsx
@@ -52,10 +52,12 @@ export type RelatedSubscriptionListItem = Pick<
 
 interface WfoRelatedSubscriptionsProps {
     subscriptionId: string;
+    subscriptionPath?: string;
 }
 
 export const WfoRelatedSubscriptions = ({
     subscriptionId,
+    subscriptionPath = PATH_SUBSCRIPTIONS,
 }: WfoRelatedSubscriptionsProps) => {
     const [hideTerminatedSubscriptions, setHideTerminatedSubscriptions] =
         useState<boolean>(true);
@@ -109,7 +111,7 @@ export const WfoRelatedSubscriptions = ({
             renderData: (value, record) => (
                 <Link
                     target="_blank"
-                    href={`${PATH_SUBSCRIPTIONS}/${record.subscriptionId}`}
+                    href={`${subscriptionPath}/${record.subscriptionId}`}
                 >
                     {value}
                 </Link>
diff --git a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx
index be6792fd5..6c1383e98 100644
--- a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx
+++ b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx
@@ -4,7 +4,7 @@ import { useTranslations } from 'next-intl';
 
 import { EuiCallOut, EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
 
-import { WfoLoading, WfoTextAnchor } from '@/components';
+import { PATH_SUBSCRIPTIONS, WfoLoading, WfoTextAnchor } from '@/components';
 import { TreeContext, TreeContextType } from '@/contexts';
 import { useOrchestratorTheme, useWithOrchestratorTheme } from '@/hooks';
 import {
@@ -24,11 +24,13 @@ import { getProductBlockTitle } from './utils';
 interface WfoSubscriptionDetailTreeProps {
     productBlockInstances: ProductBlockInstance[];
     subscriptionId: Subscription['subscriptionId'];
+    subscriptionPath?: string;
 }
 
 export const WfoSubscriptionDetailTree = ({
     productBlockInstances,
     subscriptionId,
+    subscriptionPath = PATH_SUBSCRIPTIONS,
 }: WfoSubscriptionDetailTreeProps) => {
     const t = useTranslations('subscriptions.detail');
     const { theme } = useOrchestratorTheme();
@@ -210,6 +212,7 @@ export const WfoSubscriptionDetailTree = ({
                                     key={id}
                                     subscriptionId={subscriptionId}
                                     productBlock={block}
+                                    subscriptionPath={subscriptionPath}
                                 />
                             );
                         })}
diff --git a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoSubscriptionProductBlock.tsx b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoSubscriptionProductBlock.tsx
index 58e991afe..57f6ed97c 100644
--- a/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoSubscriptionProductBlock.tsx
+++ b/packages/orchestrator-ui-components/src/components/WfoSubscription/WfoSubscriptionProductBlock/WfoSubscriptionProductBlock.tsx
@@ -13,11 +13,7 @@ import {
     EuiText,
 } from '@elastic/eui';
 
-import {
-    PATH_SUBSCRIPTIONS,
-    WfoProductBlockKeyValueRow,
-    WfoValueCell,
-} from '@/components';
+import { WfoProductBlockKeyValueRow, WfoValueCell } from '@/components';
 import { useWithOrchestratorTheme } from '@/hooks';
 import { ProductBlockInstance, Subscription } from '@/types';
 import { getFirstUuidPart } from '@/utils';
@@ -32,6 +28,7 @@ import { getStyles } from './styles';
 interface WfoSubscriptionProductBlockProps {
     productBlock: ProductBlockInstance;
     subscriptionId: Subscription['subscriptionId'];
+    subscriptionPath: string;
 }
 
 export const HIDDEN_KEYS = ['title', 'name', 'label', 'inUseByIds'];
@@ -39,6 +36,7 @@ export const HIDDEN_KEYS = ['title', 'name', 'label', 'inUseByIds'];
 export const WfoSubscriptionProductBlock = ({
     productBlock,
     subscriptionId,
+    subscriptionPath,
 }: WfoSubscriptionProductBlockProps) => {
     const t = useTranslations('subscriptions.detail');
     const {
@@ -139,7 +137,7 @@ export const WfoSubscriptionProductBlock = ({
                                             value={
                                                 <>
                                                     <a
-                                                        href={`${PATH_SUBSCRIPTIONS}/${ownerSubscriptionId}`}
+                                                        href={`${subscriptionPath}/${ownerSubscriptionId}`}
                                                         target="_blank"
                                                     >
                                                         {