From 91370875a8b6e889584a53405ebca31e3b7c6bb4 Mon Sep 17 00:00:00 2001
From: Scott J Dickerson <sdickers@redhat.com>
Date: Thu, 16 Nov 2023 13:41:11 -0500
Subject: [PATCH] :bug: Refactor layout of Dependencies details drawer

Refactor the header and layout of tabs for the dependencies detail
drawer following the changes in #1542.

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
---
 .../dependency-apps-detail-drawer.tsx         | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/client/src/app/pages/dependencies/dependency-apps-detail-drawer.tsx b/client/src/app/pages/dependencies/dependency-apps-detail-drawer.tsx
index 96112c6321..2c9fc38843 100644
--- a/client/src/app/pages/dependencies/dependency-apps-detail-drawer.tsx
+++ b/client/src/app/pages/dependencies/dependency-apps-detail-drawer.tsx
@@ -39,23 +39,24 @@ export const DependencyAppsDetailDrawer: React.FC<
       focusKey={dependency?.name}
       pageKey="analysis-app-dependencies"
       drawerPanelContentProps={{ defaultSize: "600px" }}
+      header={
+        <TextContent>
+          <Text component="small" className={spacing.mb_0}>
+            Dependency
+          </Text>
+          <Title headingLevel="h2" size="lg" className={spacing.mtXs}>
+            {dependency?.name || ""} ({dependency?.provider || "none"})
+          </Title>
+        </TextContent>
+      }
     >
       {!dependency ? (
         <StateNoData />
       ) : (
-        <>
-          <TextContent>
-            <Text component="small" className={spacing.mb_0}>
-              Dependencies
-            </Text>
-            <Title headingLevel="h2" size="lg" className={spacing.mtXs}>
-              {dependency?.name || ""}
-            </Title>
-          </TextContent>
+        <div>
           <Tabs
             activeKey={activeTabKey}
             onSelect={(_event, tabKey) => setActiveTabKey(tabKey as TabKey)}
-            className={spacing.mtLg}
           >
             <Tab
               eventKey={TabKey.Applications}
@@ -66,7 +67,7 @@ export const DependencyAppsDetailDrawer: React.FC<
               ) : null}
             </Tab>
           </Tabs>
-        </>
+        </div>
       )}
     </PageDrawerContent>
   );