From 230e1edc003c86d5b54b9fc4c3d444f3332a2d3f Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Sat, 27 Sep 2025 14:16:13 +1000
Subject: [PATCH] Add info badge to part renderer (#10409)

- Show extra information about ordering and building
- Closes https://github.com/inventree/InvenTree/issues/10380
---
 src/frontend/src/components/render/Part.tsx  | 47 +++++++++++++++++---
 src/frontend/src/components/render/Stock.tsx |  2 +-
 2 files changed, 42 insertions(+), 7 deletions(-)

diff --git a/src/frontend/src/components/render/Part.tsx b/src/frontend/src/components/render/Part.tsx
index 261db11569..78cd5aae42 100644
--- a/src/frontend/src/components/render/Part.tsx
+++ b/src/frontend/src/components/render/Part.tsx
@@ -34,18 +34,53 @@ export function RenderPart(
     badgeColor = instance.minimum_stock > stock ? 'yellow' : 'green';
   }
 
-  const badge = !!badgeText ? (
-    <Badge size='xs' color={badgeColor}>
-      {badgeText}
-    </Badge>
-  ) : null;
+  const extra: ReactNode[] = [];
+
+  // For active parts, we can display some extra information here
+  if (instance.active) {
+    if (instance.ordering) {
+      extra.push(
+        <Text size='xs'>
+          {t`On Order`}: {formatDecimal(instance.ordering)}{' '}
+        </Text>
+      );
+    }
+
+    if (instance.building) {
+      extra.push(
+        <Text size='xs'>
+          {t`In Production`}: {formatDecimal(instance.building)}{' '}
+        </Text>
+      );
+    }
+  }
+
+  const suffix: ReactNode = (
+    <Group gap='xs' wrap='nowrap'>
+      {badgeText && (
+        <Badge size='xs' color={badgeColor}>
+          {badgeText}
+        </Badge>
+      )}
+      {extra && (
+        <TableHoverCard
+          value=''
+          position='bottom-end'
+          zIndex={10000}
+          icon='info'
+          title={t`Details`}
+          extra={extra}
+        />
+      )}
+    </Group>
+  );
 
   return (
     <RenderInlineModel
       {...props}
       primary={instance.full_name ?? instance.name}
       secondary={instance.description}
-      suffix={badge}
+      suffix={suffix}
       image={instance.thumbnail || instance.image}
       url={props.link ? getDetailUrl(ModelType.part, instance.pk) : undefined}
     />
diff --git a/src/frontend/src/components/render/Stock.tsx b/src/frontend/src/components/render/Stock.tsx
index 6ee29e6f17..1e5a13b25e 100644
--- a/src/frontend/src/components/render/Stock.tsx
+++ b/src/frontend/src/components/render/Stock.tsx
@@ -130,7 +130,7 @@ export function RenderStockItem(
           zIndex={10000}
           icon='sitemap'
           title={t`Location`}
-          extra={[<Text>{location.pathstring}</Text>]}
+          extra={[<Text size='xs'>{location.pathstring}</Text>]}
         />
       )}
     </Group>