From edd068034419585e098e0401aa975f9c1279273a Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Fri, 21 Jun 2024 09:09:09 +1000
Subject: [PATCH] Handle case where data is undefined (#7486)

---
 src/frontend/src/components/details/Details.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/frontend/src/components/details/Details.tsx b/src/frontend/src/components/details/Details.tsx
index 374f35b556..2819e3245c 100644
--- a/src/frontend/src/components/details/Details.tsx
+++ b/src/frontend/src/components/details/Details.tsx
@@ -135,11 +135,11 @@ function NameBadge({ pk, type }: { pk: string | number; type: BadgeType }) {
             case 200:
               return response.data;
             default:
-              return null;
+              return undefined;
           }
         })
         .catch(() => {
-          return null;
+          return undefined;
         });
     }
   });
@@ -148,7 +148,9 @@ function NameBadge({ pk, type }: { pk: string | number; type: BadgeType }) {
 
   // Rendering a user's rame for the badge
   function _render_name() {
-    if (type === 'user' && settings.isSet('DISPLAY_FULL_NAMES')) {
+    if (!data) {
+      return '';
+    } else if (type === 'user' && settings.isSet('DISPLAY_FULL_NAMES')) {
       if (data.first_name || data.last_name) {
         return `${data.first_name} ${data.last_name}`;
       } else {
@@ -169,7 +171,7 @@ function NameBadge({ pk, type }: { pk: string | number; type: BadgeType }) {
           variant="filled"
           style={{ display: 'flex', alignItems: 'center' }}
         >
-          {data.name ?? _render_name()}
+          {data?.name ?? _render_name()}
         </Badge>
         <InvenTreeIcon icon={type === 'user' ? type : data.label} />
       </div>