mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
fix StateLabel flickering
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
import React, { useState, useEffect } from "react";
|
import React from "react";
|
||||||
import { useAccountComment } from "@plebbit/plebbit-react-hooks";
|
import { useAccountComment } from "@plebbit/plebbit-react-hooks";
|
||||||
import useStateString from "../hooks/useStateString";
|
import useStateString from "../hooks/useStateString";
|
||||||
|
|
||||||
@@ -6,31 +6,27 @@ const StateLabel = ({ commentIndex, className }) => {
|
|||||||
const comment = useAccountComment({commentIndex: commentIndex});
|
const comment = useAccountComment({commentIndex: commentIndex});
|
||||||
const stateString = useStateString(comment);
|
const stateString = useStateString(comment);
|
||||||
|
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
if (comment.updatedAt !== undefined) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
if (comment.state === "failed") {
|
||||||
const timer = setTimeout(() => setIsLoading(false), 2000);
|
return null;
|
||||||
return () => clearTimeout(timer);
|
}
|
||||||
}, [commentIndex]);
|
|
||||||
|
if (!stateString) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
commentIndex !== undefined && stateString !== "Succeeded" ? (
|
<span className="ttl">
|
||||||
(comment.state === "failed") ? (
|
<br />
|
||||||
null
|
(
|
||||||
) : (
|
<span className={className}>
|
||||||
stateString === undefined && !isLoading && comment.cid === undefined ? (
|
{stateString}
|
||||||
null
|
|
||||||
) : (
|
|
||||||
<span className="ttl">
|
|
||||||
<br />
|
|
||||||
(
|
|
||||||
<span className={className}>
|
|
||||||
{stateString}
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
</span>
|
</span>
|
||||||
))
|
)
|
||||||
) : null
|
</span>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user