Add federation balance to home screen

This commit is contained in:
Tony Giorgio
2023-11-30 22:28:57 -06:00
committed by Tony Giorgio
parent 0144da4320
commit fe3acb5974
3 changed files with 44 additions and 1 deletions

View File

@@ -2,6 +2,7 @@ import { Show } from "solid-js";
import bolt from "~/assets/icons/bolt.svg";
import chain from "~/assets/icons/chain.svg";
import community from "~/assets/icons/community.svg";
import { useI18n } from "~/i18n/context";
import { useMegaStore } from "~/state/megaStore";
import { satsToFormattedFiat } from "~/utils";
@@ -15,7 +16,7 @@ function prettyPrintAmount(n?: number | bigint): string {
export function AmountSats(props: {
amountSats: bigint | number | undefined;
icon?: "lightning" | "chain" | "plus" | "minus";
icon?: "lightning" | "community" | "chain" | "plus" | "minus";
denominationSize?: "sm" | "lg" | "xl";
}) {
const i18n = useI18n();
@@ -24,6 +25,9 @@ export function AmountSats(props: {
<Show when={props.icon === "lightning"}>
<img src={bolt} alt="lightning" class="h-[18px]" />
</Show>
<Show when={props.icon === "community"}>
<img src={community} alt="community" class="h-[18px]" />
</Show>
<Show when={props.icon === "chain"}>
<img src={chain} alt="chain" class="h-[18px]" />
</Show>

View File

@@ -42,6 +42,7 @@ export function BalanceBox(props: { loading?: boolean }) {
const emptyBalance = () =>
(state.balance?.confirmed || 0n) === 0n &&
(state.balance?.lightning || 0n) === 0n &&
(state.balance?.federation || 0n) === 0n &&
(state.balance?.force_close || 0n) === 0n &&
(state.balance?.unconfirmed || 0n) === 0n;
@@ -91,6 +92,40 @@ export function BalanceBox(props: { loading?: boolean }) {
</Switch>
</Show>
<hr class="my-2 border-m-grey-750" />
<Show when={!props.loading} fallback={<LoadingShimmer />}>
<Switch>
<Match when={state.safe_mode}>
<div class="flex flex-col gap-1">
<InfoBox accent="red">
{i18n.t("common.error_safe_mode")}
</InfoBox>
</div>
</Match>
<Match when={true}>
<div class="flex flex-col gap-1">
<div class="text-2xl">
<AmountSats
amountSats={
state.balance?.federation || 0
}
icon="community"
denominationSize="lg"
/>
</div>
<div class="text-lg text-white/70">
<AmountFiat
amountSats={
state.balance?.lightning + state.balance?.federation || 0
}
denominationSize="sm"
/>
</div>
</div>
</Match>
</Switch>
</Show>
<hr class="my-2 border-m-grey-750" />
<Show when={!props.loading} fallback={<LoadingShimmer />}>
<div class="flex justify-between">