From dba3adaff704a4a147375d02b453ded9940bdefd Mon Sep 17 00:00:00 2001
From: ibolton336 <ibolton@redhat.com>
Date: Tue, 3 Oct 2023 17:09:36 -0400
Subject: [PATCH] :ghost: Add dependencies link to the app drawer

Signed-off-by: ibolton336 <ibolton@redhat.com>
---
 .../application-detail-drawer.tsx             | 35 +++++++++++++++----
 client/src/app/pages/issues/helpers.ts        | 13 +++++++
 2 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx b/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx
index 5d30e29e2b..f9255a657e 100644
--- a/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx
+++ b/client/src/app/pages/applications/components/application-detail-drawer/application-detail-drawer.tsx
@@ -11,7 +11,8 @@ import {
   TabTitleText,
   Spinner,
   Bullseye,
-  Button,
+  List,
+  ListItem,
 } from "@patternfly/react-core";
 import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
 import { Application, Task } from "@app/api/models";
@@ -19,7 +20,10 @@ import {
   IPageDrawerContentProps,
   PageDrawerContent,
 } from "@app/components/PageDrawerContext";
-import { getIssuesSingleAppSelectedLocation } from "@app/pages/issues/helpers";
+import {
+  getDependenciesUrlFilteredByAppName,
+  getIssuesSingleAppSelectedLocation,
+} from "@app/pages/issues/helpers";
 import { ApplicationBusinessService } from "../application-business-service";
 import { ApplicationTags } from "../application-tags";
 
@@ -83,11 +87,28 @@ export const ApplicationDetailDrawer: React.FC<
         >
           <TextContent className={`${spacing.mtMd} ${spacing.mbMd}`}>
             <Text component="small">{application?.description}</Text>
-            {application ? (
-              <Link to={getIssuesSingleAppSelectedLocation(application.id)}>
-                Issues
-              </Link>
-            ) : null}
+            <List isPlain>
+              {application ? (
+                <>
+                  <ListItem>
+                    <Link
+                      to={getIssuesSingleAppSelectedLocation(application.id)}
+                    >
+                      Issues
+                    </Link>
+                  </ListItem>
+                  <ListItem>
+                    <Link
+                      to={getDependenciesUrlFilteredByAppName(
+                        application?.name
+                      )}
+                    >
+                      Dependencies
+                    </Link>
+                  </ListItem>
+                </>
+              ) : null}
+            </List>
             <Title headingLevel="h3" size="md">
               {t("terms.businessService")}
             </Title>
diff --git a/client/src/app/pages/issues/helpers.ts b/client/src/app/pages/issues/helpers.ts
index 310daaf997..23ae1b64aa 100644
--- a/client/src/app/pages/issues/helpers.ts
+++ b/client/src/app/pages/issues/helpers.ts
@@ -162,6 +162,19 @@ export const getBackToAllIssuesUrl = ({
   })}`;
 };
 
+export const getDependenciesUrlFilteredByAppName = (appName: string) => {
+  const baseUrl = Paths.dependencies;
+  const filterParams = serializeFilterUrlParams({
+    "application.name": [appName],
+  });
+  const urlParams = trimAndStringifyUrlParams({
+    newPrefixedSerializedParams: {
+      filters: filterParams.filters,
+    },
+  });
+  return `${baseUrl}?${urlParams}`;
+};
+
 // When selecting an application, we want to preserve any issue filters that might be present.
 export const getIssuesSingleAppSelectedLocation = (
   applicationId: number,