Fix format
This commit is contained in:
committed by
Michael Vines
parent
05d2bf21d2
commit
612ef1bc10
@ -9,11 +9,23 @@ type CopyableProps = {
|
|||||||
|
|
||||||
type State = "hide" | "copy" | "copied";
|
type State = "hide" | "copy" | "copied";
|
||||||
|
|
||||||
function Popover({ state, bottom, right }: { state: State; bottom?: boolean, right?: boolean }) {
|
function Popover({
|
||||||
|
state,
|
||||||
|
bottom,
|
||||||
|
right
|
||||||
|
}: {
|
||||||
|
state: State;
|
||||||
|
bottom?: boolean;
|
||||||
|
right?: boolean;
|
||||||
|
}) {
|
||||||
if (state === "hide") return null;
|
if (state === "hide") return null;
|
||||||
const text = state === "copy" ? "Copy" : "Copied!";
|
const text = state === "copy" ? "Copy" : "Copied!";
|
||||||
return (
|
return (
|
||||||
<div className={`popover bs-popover-${bottom ? "bottom" : "top"}${right ? " right" : ""} show`}>
|
<div
|
||||||
|
className={`popover bs-popover-${bottom ? "bottom" : "top"}${
|
||||||
|
right ? " right" : ""
|
||||||
|
} show`}
|
||||||
|
>
|
||||||
<div className={`arrow${right ? " right" : ""}`} />
|
<div className={`arrow${right ? " right" : ""}`} />
|
||||||
<div className="popover-body">{text}</div>
|
<div className="popover-body">{text}</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -9,10 +9,24 @@ type Props = {
|
|||||||
|
|
||||||
type State = "hide" | "show";
|
type State = "hide" | "show";
|
||||||
|
|
||||||
function Popover({ state, bottom, right, text }: { state: State; bottom?: boolean, right?: boolean, text: string }) {
|
function Popover({
|
||||||
|
state,
|
||||||
|
bottom,
|
||||||
|
right,
|
||||||
|
text
|
||||||
|
}: {
|
||||||
|
state: State;
|
||||||
|
bottom?: boolean;
|
||||||
|
right?: boolean;
|
||||||
|
text: string;
|
||||||
|
}) {
|
||||||
if (state === "hide") return null;
|
if (state === "hide") return null;
|
||||||
return (
|
return (
|
||||||
<div className={`popover bs-popover-${bottom ? "bottom" : "top"}${right ? " right" : ""} show`}>
|
<div
|
||||||
|
className={`popover bs-popover-${bottom ? "bottom" : "top"}${
|
||||||
|
right ? " right" : ""
|
||||||
|
} show`}
|
||||||
|
>
|
||||||
<div className={`arrow${right ? " right" : ""}`} />
|
<div className={`arrow${right ? " right" : ""}`} />
|
||||||
<div className="popover-body">{text}</div>
|
<div className="popover-body">{text}</div>
|
||||||
</div>
|
</div>
|
||||||
@ -24,7 +38,7 @@ function InfoTooltip({ bottom, right, text, children }: Props) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="popover-container w-100"
|
className="popover-container w-100"
|
||||||
onMouseOver={() => setState("show")}
|
onMouseOver={() => setState("show")}
|
||||||
onMouseOut={() => setState("hide")}
|
onMouseOut={() => setState("hide")}
|
||||||
>
|
>
|
||||||
|
@ -150,8 +150,14 @@ function StatusCard({ signature }: Props) {
|
|||||||
<tr>
|
<tr>
|
||||||
<td>Timestamp</td>
|
<td>Timestamp</td>
|
||||||
<td className="text-right">
|
<td className="text-right">
|
||||||
{info.timestamp !== "unavailable" ? displayTimestamp(info.timestamp) : (
|
{info.timestamp !== "unavailable" ? (
|
||||||
<InfoTooltip bottom right text="Timestamps older than 5 epochs are not available at this time">
|
displayTimestamp(info.timestamp)
|
||||||
|
) : (
|
||||||
|
<InfoTooltip
|
||||||
|
bottom
|
||||||
|
right
|
||||||
|
text="Timestamps older than 5 epochs are not available at this time"
|
||||||
|
>
|
||||||
Unavailable
|
Unavailable
|
||||||
</InfoTooltip>
|
</InfoTooltip>
|
||||||
)}
|
)}
|
||||||
|
Reference in New Issue
Block a user