From 39ece2a329fb6d8888f834281e611a774124e33e Mon Sep 17 00:00:00 2001
From: Jamie Barton <jamie@notrab.dev>
Date: Mon, 26 Aug 2024 14:24:31 +0100
Subject: [PATCH] Refine Entire Platform To Support Uninspected Names in
 NameGuard (#350)

* Add support for Uninspected Names in NameGuard UI

---------

Co-authored-by: lightwalker.eth <126201998+lightwalker-eth@users.noreply.github.com>
---
 .changeset/thin-eels-burn.md                  |  5 +++++
 .../src/components/Report/LabelList.tsx       |  8 +++----
 .../src/components/Report/Report.tsx          | 21 +++++++++++--------
 .../components/Search/SearchEmptyState.tsx    |  1 +
 .../src/components/Tooltip/Tooltip.tsx        |  2 +-
 5 files changed, 23 insertions(+), 14 deletions(-)
 create mode 100644 .changeset/thin-eels-burn.md

diff --git a/.changeset/thin-eels-burn.md b/.changeset/thin-eels-burn.md
new file mode 100644
index 000000000..c020770ef
--- /dev/null
+++ b/.changeset/thin-eels-burn.md
@@ -0,0 +1,5 @@
+---
+"@namehash/nameguard-react": patch
+---
+
+Add support for uninspected NameGuard reports.
diff --git a/packages/nameguard-react/src/components/Report/LabelList.tsx b/packages/nameguard-react/src/components/Report/LabelList.tsx
index 0813234e4..307074102 100644
--- a/packages/nameguard-react/src/components/Report/LabelList.tsx
+++ b/packages/nameguard-react/src/components/Report/LabelList.tsx
@@ -1,16 +1,16 @@
 import React from "react";
-import type { NameGuardReport } from "@namehash/nameguard";
+import type { LabelGuardReport } from "@namehash/nameguard";
 
 import { LabelListItem } from "./LabelListItem";
 
 type LabelListProps = {
-  items?: NameGuardReport["labels"];
+  items: LabelGuardReport[];
 };
 
 export function LabelList({ items = [] }: LabelListProps) {
-  const rawLabels = items.map((i) => i.label) ?? [];
+  const rawLabels = items.map((i) => i.label);
 
-  return items?.map((label, index) => (
+  return items.map((label, index) => (
     <LabelListItem
       key={index}
       index={index}
diff --git a/packages/nameguard-react/src/components/Report/Report.tsx b/packages/nameguard-react/src/components/Report/Report.tsx
index e8d95ef2d..538159f1b 100644
--- a/packages/nameguard-react/src/components/Report/Report.tsx
+++ b/packages/nameguard-react/src/components/Report/Report.tsx
@@ -121,14 +121,12 @@ export const Report = ({
             <ExternalLinks title="View name in" links={externalLinks} />
           </div>
         </div>
-
         {isLoading && !hadLoadingError && normalizationUnknown && (
           <LoadingSkeleton parsedName={parsedName} />
         )}
         {isLoading && !hadLoadingError && !normalizationUnknown && (
           <LoadingSkeleton parsedName={parsedName} />
         )}
-
         {hadLoadingError && <ReportError />}
 
         {data && (
@@ -145,14 +143,19 @@ export const Report = ({
                 ))}
               </div>
             </div>
-            <div className="space-y-4 md:space-y-5">
-              <p className="text-black font-semibold text-lg leading-6">
-                Name inspection
-              </p>
-
-              <LabelList items={data.labels} />
-            </div>
+          </Fragment>
+        )}
+        {data && data.inspected && (
+          <div className="space-y-4 md:space-y-5">
+            <p className="text-black font-semibold text-lg leading-6">
+              Name inspection
+            </p>
 
+            <LabelList items={data.labels} />
+          </div>
+        )}
+        {data && (
+          <Fragment>
             <FeedbackNotice onChatClick={openChatModal} />
             <ReportFooter />
           </Fragment>
diff --git a/packages/nameguard-react/src/components/Search/SearchEmptyState.tsx b/packages/nameguard-react/src/components/Search/SearchEmptyState.tsx
index f211b54fb..64c6cf6a2 100644
--- a/packages/nameguard-react/src/components/Search/SearchEmptyState.tsx
+++ b/packages/nameguard-react/src/components/Search/SearchEmptyState.tsx
@@ -26,6 +26,7 @@ const examples = [
   "unknоwn.eth",
   "john🇺🇸",
   "7️⃣7️⃣7️⃣.eth",
+  "extremelylongnamethatgoesonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandonandon.eth",
 ].map((name) => buildENSName(name));
 
 export const SearchEmptyState = () => {
diff --git a/packages/nameguard-react/src/components/Tooltip/Tooltip.tsx b/packages/nameguard-react/src/components/Tooltip/Tooltip.tsx
index 49dfb8331..dad22eee8 100644
--- a/packages/nameguard-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/nameguard-react/src/components/Tooltip/Tooltip.tsx
@@ -28,7 +28,7 @@ export function Tooltip({
   placement = "top",
 
   /*
-    Props are applied to the Float component, 
+    Props are applied to the Float component,
     which is a wrapper for the tooltip "children".
   */
   ...props