aljaz/mutiny-web
1
0
Fork 0
mirror of https://github.com/aljazceru/mutiny-web.git synced 2026-01-25 09:04:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

mutiny+

Browse Source
This commit is contained in:
Paul Miller
2023-07-08 17:34:08 -05:00
parent 3b6975a0d9
commit c33e542932
12 changed files with 433 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/Activity.tsx
View File

@@ -1,10 +1,19 @@
import { NiceP } from "./layout";
import { For, Match, Show, Switch, createEffect, createSignal } from "solid-js";
import {
For,
Match,
Show,
Suspense,
Switch,
createEffect,
createSignal
} from "solid-js";
import { useMegaStore } from "~/state/megaStore";
import { useI18n } from "~/i18n/context";
import { Contact } from "@mutinywallet/mutiny-wasm";
import { ActivityItem, HackActivityType } from "./ActivityItem";
import { DetailsIdModal } from "./DetailsModal";
import { LoadingShimmer } from "./BalanceBox";
export const THREE_COLUMNS =
"grid grid-cols-[auto,1fr,auto] gap-4 py-2 px-2 border-b border-neutral-800 last:border-b-0";
@@ -105,7 +114,7 @@ export function CombinedActivity(props: { limit?: number }) {
});
return (
<>
<Suspense fallback={<LoadingShimmer />}>
<Show when={detailsId() && detailsKind()}>
<DetailsIdModal
open={detailsOpen()}
@@ -117,7 +126,9 @@ export function CombinedActivity(props: { limit?: number }) {
<Switch>
<Match when={state.activity.length === 0}>
<div class="w-full text-center pb-4">
<NiceP>{i18n.t("receive_some_sats_to_get_started")}</NiceP>
<NiceP>
{i18n.t("receive_some_sats_to_get_started")}
</NiceP>
</div>
</Match>
<Match
@@ -143,6 +154,6 @@ export function CombinedActivity(props: { limit?: number }) {
</For>
</Match>
</Switch>
</>
</Suspense>
);
}

27
src/components/App.tsx
View File

@@ -6,11 +6,12 @@ import { A } from "solid-start";
import { OnboardWarning } from "~/components/OnboardWarning";
import { CombinedActivity } from "./Activity";
import { useMegaStore } from "~/state/megaStore";
import { Show } from "solid-js";
import { Match, Show, Switch, createMemo } from "solid-js";
import { ExternalLink } from "./layout/ExternalLink";
import { BetaWarningModal } from "~/components/BetaWarningModal";
import settings from "~/assets/icons/settings.svg";
import pixelLogo from "~/assets/mutiny-pixel-logo.png";
import plusLogo from "~/assets/mutiny-plus-logo.png";
import { PendingNwc } from "./PendingNwc";
import { useI18n } from "~/i18n/context";
@@ -23,12 +24,24 @@ export default function App() {
<DefaultMain>
<header class="w-full flex justify-between items-center mt-4 mb-2">
<div class="flex items-center gap-2">
<img
id="mutiny-logo"
src={pixelLogo}
class="h-[25px] w-[75px]"
alt="Mutiny logo"
/>
<Switch>
<Match when={state.mutiny_plus}>
<img
id="mutiny-logo"
src={plusLogo}
class="h-[25px] w-[86px]"
alt="Mutiny Plus logo"
/>
</Match>
<Match when={true}>
<img
id="mutiny-logo"
src={pixelLogo}
class="h-[25px] w-[75px]"
alt="Mutiny logo"
/>
</Match>
</Switch>
<Show
when={
!state.wallet_loading &&

11
src/components/ImportExport.tsx
View File

@@ -89,12 +89,11 @@ export function ImportExport(props: { emergency?: boolean }) {
import it into a new browser. It usually works!
</NiceP>
<NiceP>
<strong class="font-semibold">Important caveats:</strong>{" "}
after exporting don't do any operations in the original
browser. If you do, you'll need to export again. After a
successful import, a best practice is to clear the state of
the original browser just to make sure you don't create
conflicts.
<strong>Important caveats:</strong> after exporting don't do
any operations in the original browser. If you do, you'll
need to export again. After a successful import, a best
practice is to clear the state of the original browser just
to make sure you don't create conflicts.
</NiceP>
<div />
<VStack>

166
src/components/PendingNwc.tsx
View File

@@ -6,7 +6,6 @@ import {
For,
Match,
Show,
Suspense,
Switch,
createEffect,
createResource,
@@ -53,9 +52,6 @@ export function PendingNwc() {
});
}
}
console.log(pendingItems);
return pendingItems;
});
@@ -98,90 +94,84 @@ export function PendingNwc() {
});
return (
<Suspense>
<Show when={pendingRequests() && pendingRequests()!.length > 0}>
<Card title="Pending Requests">
<div class="p-1" />
<VStack>
<Show when={error()}>
<InfoBox accent="red">{error()?.message}</InfoBox>
</Show>
<For each={pendingRequests()}>
{(pendingItem) => (
<div class="grid grid-cols-[auto_minmax(0,_1fr)_minmax(0,_max-content)_auto] items-center pb-4 gap-4 border-b border-neutral-800 last:border-b-0">
<img
class="w-[1rem]"
src={bolt}
alt="onchain"
/>
<div class="flex flex-col">
<span class="text-base font-semibold truncate">
{pendingItem.name_of_connection}
</span>
<time class="text-sm text-neutral-500">
Expires {timeAgo(pendingItem.date)}
</time>
</div>
<div>
<ActivityAmount
amount={
pendingItem.amount_sats?.toString() ||
"0"
}
price={state.price}
/>
</div>
<div class="flex gap-2 w-[5rem]">
<Switch>
<Match
when={
paying() !== pendingItem.id
}
>
<button
onClick={() =>
payItem(pendingItem)
}
>
<img
class="h-[2.5rem] w-[2.5rem]"
src={greenCheck}
alt="Approve"
/>
</button>
<button
onClick={() =>
rejectItem(pendingItem)
}
>
<img
class="h-[2rem] w-[2rem]"
src={redClose}
alt="Reject"
/>
</button>
</Match>
<Match
when={
paying() === pendingItem.id
}
>
<LoadingSpinner wide />
</Match>
</Switch>
</div>
<Show when={pendingRequests() && pendingRequests()!.length > 0}>
<Card title="Pending Requests">
<div class="p-1" />
<VStack>
<Show when={error()}>
<InfoBox accent="red">{error()?.message}</InfoBox>
</Show>
<For each={pendingRequests()}>
{(pendingItem) => (
<div class="grid grid-cols-[auto_minmax(0,_1fr)_minmax(0,_max-content)_auto] items-center pb-4 gap-4 border-b border-neutral-800 last:border-b-0">
<img
class="w-[1rem]"
src={bolt}
alt="onchain"
/>
<div class="flex flex-col">
<span class="text-base font-semibold truncate">
{pendingItem.name_of_connection}
</span>
<time class="text-sm text-neutral-500">
Expires {timeAgo(pendingItem.date)}
</time>
</div>
)}
</For>
</VStack>
<A
href="/settings/connections"
class="text-m-red active:text-m-red/80 font-semibold no-underline self-center"
>
Configure
</A>
</Card>
</Show>
</Suspense>
<div>
<ActivityAmount
amount={
pendingItem.amount_sats?.toString() ||
"0"
}
price={state.price}
/>
</div>
<div class="flex gap-2 w-[5rem]">
<Switch>
<Match
when={paying() !== pendingItem.id}
>
<button
onClick={() =>
payItem(pendingItem)
}
>
<img
class="h-[2.5rem] w-[2.5rem]"
src={greenCheck}
alt="Approve"
/>
</button>
<button
onClick={() =>
rejectItem(pendingItem)
}
>
<img
class="h-[2rem] w-[2rem]"
src={redClose}
alt="Reject"
/>
</button>
</Match>
<Match
when={paying() === pendingItem.id}
>
<LoadingSpinner wide />
</Match>
</Switch>
</div>
</div>
)}
</For>
</VStack>
<A
href="/settings/connections"
class="text-m-red active:text-m-red/80 font-semibold no-underline self-center"
>
Configure
</A>
</Card>
</Show>
);
}