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

UX: show loading icon while testing OSM api capabilities

Browse source
This commit is contained in:
Pieter Vander Vennet 2025-01-22 23:26:51 +01:00
parent d9b910e36b
commit 2b858bd2aa
1 changed files with 4 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/UI/ThemeViewGUI.svelte
View file

@ -4,7 +4,6 @@
import MaplibreMap from "./Map/MaplibreMap.svelte" import MaplibreMap from "./Map/MaplibreMap.svelte"
import FeatureSwitchState from "../Logic/State/FeatureSwitchState" import FeatureSwitchState from "../Logic/State/FeatureSwitchState"
import MapControlButton from "./Base/MapControlButton.svelte" import MapControlButton from "./Base/MapControlButton.svelte"
import ToSvelte from "./Base/ToSvelte.svelte"
import If from "./Base/If.svelte" import If from "./Base/If.svelte"
import type { Feature } from "geojson" import type { Feature } from "geojson"
import SelectedElementView from "./BigComponents/SelectedElementView.svelte" import SelectedElementView from "./BigComponents/SelectedElementView.svelte"
@ -48,6 +47,7 @@
import { Drawer } from "flowbite-svelte" import { Drawer } from "flowbite-svelte"
import { linear } from "svelte/easing" import { linear } from "svelte/easing"
import DefaultIcon from "./Map/DefaultIcon.svelte" import DefaultIcon from "./Map/DefaultIcon.svelte"
import Loading from "./Base/Loading.svelte"
export let state: ThemeViewState export let state: ThemeViewState
@ -421,7 +421,9 @@
<If condition={state.featureSwitches.featureSwitchFakeUser}> <If condition={state.featureSwitches.featureSwitchFakeUser}>
<div class="alert w-fit">Faking a user (Testmode)</div> <div class="alert w-fit">Faking a user (Testmode)</div>
</If> </If>
{#if $apiState !== "online" && $apiState !== "unknown"} {#if $apiState === "unknown"}
<Loading />
{:else if $apiState !== "online"}
<div class="alert w-fit">API is {$apiState}</div> <div class="alert w-fit">API is {$apiState}</div>
{/if} {/if}
</div> </div>