mirror of
https://github.com/coracle-social/coracle.git
synced 2024-09-19 11:43:35 +00:00
Show person next to reply/new note #42
This commit is contained in:
parent
0793d609c7
commit
87bfafa4d5
@ -16,6 +16,8 @@
|
||||
|
||||
# More
|
||||
|
||||
- [ ] Write multi-relay pagination into paravel and open source it
|
||||
- nevent1qqszpjf3307ccam3cl957yc7k3h5c7vpt7gz2vdzgwkqszsyvdj6e0cpzfmhxue69uhk7enxvd5xz6tw9ec82csgdxq30
|
||||
- [ ] Monetize multiplexing
|
||||
- [ ] Nostr Wallet Connect https://nwc.getalby.com/
|
||||
- [ ] Build per-relay pagination, put it in paravel https://github.com/nostr-protocol/nips/pull/408
|
||||
|
@ -201,9 +201,9 @@
|
||||
</script>
|
||||
|
||||
<Router {url}>
|
||||
<div use:links class="h-full">
|
||||
<div use:links>
|
||||
{#if ready}
|
||||
<div class="h-full pt-16 text-gray-3 lg:ml-56">
|
||||
<div class="pt-16 text-gray-3 lg:ml-56">
|
||||
<Route path="/notifications" component={Notifications} />
|
||||
<Route path="/search">
|
||||
<EnsureData enforcePeople={false}>
|
||||
|
@ -3,7 +3,7 @@
|
||||
import {killEvent} from "src/util/html"
|
||||
import {displayPerson} from "src/util/nostr"
|
||||
import {routes} from "src/app/ui"
|
||||
import PersonCircle from "./PersonCircle.svelte";
|
||||
import PersonCircle from "src/partials/PersonCircle.svelte"
|
||||
|
||||
export let person
|
||||
export let inert = false
|
||||
@ -11,7 +11,7 @@
|
||||
|
||||
{#if inert}
|
||||
<span class="relative z-10 flex items-center gap-2">
|
||||
<PersonCircle person={person} />
|
||||
<PersonCircle {person} />
|
||||
<span class="text-lg font-bold">{displayPerson(person)}</span>
|
||||
</span>
|
||||
{:else}
|
||||
@ -19,7 +19,7 @@
|
||||
to={routes.person(person.pubkey)}
|
||||
class="relative z-10 flex items-center gap-2"
|
||||
on:click={killEvent}>
|
||||
<PersonCircle person={person} />
|
||||
<PersonCircle {person} />
|
||||
<span class="text-lg font-bold">{displayPerson(person)}</span>
|
||||
</Link>
|
||||
{/if}
|
||||
|
@ -191,13 +191,6 @@
|
||||
replyMentions = getDefaultReplyMentions()
|
||||
}
|
||||
|
||||
const onReplyKeydown = e => {
|
||||
if (e.key === "Escape") {
|
||||
e.stopPropagation()
|
||||
resetReply()
|
||||
}
|
||||
}
|
||||
|
||||
const sendReply = async () => {
|
||||
let {content, mentions, topics} = reply.parse()
|
||||
|
||||
@ -494,12 +487,10 @@
|
||||
{#if reply}
|
||||
<div
|
||||
transition:slide
|
||||
class={`note-reply relative z-10 border border-${borderColor} rounded border-solid`}
|
||||
class="note-reply relative z-10 flex flex-col gap-1"
|
||||
bind:this={replyContainer}>
|
||||
<div
|
||||
class="bg-gray-7"
|
||||
class:rounded-b={replyMentions.length === 0}
|
||||
on:keydown={onReplyKeydown}>
|
||||
<div class={`border border-${borderColor} rounded border-solid`}>
|
||||
<div class="bg-gray-7" class:rounded-b={replyMentions.length === 0}>
|
||||
<Compose bind:this={reply} onSubmit={sendReply}>
|
||||
<button
|
||||
slot="addon"
|
||||
@ -520,8 +511,8 @@
|
||||
</div>
|
||||
{/if}
|
||||
<div class={`h-px bg-${borderColor}`} />
|
||||
<div class="h-12 rounded-b bg-gray-7 p-2 text-sm text-gray-3">
|
||||
<div class="mr-2 inline-block border-r border-solid border-gray-6 py-2 pl-1 pr-3">
|
||||
<div class="flex gap-2 rounded-b bg-gray-7 p-2 text-sm text-gray-3">
|
||||
<div class="inline-block border-r border-solid border-gray-6 py-2 pl-1 pr-3">
|
||||
<div class="flex cursor-pointer items-center gap-3">
|
||||
<ImageInput bind:value={image} icon="image" hideInput>
|
||||
<i slot="button" class="fa fa-paperclip" />
|
||||
@ -529,8 +520,10 @@
|
||||
<i class="fa fa-at" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{#each replyMentions as p}
|
||||
<div class="mr-1 inline-block rounded-full border border-solid border-gray-1 py-1 px-2">
|
||||
<div
|
||||
class="mr-1 mb-1 inline-block rounded-full border border-solid border-gray-1 py-1 px-2">
|
||||
<button
|
||||
class="fa fa-times cursor-pointer"
|
||||
on:click|stopPropagation={() => removeMention(p)} />
|
||||
@ -539,7 +532,14 @@
|
||||
{:else}
|
||||
<div class="text-gray-1 inline-block">No mentions</div>
|
||||
{/each}
|
||||
<div class="-mt-2" />
|
||||
<div class="-mb-2" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 text-sm text-gray-5">
|
||||
<span>
|
||||
Posting as @{displayPerson(getPersonWithFallback(user.getPubkey()))}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
@ -5,6 +5,7 @@
|
||||
import {last, reject, pluck, propEq} from "ramda"
|
||||
import {fly} from "svelte/transition"
|
||||
import {fuzzy} from "src/util/misc"
|
||||
import {displayPerson} from "src/util/nostr"
|
||||
import Button from "src/partials/Button.svelte"
|
||||
import Compose from "src/partials/Compose.svelte"
|
||||
import ImageInput from "src/partials/ImageInput.svelte"
|
||||
@ -110,6 +111,11 @@
|
||||
<strong>What do you want to say?</strong>
|
||||
<div class="border-l-2 border-solid border-gray-6 pl-4">
|
||||
<Compose bind:this={compose} {onSubmit} />
|
||||
<div class="flex justify-end">
|
||||
<small class="text-gray-5">
|
||||
Posting as @{displayPerson(getPersonWithFallback(user.getPubkey()))}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{#if image}
|
||||
|
Loading…
Reference in New Issue
Block a user