sync activity separately from regular sync

This commit is contained in:
Paul Miller
2023-06-05 17:50:46 -05:00
committed by Tony Giorgio
parent 9186da7fc6
commit 2d99da5245
7 changed files with 186 additions and 141 deletions

View File

@@ -1,5 +1,5 @@
import { LoadingSpinner, NiceP } from "./layout"
import { For, Match, Show, Switch, createSignal } from "solid-js";
import { NiceP } from "./layout";
import { For, Match, Show, Switch, createEffect, createSignal } from "solid-js";
import { useMegaStore } from "~/state/megaStore";
import { ActivityItem as MutinyActivity } from "@mutinywallet/mutiny-wasm";
import { ActivityItem, HackActivityType } from "./ActivityItem";
@@ -61,7 +61,7 @@ function UnifiedActivityItem(props: {
}
export function CombinedActivity(props: { limit?: number }) {
const [state, _actions] = useMegaStore();
const [state, actions] = useMegaStore();
const [detailsOpen, setDetailsOpen] = createSignal(false);
const [detailsKind, setDetailsKind] = createSignal<HackActivityType>();
@@ -75,6 +75,12 @@ export function CombinedActivity(props: { limit?: number }) {
setDetailsOpen(true);
}
createEffect(() => {
if (!state.wallet_loading && !state.is_syncing) {
actions.syncActivity();
}
});
return (
<>
<Show when={detailsId() && detailsKind()}>
@@ -86,13 +92,8 @@ export function CombinedActivity(props: { limit?: number }) {
/>
</Show>
<Switch>
<Match when={state.wallet_loading || !state.activity_has_loaded}>
<div class="p-4">
<LoadingSpinner wide />
</div>
</Match>
<Match when={state.activity.length === 0}>
<div class="w-full text-center">
<div class="w-full text-center pb-4">
<NiceP>Receive some sats to get started</NiceP>
</div>
</Match>

View File

@@ -36,12 +36,14 @@ export default function App() {
</Show>
{/* <ButtonLink href="/activity">View All</ButtonLink> */}
</VStack>
<A
href="/activity"
class="text-m-red active:text-m-red/80 text-xl font-semibold no-underline self-center"
>
View All
</A>
<Show when={state.activity && state.activity.length > 0}>
<A
href="/activity"
class="text-m-red active:text-m-red/80 text-xl font-semibold no-underline self-center"
>
View All
</A>
</Show>
</Card>
<p class="self-center text-neutral-500 mt-4">
Bugs? Feedback?{" "}

View File

@@ -45,23 +45,23 @@ export const Button: ParentComponent<ButtonProps> = props => {
const [local, attrs] = splitProps(props, ['children', 'intent', 'layout', 'class'])
return (
<button
{...attrs}
disabled={props.disabled || props.loading}
class={button({
class: local.class || "",
intent: local.intent,
layout: local.layout,
})}
>
<Show when={props.loading} fallback={slot()} >
<div class="flex justify-center">
{/* TODO: constrain this to the exact height of the button */}
<LoadingSpinner />
</div>
</Show>
</button >
)
<button
{...attrs}
disabled={props.disabled || props.loading}
class={button({
class: local.class || "",
intent: local.intent,
layout: local.layout
})}
>
<Show when={props.loading} fallback={slot()}>
<div class="flex justify-center">
{/* TODO: constrain this to the exact height of the button */}
<LoadingSpinner wide />
</div>
</Show>
</button>
);
}
interface ButtonLinkProps extends JSX.ButtonHTMLAttributes<HTMLAnchorElement>, StyleProps {

View File

@@ -78,21 +78,19 @@ export const DefaultMain: ParentComponent = (props) => {
export const FullscreenLoader = () => {
return (
<div class="w-full h-[100dvh] flex justify-center items-center">
<LoadingSpinner />
</div>
<div class="w-full h-[100dvh] flex justify-center items-center">
<LoadingSpinner wide />
</div>
);
}
export const MutinyWalletGuard: ParentComponent = (props) => {
const [state, _] = useMegaStore();
return (
<Suspense fallback={<FullscreenLoader />}>
<Show when={state.mutiny_wallet}>
{props.children}
</Show>
</Suspense>
)
<Suspense fallback={<FullscreenLoader />}>
<Show when={state.mutiny_wallet && !state.wallet_loading}>{props.children}</Show>
</Suspense>
);
}
export const LoadingSpinner = (props: { big?: boolean, wide?: boolean }) => {

View File

@@ -35,20 +35,25 @@ export function WaitlistAlreadyIn() {
const [posts] = createResource("", postsFetcher);
return (
<main class='flex flex-col gap-4 sm:gap-4 py-8 px-4 max-w-xl mx-auto items-start drop-shadow-blue-glow'>
<a href="https://mutinywallet.com">
<img src={logo} class="h-10" alt="logo" />
</a>
<h1 class="text-4xl font-bold">You're on a list!</h1>
<h2 class="text-xl pr-4">
We'll message you when Mutiny Wallet is ready.
</h2>
<div class="px-4 sm:px-8 py-8 rounded-xl bg-half-black w-full">
<h2 class="text-sm font-semibold uppercase">Recent Updates</h2>
<Show when={!posts.loading} fallback={<div class="h-[10rem]"><LoadingSpinner big /></div>}>
<Notes notes={posts() && posts() || []} />
</Show>
</div>
</main>
<main class="flex flex-col gap-4 sm:gap-4 py-8 px-4 max-w-xl mx-auto items-start drop-shadow-blue-glow">
<a href="https://mutinywallet.com">
<img src={logo} class="h-10" alt="logo" />
</a>
<h1 class="text-4xl font-bold">You're on a list!</h1>
<h2 class="text-xl pr-4">We'll message you when Mutiny Wallet is ready.</h2>
<div class="px-4 sm:px-8 py-8 rounded-xl bg-half-black w-full">
<h2 class="text-sm font-semibold uppercase">Recent Updates</h2>
<Show
when={!posts.loading}
fallback={
<div class="h-[10rem]">
<LoadingSpinner big wide />
</div>
}
>
<Notes notes={(posts() && posts()) || []} />
</Show>
</div>
</main>
);
}