From bab6920ac034e998e01b4ec87a894df648ece999 Mon Sep 17 00:00:00 2001
From: Dirk McCormick <dirkmdev@gmail.com>
Date: Mon, 12 Jun 2023 16:16:36 +0200
Subject: [PATCH 1/3] feat: add info boxes on LID UI page

---
 react/src/Info.css |  4 ++--
 react/src/LID.js   | 49 ++++++++++++++++++++++++++++++++++++++++++----
 2 files changed, 47 insertions(+), 6 deletions(-)

diff --git a/react/src/Info.css b/react/src/Info.css
index 999b5b085..7d6cf528b 100644
--- a/react/src/Info.css
+++ b/react/src/Info.css
@@ -7,8 +7,8 @@
     display: inline-block;
     cursor: pointer;
     font-size: 1em;
-    width: 1em;
-    height: 1em;
+    width: 16px;
+    height: 16px;
     vertical-align: top;
     margin-left: 0.5em;
     background: url("./bootstrap-icons/icons/info-circle.svg");
diff --git a/react/src/LID.js b/react/src/LID.js
index 3d4b23b8e..bb58f7f3b 100644
--- a/react/src/LID.js
+++ b/react/src/LID.js
@@ -115,7 +115,7 @@ function LIDContent() {
             <tr>
                 <td width="50%">
                   <div>
-                      <h3>Pieces</h3>
+                      <h3>Pieces<PiecesInfo/></h3>
 
                       <div className="storage-chart">
                           <CumulativeBarChart bars={piecesBars} />
@@ -123,7 +123,14 @@ function LIDContent() {
                       </div>
 
                       <div className="flagged-pieces-link">
-                          <h3>Flagged Pieces</h3>
+                          <h3>
+                              Flagged Pieces
+                              <Info>
+                                  Flagged Pieces are pieces that have been flagged by the Piece Doctor because it was
+                                  not possible to index the piece data. This could be because there was no unsealed copy
+                                  of the piece data, or because the piece data was inaccessible or corrupted.
+                              </Info>
+                          </h3>
                           <p>
                               <b>{addCommas(d.FlaggedPieces)}</b> Flagged Pieces
                               <Link to={"/piece-doctor"} className="button">View Flagged Pieces</Link>
@@ -131,7 +138,13 @@ function LIDContent() {
                       </div>
 
                       <div>
-                          <h3>Deal Sectors Copies</h3>
+                          <h3>
+                              Deal Sectors Copies
+                              <Info>
+                                  Deal Sectors Copies indicates how many sectors contain deals, and how many of those
+                                  sectors have an unsealed copy.
+                              </Info>
+                          </h3>
 
                           <div className="storage-chart">
                               <CumulativeBarChart bars={barsSuc} />
@@ -140,7 +153,12 @@ function LIDContent() {
                       </div>
 
                       <div>
-                          <h3>Sectors Proving State</h3>
+                          <h3>
+                              Sectors Proving State
+                              <Info>
+                                Sectors Proving State indicates how many sectors are in an Active state on chain
+                              </Info>
+                          </h3>
 
                           <div className="storage-chart">
                               <CumulativeBarChart bars={barsSps} />
@@ -155,6 +173,29 @@ function LIDContent() {
     </div>
 }
 
+function PiecesInfo() {
+    return <Info>
+        The pieces stored by the Local Index Directory are in one of these states:
+        <p>
+            <b>Indexed</b><br/>
+            The piece was successfully indexed
+        </p>
+        <p>
+            <b>Flagged (unsealed)</b><br/>
+            Flagged by the Piece Doctor because there was some problem
+            creating an index. This could be because it was not possible
+            to read the data from the sealing subsystem, the data is
+            corrupt, etc.
+        </p>
+        <p>
+            <b>Flagged (sealed only)</b><br/>
+            Flagged by the Piece Doctor because there is no unsealed copy
+            of the piece data. This usually means the unsealed copy of the
+            sector containing the piece was deleted.
+        </p>
+    </Info>
+}
+
 function BlockStatsSection() {
     return <div>
         <h3>Block Stats</h3>

From ed800e1a2c2169cff03b44fd0bd943757ca5ecf3 Mon Sep 17 00:00:00 2001
From: dirkmc <dirkmdev@gmail.com>
Date: Mon, 12 Jun 2023 16:28:56 +0200
Subject: [PATCH 2/3] Update react/src/LID.js

Co-authored-by: Anton Evangelatov <anton.evangelatov@gmail.com>
---
 react/src/LID.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react/src/LID.js b/react/src/LID.js
index bb58f7f3b..f741ccdcd 100644
--- a/react/src/LID.js
+++ b/react/src/LID.js
@@ -178,7 +178,7 @@ function PiecesInfo() {
         The pieces stored by the Local Index Directory are in one of these states:
         <p>
             <b>Indexed</b><br/>
-            The piece was successfully indexed
+            The piece was successfully indexed and all CIDs within it are retrievable
         </p>
         <p>
             <b>Flagged (unsealed)</b><br/>

From 2065bb64d23d2c6222b9868f20822471a8fef352 Mon Sep 17 00:00:00 2001
From: dirkmc <dirkmdev@gmail.com>
Date: Mon, 12 Jun 2023 16:29:05 +0200
Subject: [PATCH 3/3] Update react/src/LID.js

Co-authored-by: Anton Evangelatov <anton.evangelatov@gmail.com>
---
 react/src/LID.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react/src/LID.js b/react/src/LID.js
index f741ccdcd..70f686321 100644
--- a/react/src/LID.js
+++ b/react/src/LID.js
@@ -156,7 +156,7 @@ function LIDContent() {
                           <h3>
                               Sectors Proving State
                               <Info>
-                                Sectors Proving State indicates how many sectors are in an Active state on chain
+                                Sectors Proving State indicates how many sectors this SP is actively proving on chain
                               </Info>
                           </h3>