From e524ba4a67bf48dbacfe19885de569a96ecb4537 Mon Sep 17 00:00:00 2001
From: "plebeius.eth" <mottoes_recap0u@icloud.com>
Date: Fri, 18 Aug 2023 20:46:32 +0200
Subject: [PATCH] fix StateLabel flickering

---
 src/components/StateLabel.jsx | 40 ++++++++++++++++-------------------
 1 file changed, 18 insertions(+), 22 deletions(-)

diff --git a/src/components/StateLabel.jsx b/src/components/StateLabel.jsx
index 46c5924b..57e436f7 100644
--- a/src/components/StateLabel.jsx
+++ b/src/components/StateLabel.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
 import { useAccountComment } from "@plebbit/plebbit-react-hooks";
 import useStateString from "../hooks/useStateString";
 
@@ -6,31 +6,27 @@ const StateLabel = ({ commentIndex, className }) => {
   const comment = useAccountComment({commentIndex: commentIndex});
   const stateString = useStateString(comment);
 
-  const [isLoading, setIsLoading] = useState(true);
+  if (comment.updatedAt !== undefined) {
+    return null;
+  }
 
-  useEffect(() => {
-    const timer = setTimeout(() => setIsLoading(false), 2000);
-    return () => clearTimeout(timer);
-  }, [commentIndex]);
+  if (comment.state === "failed") {
+    return null;
+  }
+
+  if (!stateString) {
+    return null;
+  }
 
   return (
-    commentIndex !== undefined && stateString !== "Succeeded" ? (
-      (comment.state === "failed") ? (
-        null
-      ) : (
-        stateString === undefined && !isLoading && comment.cid === undefined ? (
-          null
-        ) : (
-        <span className="ttl">
-          <br />
-          (
-            <span className={className}>
-              {stateString}
-            </span>
-          )
+    <span className="ttl">
+      <br />
+      (
+        <span className={className}>
+          {stateString}
         </span>
-      ))
-    ) : null
+      )
+    </span>
   );
 };