From 74ea304c4066e50805bef10666f712162f2b765f Mon Sep 17 00:00:00 2001
From: "plebeius.eth" <mottoes_recap0u@icloud.com>
Date: Sun, 10 Sep 2023 12:57:26 +0200
Subject: [PATCH] reduce jank from useAuthorAddress with placeholder

---
 src/components/views/All.jsx           | 12 ++++++------
 src/components/views/Board.jsx         | 12 ++++++------
 src/components/views/Subscriptions.jsx | 12 ++++++------
 src/components/views/Thread.jsx        |  8 ++++----
 4 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/src/components/views/All.jsx b/src/components/views/All.jsx
index 5516b905..41acf41b 100755
--- a/src/components/views/All.jsx
+++ b/src/components/views/All.jsx
@@ -846,9 +846,9 @@ const All = () => {
                             (u/
                             <span key={`pa-${index}`} className="poster-address address-desktop"
                             id="reply-button" style={{cursor: "pointer"}}
-                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                             >
-                              {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                              {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                             </span>)
                             &nbsp;
                             <span key={`dt-${index}`}
@@ -1163,7 +1163,7 @@ const All = () => {
                                 &nbsp;
                                 <span key={`pa-${index}`} className="poster-address address-desktop"
                                   id="reply-button" style={{cursor: "pointer"}}
-                                  onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                  onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                 >
                                   (u/
                                     {reply.author?.shortAddress ?
@@ -1747,11 +1747,11 @@ const All = () => {
                             &nbsp;
                             <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                               id="reply-button" style={{cursor: "pointer"}}
-                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                             >
                               (u/
                               <span key={`mob-ha-${index}`} className="highlight-address-mobile">
-                                {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                                {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                               </span>
                               )&nbsp;
                             </span>
@@ -1990,7 +1990,7 @@ const All = () => {
                               &nbsp;
                               <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                                 id="reply-button" style={{cursor: "pointer"}}
-                                onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                               >
                                 (u/
                                   {reply.author?.shortAddress ?
diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx
index efda4a33..0a5fc60b 100755
--- a/src/components/views/Board.jsx
+++ b/src/components/views/Board.jsx
@@ -1539,9 +1539,9 @@ const Board = () => {
                                   (u/
                                   <span key={`pa-${index}`} className="poster-address address-desktop"
                                   id="reply-button" style={{cursor: "pointer"}}
-                                    onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                    onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                   >
-                                    <VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>
+                                    <VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>
                                   </span>)
                                   &nbsp;
                                   <span key={`dt-${index}`} className="date-time"
@@ -1870,7 +1870,7 @@ const Board = () => {
                                         &nbsp;
                                         <span key={`pa-${index}`} className="poster-address address-desktop"
                                           id="reply-button" style={{cursor: "pointer"}}
-                                          onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                          onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                         >
                                           (u/
                                             {reply.author?.shortAddress ?
@@ -2457,11 +2457,11 @@ const Board = () => {
                                   &nbsp;
                                   <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                                     id="reply-button" style={{cursor: "pointer"}}
-                                    onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                    onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                   >
                                     (u/
                                     <span key={`mob-ha-${index}`} className="highlight-address-mobile">
-                                      {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                                      {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                                     </span>
                                     )&nbsp;
                                   </span>
@@ -2695,7 +2695,7 @@ const Board = () => {
                                     &nbsp;
                                     <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                                       id="reply-button" style={{cursor: "pointer"}}
-                                      onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                      onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                     >
                                       (u/
                                         {reply.author?.shortAddress ?
diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx
index 5230af95..4b4c1e53 100755
--- a/src/components/views/Subscriptions.jsx
+++ b/src/components/views/Subscriptions.jsx
@@ -857,9 +857,9 @@ const Subscriptions = () => {
                             (u/
                             <span key={`pa-${index}`} className="poster-address address-desktop"
                             id="reply-button" style={{cursor: "pointer"}}
-                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                             >
-                              {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                              {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                             </span>)
                             &nbsp;
                             <span key={`dt-${index}`} className="date-time"
@@ -1174,7 +1174,7 @@ const Subscriptions = () => {
                                 &nbsp;
                                 <span key={`pa-${index}`} className="poster-address address-desktop"
                                   id="reply-button" style={{cursor: "pointer"}}
-                                  onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                  onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                                 >
                                   (u/
                                     {reply.author?.shortAddress ?
@@ -1758,11 +1758,11 @@ const Subscriptions = () => {
                             &nbsp;
                             <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                               id="reply-button" style={{cursor: "pointer"}}
-                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                              onClick={() => handleAddressClick(<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                             >
                               (u/
                               <span key={`mob-ha-${index}`} className="highlight-address-mobile">
-                                {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                                {<VerifiedAuthor commentCid={thread.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                               </span>
                               )&nbsp;
                             </span>
@@ -2001,7 +2001,7 @@ const Subscriptions = () => {
                               &nbsp;
                               <span key={`mob-pa-${index}`} className="poster-address-mobile address-mobile"
                                 id="reply-button" style={{cursor: "pointer"}}
-                                onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                                onClick={() => handleAddressClick(<VerifiedAuthor commentCid={reply.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                               >
                                 (u/
                                   {reply.author?.shortAddress ?
diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx
index c5d2766e..d0d66e1e 100755
--- a/src/components/views/Thread.jsx
+++ b/src/components/views/Thread.jsx
@@ -993,10 +993,10 @@ const Thread = () => {
                         &nbsp;
                         <span className="poster-address address-desktop"
                           id="reply-button" style={{cursor: "pointer"}}
-                          onClick={() => handleAddressClick(<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}>
+                          onClick={() => handleAddressClick(<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}>
                           (u/
                             <span key={`pa-${comment.cid}`} className="poster-address">
-                            {<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                            {<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                           </span>)
                         </span>
                         &nbsp;
@@ -1755,11 +1755,11 @@ const Thread = () => {
                           &nbsp;
                           <span key={`mob-pa-${comment.cid}`} className="poster-address-mobile address-mobile"
                             id="reply-button" style={{cursor: "pointer"}}
-                            onClick={() => handleAddressClick(<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>)}
+                            onClick={() => handleAddressClick(<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>)}
                           >
                             (u/
                             <span key={`mob-ha-${comment.cid}`} className="highlight-address-mobile">
-                              {<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress)}</VerifiedAuthor>}
+                              {<VerifiedAuthor commentCid={comment.cid}>{({ shortAuthorAddress }) => (shortAuthorAddress || "aBcDeFgHiLmN")}</VerifiedAuthor>}
                             </span>
                             )&nbsp;
                           </span>