elgaard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Feature: add online indicator to special renderings or hide them in case of failure

Browse source
This commit is contained in:
Pieter Vander Vennet 2025-08-01 00:43:52 +02:00
parent b6366412ea
commit 6f44fe31d0
7 changed files with 28 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/UI/Base/LoginToggle.svelte
View file

@ -8,6 +8,7 @@
import { ImmutableStore, Store, UIEventSource } from "../../Logic/UIEventSource"
import Invalid from "../../assets/svg/Invalid.svelte"
import ArrowPath from "@babeard/svelte-heroicons/mini/ArrowPath"
import { IsOnline } from "../../Logic/Web/IsOnline"
export let state: {
osmConnection: OsmConnection
@ -17,10 +18,6 @@
* If set, 'loading' will act as if we are already logged in.
*/
export let ignoreLoading: boolean = false
/**
* Only show the 'successful' state, don't show loading or error messages
*/
export let silentFail: boolean = false
/**
* If set and the OSM-api fails, do _not_ show any error messages nor the successful state, just hide.
* Will still show the "not-logged-in"-slot
@ -37,14 +34,21 @@
}
const apiState: Store<string> =
state?.osmConnection?.apiIsOnline ?? new ImmutableStore<OsmServiceState>("online")
const online = IsOnline.isOnline
</script>
{#if $badge}
{#if !ignoreLoading && !silentFail && $loadingStatus === "loading"}
{#if !$online}
{#if !hiddenFail}
<div class="alert">
Your device is offline
</div>
{/if}
{:else if !ignoreLoading && !hiddenFail && $loadingStatus === "loading"}
<slot name="loading">
<Loading />
</slot>
{:else if !silentFail && ($loadingStatus === "error" || $apiState === "readonly" || $apiState === "offline")}
{:else if ($loadingStatus === "error" || $apiState === "readonly" || $apiState === "offline")}
{#if !hiddenFail}
<slot name="error">
<div class="alert flex flex-col items-center">
@ -61,7 +65,7 @@
{/if}
{:else if $loadingStatus === "logged-in"}
<slot />
{:else if !silentFail && $loadingStatus === "not-attempted"}
{:else if $loadingStatus === "not-attempted"}
<slot name="not-logged-in" />
{/if}
{/if}