coracle/flotilla
1
3
Fork 9
Code Issues 31 Pull Requests 1 Actions Packages Projects 5 Releases Wiki Activity

Fix thunk indicator

Browse Source
This commit is contained in:
Jon Staab
2025-04-16 14:19:09 -07:00
parent 8c3e52ce8c
commit c8bc8ee8bf
2 changed files with 34 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/ChannelMessage.svelte
+1 -3
View File
@@ -6,7 +6,6 @@
pubkey, pubkey,
formatTimestampAsDate, formatTimestampAsDate,
formatTimestampAsTime, formatTimestampAsTime,
thunkIsComplete,
deriveProfile, deriveProfile,
deriveProfileDisplay, deriveProfileDisplay,
} from "@welshman/app" } from "@welshman/app"
@@ -42,7 +41,6 @@
const profile = deriveProfile(event.pubkey, [url]) const profile = deriveProfile(event.pubkey, [url])
const profileDisplay = deriveProfileDisplay(event.pubkey, [url]) const profileDisplay = deriveProfileDisplay(event.pubkey, [url])
const [_, colorValue] = colors[parseInt(hash(event.pubkey)) % colors.length] const [_, colorValue] = colors[parseInt(hash(event.pubkey)) % colors.length]
const hideMenuButton = $derived($thunk && !thunkIsComplete($thunk))
const reply = () => replyTo!(event) const reply = () => replyTo!(event)
@@ -100,7 +98,7 @@
<div class="row-2 ml-10 mt-1"> <div class="row-2 ml-10 mt-1">
<ReactionSummary {url} {event} {onReactionClick} reactionClass="tooltip-right" /> <ReactionSummary {url} {event} {onReactionClick} reactionClass="tooltip-right" />
</div> </div>
{#if !isMobile && !hideMenuButton} {#if !isMobile}
<button <button
class="join absolute right-1 top-1 border border-solid border-neutral text-xs opacity-0 transition-all" class="join absolute right-1 top-1 border border-solid border-neutral text-xs opacity-0 transition-all"
class:group-hover:opacity-100={!isMobile}> class:group-hover:opacity-100={!isMobile}>
src/app/components/ThunkStatus.svelte
+2 -9
View File
@@ -9,7 +9,6 @@
thunkHasStatus, thunkHasStatus,
} from "@welshman/app" } from "@welshman/app"
import type {Thunk} from "@welshman/app" import type {Thunk} from "@welshman/app"
import {fade} from "@lib/transition"
import Icon from "@lib/components/Icon.svelte" import Icon from "@lib/components/Icon.svelte"
import Tippy from "@lib/components/Tippy.svelte" import Tippy from "@lib/components/Tippy.svelte"
import ThunkStatusDetail from "@app/components/ThunkStatusDetail.svelte" import ThunkStatusDetail from "@app/components/ThunkStatusDetail.svelte"
@@ -36,7 +35,7 @@
const failedUrls = $derived( const failedUrls = $derived(
statuses statuses
.filter(([_, status]) => [PublishStatus.Failure, PublishStatus.Timeout].includes(status)) .filter(([_, status]) => [PublishStatus.Failure, PublishStatus.Timeout].includes(status))
.map(nth(1)), .map(nth(0)),
) )
const showFailure = $derived(thunkIsComplete($thunk) && failedUrls.length > 0) const showFailure = $derived(thunkIsComplete($thunk) && failedUrls.length > 0)
@@ -57,9 +56,6 @@
}) })
</script> </script>
{#if showFailure || showPending}
<div class="relative" out:fade>
<div class="absolute right-0 top-2">
{#if showFailure} {#if showFailure}
{@const url = failedUrls[0]} {@const url = failedUrls[0]}
{@const status = $thunk.status[url]} {@const status = $thunk.status[url]}
@@ -78,7 +74,7 @@
{/snippet} {/snippet}
</Tippy> </Tippy>
</div> </div>
{:else if canCancel || isPending} {:else if showPending}
<div class="flex justify-end px-1 text-xs {restProps.class}"> <div class="flex justify-end px-1 text-xs {restProps.class}">
<span class="flex items-center gap-1 {restProps.class}"> <span class="flex items-center gap-1 {restProps.class}">
<span class="loading loading-spinner mx-1 h-3 w-3 translate-y-px"></span> <span class="loading loading-spinner mx-1 h-3 w-3 translate-y-px"></span>
@@ -94,6 +90,3 @@
</span> </span>
</div> </div>
{/if} {/if}
</div>
</div>
{/if}