forked from coracle/flotilla
Use publishThunks
This commit is contained in:
@@ -1,11 +1,11 @@
|
||||
<script lang="ts">
|
||||
import {assoc, sortBy, append} from "@welshman/lib"
|
||||
import {sortBy, append} from "@welshman/lib"
|
||||
import type {EventContent, TrustedEvent} from "@welshman/util"
|
||||
import {repository} from "@welshman/app"
|
||||
import {deriveEvents} from "@welshman/store"
|
||||
import ChannelMessage from "@app/components/ChannelMessage.svelte"
|
||||
import ChannelCompose from "@app/components/ChannelCompose.svelte"
|
||||
import {thunks, tagRoom, COMMENT} from "@app/state"
|
||||
import {tagRoom, COMMENT} from "@app/state"
|
||||
import {publishComment} from "@app/commands"
|
||||
|
||||
export let url, room, event: TrustedEvent
|
||||
@@ -14,16 +14,13 @@
|
||||
filters: [{kinds: [COMMENT], "#E": [event.id]}],
|
||||
})
|
||||
|
||||
const onSubmit = ({content, tags}: EventContent) => {
|
||||
const thunk = publishComment({
|
||||
const onSubmit = ({content, tags}: EventContent) =>
|
||||
publishComment({
|
||||
event,
|
||||
content,
|
||||
tags: append(tagRoom(room, url), tags),
|
||||
relays: [url],
|
||||
})
|
||||
|
||||
thunks.update(assoc(thunk.event.id, thunk))
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="col-2">
|
||||
|
||||
@@ -2,8 +2,13 @@
|
||||
import {readable} from "svelte/store"
|
||||
import {hash} from "@welshman/lib"
|
||||
import type {TrustedEvent} from "@welshman/util"
|
||||
import {deriveProfile, deriveProfileDisplay, formatTimestampAsTime, pubkey} from "@welshman/app"
|
||||
import type {Thunk} from "@welshman/app"
|
||||
import {
|
||||
thunks,
|
||||
deriveProfile,
|
||||
deriveProfileDisplay,
|
||||
formatTimestampAsTime,
|
||||
pubkey,
|
||||
} from "@welshman/app"
|
||||
import {isMobile} from "@lib/html"
|
||||
import LongPress from "@lib/components/LongPress.svelte"
|
||||
import Avatar from "@lib/components/Avatar.svelte"
|
||||
@@ -16,13 +21,12 @@
|
||||
import ChannelMessageEmojiButton from "@app/components/ChannelMessageEmojiButton.svelte"
|
||||
import ChannelMessageMenuButton from "@app/components/ChannelMessageMenuButton.svelte"
|
||||
import ChannelMessageMenuMobile from "@app/components/ChannelMessageMenuMobile.svelte"
|
||||
import {colors, thunks, tagRoom, deriveEvent, pubkeyLink} from "@app/state"
|
||||
import {colors, tagRoom, deriveEvent, pubkeyLink} from "@app/state"
|
||||
import {publishDelete, publishReaction} from "@app/commands"
|
||||
import {pushDrawer, pushModal} from "@app/modal"
|
||||
|
||||
export let url, room
|
||||
export let event: TrustedEvent
|
||||
export let thunk: Thunk
|
||||
export let showPubkey = false
|
||||
export let isHead = false
|
||||
export let inert = false
|
||||
@@ -90,7 +94,7 @@
|
||||
<div class="text-sm">
|
||||
<Content {event} />
|
||||
{#if thunk}
|
||||
<ThunkStatus {thunk} />
|
||||
<ThunkStatus {thunk} class="mt-2" />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<script lang="ts">
|
||||
import {onMount} from "svelte"
|
||||
import {derived} from "svelte/store"
|
||||
import {int, assoc, MINUTE, sortBy, remove} from "@welshman/lib"
|
||||
import {int, MINUTE, sortBy, remove} from "@welshman/lib"
|
||||
import type {TrustedEvent, EventContent} from "@welshman/util"
|
||||
import {createEvent, DIRECT_MESSAGE} from "@welshman/util"
|
||||
import {
|
||||
@@ -32,14 +32,7 @@
|
||||
import ProfileList from "@app/components/ProfileList.svelte"
|
||||
import ChatMessage from "@app/components/ChatMessage.svelte"
|
||||
import ChatCompose from "@app/components/ChannelCompose.svelte"
|
||||
import {
|
||||
thunks,
|
||||
userSettingValues,
|
||||
deriveChat,
|
||||
splitChatId,
|
||||
PLATFORM_NAME,
|
||||
pubkeyLink,
|
||||
} from "@app/state"
|
||||
import {userSettingValues, deriveChat, splitChatId, PLATFORM_NAME, pubkeyLink} from "@app/state"
|
||||
import {pushModal} from "@app/modal"
|
||||
import {sendWrapped} from "@app/commands"
|
||||
|
||||
@@ -61,10 +54,12 @@
|
||||
|
||||
const onSubmit = async ({content, ...params}: EventContent) => {
|
||||
const tags = [...params.tags, ...remove($pubkey!, pubkeys).map(tagPubkey)]
|
||||
const template = createEvent(DIRECT_MESSAGE, {content, tags})
|
||||
const thunk = await sendWrapped({template, pubkeys, delay: $userSettingValues.send_delay})
|
||||
|
||||
thunks.update(assoc(thunk.thunks[0].event.id, thunk))
|
||||
await sendWrapped({
|
||||
pubkeys,
|
||||
template: createEvent(DIRECT_MESSAGE, {content, tags}),
|
||||
delay: $userSettingValues.send_delay,
|
||||
})
|
||||
}
|
||||
|
||||
let loading = true
|
||||
|
||||
@@ -2,7 +2,13 @@
|
||||
import {type Instance} from "tippy.js"
|
||||
import {hash} from "@welshman/lib"
|
||||
import type {TrustedEvent} from "@welshman/util"
|
||||
import {deriveProfile, deriveProfileDisplay, formatTimestampAsTime, pubkey} from "@welshman/app"
|
||||
import {
|
||||
thunks,
|
||||
deriveProfile,
|
||||
deriveProfileDisplay,
|
||||
formatTimestampAsTime,
|
||||
pubkey,
|
||||
} from "@welshman/app"
|
||||
import {isMobile} from "@lib/html"
|
||||
import Icon from "@lib/components/Icon.svelte"
|
||||
import Link from "@lib/components/Link.svelte"
|
||||
@@ -15,7 +21,7 @@
|
||||
import ThunkStatus from "@app/components/ThunkStatus.svelte"
|
||||
import ChatMessageMenu from "@app/components/ChatMessageMenu.svelte"
|
||||
import ChatMessageMenuMobile from "@app/components/ChatMessageMenuMobile.svelte"
|
||||
import {colors, pubkeyLink, thunks} from "@app/state"
|
||||
import {colors, pubkeyLink} from "@app/state"
|
||||
import {makeDelete, makeReaction, sendWrapped} from "@app/commands"
|
||||
import {pushModal} from "@app/modal"
|
||||
|
||||
|
||||
@@ -6,9 +6,10 @@
|
||||
|
||||
export let code
|
||||
|
||||
let canvas, wrapper
|
||||
let canvas: Element
|
||||
let wrapper: Element
|
||||
let scale = 0.1
|
||||
let height = null
|
||||
let height: number
|
||||
|
||||
onMount(() => {
|
||||
QRCode.toCanvas(canvas, code)
|
||||
|
||||
@@ -4,12 +4,13 @@
|
||||
import {max} from "@welshman/lib"
|
||||
import {deriveEvents, deriveIsDeleted} from "@welshman/store"
|
||||
import type {TrustedEvent} from "@welshman/util"
|
||||
import {pubkey, repository, formatTimestampRelative} from "@welshman/app"
|
||||
import {thunks, pubkey, repository, formatTimestampRelative} from "@welshman/app"
|
||||
import Icon from "@lib/components/Icon.svelte"
|
||||
import Tippy from "@lib/components/Tippy.svelte"
|
||||
import Button from "@lib/components/Button.svelte"
|
||||
import EmojiButton from "@lib/components/EmojiButton.svelte"
|
||||
import ReactionSummary from "@app/components/ReactionSummary.svelte"
|
||||
import ThunkStatus from "@app/components/ThunkStatus.svelte"
|
||||
import ThreadMenu from "@app/components/ThreadMenu.svelte"
|
||||
import {publishDelete, publishReaction} from "@app/commands"
|
||||
import {COMMENT} from "@app/state"
|
||||
@@ -18,8 +19,8 @@
|
||||
export let event
|
||||
export let showActivity = false
|
||||
|
||||
const thunk = $thunks[event.id]
|
||||
const deleted = deriveIsDeleted(repository, event)
|
||||
|
||||
const replies = deriveEvents(repository, {filters: [{kinds: [COMMENT], "#E": [event.id]}]})
|
||||
|
||||
const showPopover = () => popover.show()
|
||||
@@ -49,6 +50,8 @@
|
||||
<div class="flex flex-grow flex-wrap justify-end gap-2">
|
||||
{#if $deleted}
|
||||
<div class="btn btn-error btn-xs rounded-full">Deleted</div>
|
||||
{:else if thunk}
|
||||
<ThunkStatus {thunk} />
|
||||
{/if}
|
||||
{#if showActivity}
|
||||
<div class="flex-inline btn btn-neutral btn-xs gap-1 rounded-full">
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
<script lang="ts">
|
||||
import {get} from "svelte/store"
|
||||
import {PublishStatus} from "@welshman/net"
|
||||
import {mergeThunks, publishThunk} from "@welshman/app"
|
||||
import type {Thunk, MergedThunk} from "@welshman/app"
|
||||
@@ -21,7 +22,7 @@
|
||||
: publishThunk((thunk as Thunk).request)
|
||||
}
|
||||
|
||||
let isPending = true
|
||||
let isPending = Object.values(get(thunk.status)).some(s => s.status == Pending)
|
||||
|
||||
$: status = throttled(300, thunk.status)
|
||||
$: ps = Object.values($status)
|
||||
@@ -31,7 +32,7 @@
|
||||
|
||||
$: {
|
||||
// Delay updating isPending so users can see that the message is sent
|
||||
if (isFailure || !ps.some(s => s.status == Pending)) {
|
||||
if (!ps.some(s => s.status == Pending)) {
|
||||
setTimeout(() => {
|
||||
isPending = false
|
||||
}, 2000)
|
||||
@@ -39,25 +40,25 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex justify-end px-1 text-xs">
|
||||
{#if canCancel || isPending}
|
||||
<span class="mt-2 flex items-center gap-1">
|
||||
<div class="flex justify-end px-1 text-xs {$$props.class}">
|
||||
{#if isFailure && failure}
|
||||
{@const [url, {message, status}] = failure}
|
||||
<Tippy
|
||||
component={ThunkStatusDetail}
|
||||
props={{url, message, status, retry}}
|
||||
params={{interactive: true}}>
|
||||
<span class="tooltip flex cursor-pointer items-center gap-1">
|
||||
<Icon icon="danger" size={3} />
|
||||
<span class="opacity-50">Failed to send!</span>
|
||||
</span>
|
||||
</Tippy>
|
||||
{:else if canCancel || isPending}
|
||||
<span class="flex items-center gap-1">
|
||||
<span class="loading loading-spinner mx-1 h-3 w-3 translate-y-px" />
|
||||
<span class="opacity-50">Sending...</span>
|
||||
{#if canCancel}
|
||||
<Button class="link" on:click={abort}>Cancel</Button>
|
||||
{/if}
|
||||
</span>
|
||||
{:else if isFailure && failure}
|
||||
{@const [url, {message, status}] = failure}
|
||||
<Tippy
|
||||
component={ThunkStatusDetail}
|
||||
props={{url, message, status, retry}}
|
||||
params={{interactive: true}}>
|
||||
<span class="tooltip mt-2 flex cursor-pointer items-center gap-1">
|
||||
<Icon icon="danger" size={3} />
|
||||
<span class="opacity-50">Failed to send!</span>
|
||||
</span>
|
||||
</Tippy>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user