From 8dbcb8bbb6e38ee49e9570b92400720d82235e45 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miro=20Sp=C3=B6nemann?= <miro.spoenemann@typefox.io>
Date: Tue, 14 Jan 2020 15:35:44 +0100
Subject: [PATCH] Fallback rendering in case a BoardPackage with no name or
 author is found (arduino/arduino-pro-ide#21)

---
 .../component-list/list-item-renderer.tsx        | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/arduino-ide-extension/src/browser/components/component-list/list-item-renderer.tsx b/arduino-ide-extension/src/browser/components/component-list/list-item-renderer.tsx
index 478caaab..124b9474 100644
--- a/arduino-ide-extension/src/browser/components/component-list/list-item-renderer.tsx
+++ b/arduino-ide-extension/src/browser/components/component-list/list-item-renderer.tsx
@@ -27,8 +27,18 @@ export class ListItemRenderer<T extends ArduinoComponent> {
     ): React.ReactNode {
 
         const { item } = input;
-        const name = <span className='name'>{item.name}</span>;
-        const author = <span className='author'>{item.author}</span>;
+        let nameAndAuthor: JSX.Element;
+        if (item.name && item.author) {
+            const name = <span className='name'>{item.name}</span>;
+            const author = <span className='author'>{item.author}</span>;
+            nameAndAuthor = <span>{name} by {author}</span>
+        } else if (item.name) {
+            nameAndAuthor = <span className='name'>{item.name}</span>;
+        } else if ((item as any).id) {
+            nameAndAuthor = <span className='name'>{(item as any).id}</span>;
+        } else {
+            nameAndAuthor = <span className='name'>Unknown</span>;
+        }
         const onClickUninstall = () => uninstall(item);
         const installedVersion = !!item.installedVersion && <div className='version-info'>
             <span className='version'>Version {item.installedVersion}</span>
@@ -71,7 +81,7 @@ export class ListItemRenderer<T extends ArduinoComponent> {
 
         return <div className='component-list-item noselect'>
             <div className='header'>
-                <span>{name} by {author}</span>
+                {nameAndAuthor}
                 {installedVersion}
             </div>
             <div className='content'>