mirror of
https://github.com/coracle-social/flotilla.git
synced 2025-12-10 10:57:04 +00:00
Fix thunk indicator
This commit is contained in:
@@ -6,7 +6,6 @@
|
||||
pubkey,
|
||||
formatTimestampAsDate,
|
||||
formatTimestampAsTime,
|
||||
thunkIsComplete,
|
||||
deriveProfile,
|
||||
deriveProfileDisplay,
|
||||
} from "@welshman/app"
|
||||
@@ -42,7 +41,6 @@
|
||||
const profile = deriveProfile(event.pubkey, [url])
|
||||
const profileDisplay = deriveProfileDisplay(event.pubkey, [url])
|
||||
const [_, colorValue] = colors[parseInt(hash(event.pubkey)) % colors.length]
|
||||
const hideMenuButton = $derived($thunk && !thunkIsComplete($thunk))
|
||||
|
||||
const reply = () => replyTo!(event)
|
||||
|
||||
@@ -100,7 +98,7 @@
|
||||
<div class="row-2 ml-10 mt-1">
|
||||
<ReactionSummary {url} {event} {onReactionClick} reactionClass="tooltip-right" />
|
||||
</div>
|
||||
{#if !isMobile && !hideMenuButton}
|
||||
{#if !isMobile}
|
||||
<button
|
||||
class="join absolute right-1 top-1 border border-solid border-neutral text-xs opacity-0 transition-all"
|
||||
class:group-hover:opacity-100={!isMobile}>
|
||||
|
||||
@@ -9,7 +9,6 @@
|
||||
thunkHasStatus,
|
||||
} from "@welshman/app"
|
||||
import type {Thunk} from "@welshman/app"
|
||||
import {fade} from "@lib/transition"
|
||||
import Icon from "@lib/components/Icon.svelte"
|
||||
import Tippy from "@lib/components/Tippy.svelte"
|
||||
import ThunkStatusDetail from "@app/components/ThunkStatusDetail.svelte"
|
||||
@@ -36,7 +35,7 @@
|
||||
const failedUrls = $derived(
|
||||
statuses
|
||||
.filter(([_, status]) => [PublishStatus.Failure, PublishStatus.Timeout].includes(status))
|
||||
.map(nth(1)),
|
||||
.map(nth(0)),
|
||||
)
|
||||
|
||||
const showFailure = $derived(thunkIsComplete($thunk) && failedUrls.length > 0)
|
||||
@@ -57,43 +56,37 @@
|
||||
})
|
||||
</script>
|
||||
|
||||
{#if showFailure || showPending}
|
||||
<div class="relative" out:fade>
|
||||
<div class="absolute right-0 top-2">
|
||||
{#if showFailure}
|
||||
{@const url = failedUrls[0]}
|
||||
{@const status = $thunk.status[url]}
|
||||
{@const message = $thunk.details[url]}
|
||||
<div class="flex justify-end px-1 text-xs {restProps.class}">
|
||||
<Tippy
|
||||
class="flex items-center {restProps.class}"
|
||||
component={ThunkStatusDetail}
|
||||
props={{url, message, status, retry}}
|
||||
params={{interactive: true}}>
|
||||
{#snippet children()}
|
||||
<span class="flex cursor-pointer items-center gap-1 text-error">
|
||||
<Icon icon="danger" size={3} />
|
||||
<span>Failed to send!</span>
|
||||
</span>
|
||||
{/snippet}
|
||||
</Tippy>
|
||||
</div>
|
||||
{:else if canCancel || isPending}
|
||||
<div class="flex justify-end px-1 text-xs {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="opacity-50">Sending...</span>
|
||||
<button
|
||||
type="button"
|
||||
class="underline transition-all"
|
||||
class:link={canCancel}
|
||||
class:opacity-25={!canCancel}
|
||||
onclick={abort}>
|
||||
Cancel
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{#if showFailure}
|
||||
{@const url = failedUrls[0]}
|
||||
{@const status = $thunk.status[url]}
|
||||
{@const message = $thunk.details[url]}
|
||||
<div class="flex justify-end px-1 text-xs {restProps.class}">
|
||||
<Tippy
|
||||
class="flex items-center {restProps.class}"
|
||||
component={ThunkStatusDetail}
|
||||
props={{url, message, status, retry}}
|
||||
params={{interactive: true}}>
|
||||
{#snippet children()}
|
||||
<span class="flex cursor-pointer items-center gap-1 text-error">
|
||||
<Icon icon="danger" size={3} />
|
||||
<span>Failed to send!</span>
|
||||
</span>
|
||||
{/snippet}
|
||||
</Tippy>
|
||||
</div>
|
||||
{:else if showPending}
|
||||
<div class="flex justify-end px-1 text-xs {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="opacity-50">Sending...</span>
|
||||
<button
|
||||
type="button"
|
||||
class="underline transition-all"
|
||||
class:link={canCancel}
|
||||
class:opacity-25={!canCancel}
|
||||
onclick={abort}>
|
||||
Cancel
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
Reference in New Issue
Block a user