mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-18 11:13:30 +00:00
minor updates
This commit is contained in:
parent
c8f643198e
commit
763af0da14
@ -9,7 +9,6 @@ export function ChannelMessageList() {
|
||||
const virtuosoRef = useRef(null);
|
||||
|
||||
const messages = useChannelMessages((state: any) => state.messages);
|
||||
const sorted = messages;
|
||||
|
||||
const itemContent: any = useCallback(
|
||||
(index: string | number) => {
|
||||
|
@ -1,6 +1,5 @@
|
||||
import UserReply from "@app/channel/components/messages/userReply";
|
||||
import CancelIcon from "@icons/cancel";
|
||||
import { ImagePicker } from "@shared/form/imagePicker";
|
||||
import { RelayContext } from "@shared/relayProvider";
|
||||
import { useActiveAccount } from "@stores/accounts";
|
||||
import { useChannelMessages } from "@stores/channels";
|
||||
@ -11,7 +10,7 @@ import { useContext, useState } from "react";
|
||||
|
||||
export default function ChannelMessageForm({
|
||||
channelID,
|
||||
}: { channelID: string | string[] }) {
|
||||
}: { channelID: string }) {
|
||||
const pool: any = useContext(RelayContext);
|
||||
const account = useActiveAccount((state: any) => state.account);
|
||||
|
||||
@ -22,7 +21,7 @@ export default function ChannelMessageForm({
|
||||
]);
|
||||
|
||||
const submitEvent = () => {
|
||||
let tags: any[][];
|
||||
let tags: string[][];
|
||||
|
||||
if (replyTo.id !== null) {
|
||||
tags = [
|
||||
@ -34,23 +33,21 @@ export default function ChannelMessageForm({
|
||||
tags = [["e", channelID, "", "root"]];
|
||||
}
|
||||
|
||||
if (account) {
|
||||
const event: any = {
|
||||
content: value,
|
||||
created_at: dateToUnix(),
|
||||
kind: 42,
|
||||
pubkey: account.pubkey,
|
||||
tags: tags,
|
||||
};
|
||||
const event: any = {
|
||||
content: value,
|
||||
created_at: dateToUnix(),
|
||||
kind: 42,
|
||||
pubkey: account.pubkey,
|
||||
tags: tags,
|
||||
};
|
||||
|
||||
event.id = getEventHash(event);
|
||||
event.sig = getSignature(event, account.privkey);
|
||||
event.id = getEventHash(event);
|
||||
event.sig = getSignature(event, account.privkey);
|
||||
|
||||
// publish note
|
||||
pool.publish(event, WRITEONLY_RELAYS);
|
||||
} else {
|
||||
console.log("error");
|
||||
}
|
||||
// publish note
|
||||
pool.publish(event, WRITEONLY_RELAYS);
|
||||
// reset state
|
||||
setValue("");
|
||||
};
|
||||
|
||||
const handleEnterPress = (e) => {
|
||||
@ -68,15 +65,15 @@ export default function ChannelMessageForm({
|
||||
<div
|
||||
className={`relative ${
|
||||
replyTo.id ? "h-36" : "h-24"
|
||||
} w-full overflow-hidden before:pointer-events-none before:absolute before:-inset-1 before:rounded-[11px] before:border before:border-fuchsia-500 before:opacity-0 before:ring-2 before:ring-fuchsia-500/20 before:transition after:pointer-events-none after:absolute after:inset-px after:rounded-[7px] after:shadow-highlight after:shadow-white/5 after:transition focus-within:before:opacity-100 focus-within:after:shadow-fuchsia-500/100 dark:focus-within:after:shadow-fuchsia-500/20`}
|
||||
} w-full overflow-hidden before:pointer-events-none before:absolute before:-inset-1 before:rounded-[6px] before:border before:border-fuchsia-500 before:opacity-0 before:ring-2 before:ring-fuchsia-500/20 before:transition after:pointer-events-none after:absolute after:inset-px after:rounded-[7px] after:shadow-highlight after:shadow-white/5 after:transition focus-within:before:opacity-100 focus-within:after:shadow-fuchsia-500/100 dark:focus-within:after:shadow-fuchsia-500/20`}
|
||||
>
|
||||
{replyTo.id && (
|
||||
<div className="absolute left-0 top-0 z-10 h-14 w-full p-[2px]">
|
||||
<div className="absolute left-0 top-0 z-10 h-16 w-full p-[2px]">
|
||||
<div className="flex h-full w-full items-center justify-between rounded-t-md border-b border-zinc-700/70 bg-zinc-900 px-3">
|
||||
<div className="flex w-full flex-col">
|
||||
<UserReply pubkey={replyTo.pubkey} />
|
||||
<div className="-mt-3.5 pl-[32px]">
|
||||
<div className="text-base text-white">{replyTo.content}</div>
|
||||
<div className="-mt-5 pl-[38px]">
|
||||
<div className="text-base text-zinc-100">{replyTo.content}</div>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
|
@ -7,22 +7,22 @@ export default function UserReply({ pubkey }: { pubkey: string }) {
|
||||
const { user, isError, isLoading } = useProfile(pubkey);
|
||||
|
||||
return (
|
||||
<div className="group flex items-start gap-1">
|
||||
<div className="group flex items-start gap-2">
|
||||
{isError || isLoading ? (
|
||||
<>
|
||||
<div className="relative h-7 w-7 shrink animate-pulse overflow-hidden rounded bg-zinc-800" />
|
||||
<div className="relative h-9 w-9 shrink animate-pulse overflow-hidden rounded bg-zinc-800" />
|
||||
<span className="h-2 w-10 animate-pulse rounded bg-zinc-800 text-base font-medium leading-none text-zinc-500" />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<div className="relative h-7 w-7 shrink overflow-hidden rounded">
|
||||
<div className="relative h-9 w-9 shrink overflow-hidden rounded">
|
||||
<Image
|
||||
src={user?.picture || DEFAULT_AVATAR}
|
||||
alt={pubkey}
|
||||
className="h-7 w-7 rounded object-cover"
|
||||
className="h-9 w-9 rounded object-cover"
|
||||
/>
|
||||
</div>
|
||||
<span className="text-base font-medium leading-none text-zinc-500">
|
||||
<span className="text-sm font-medium leading-none text-zinc-500">
|
||||
Replying to {user?.name || shortenKey(pubkey)}
|
||||
</span>
|
||||
</>
|
||||
|
@ -37,7 +37,10 @@ export function Page() {
|
||||
const channelPubkey = searchParams.channelpub;
|
||||
|
||||
const account: any = useActiveAccount((state: any) => state.account);
|
||||
const addMessage = useChannelMessages((state: any) => state.add);
|
||||
const [addMessage, clear] = useChannelMessages((state: any) => [
|
||||
state.add,
|
||||
state.clear,
|
||||
]);
|
||||
|
||||
const { data: muted } = useSWR(
|
||||
account ? ["muted", account.id] : null,
|
||||
@ -88,6 +91,7 @@ export function Page() {
|
||||
|
||||
return () => {
|
||||
unsubscribe();
|
||||
clear();
|
||||
};
|
||||
},
|
||||
);
|
||||
|
@ -69,6 +69,17 @@ export function ChatMessageForm({
|
||||
placeholder="Message"
|
||||
className="relative h-11 w-full resize-none rounded-md px-5 !outline-none bg-zinc-800 placeholder:text-zinc-500"
|
||||
/>
|
||||
<div className="absolute right-2 top-0 h-11">
|
||||
<div className="h-full flex items-center justify-end">
|
||||
<button
|
||||
type="button"
|
||||
onClick={submit}
|
||||
className="inline-flex items-center gap-1 text-zinc-500 leading-none"
|
||||
>
|
||||
Send
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -18,9 +18,10 @@ export function Page() {
|
||||
const searchParams: any = pageContext.urlParsed.search;
|
||||
const pubkey = searchParams.pubkey;
|
||||
|
||||
const [fetchMessages, addMessage] = useChatMessages((state: any) => [
|
||||
const [fetchMessages, addMessage, clear] = useChatMessages((state: any) => [
|
||||
state.fetch,
|
||||
state.add,
|
||||
state.clear,
|
||||
]);
|
||||
|
||||
useSWRSubscription(account ? ["chat", pubkey] : null, ([, key]) => {
|
||||
@ -52,6 +53,10 @@ export function Page() {
|
||||
|
||||
useEffect(() => {
|
||||
fetchMessages(account.pubkey, pubkey);
|
||||
|
||||
return () => {
|
||||
clear();
|
||||
};
|
||||
}, [pubkey]);
|
||||
|
||||
return (
|
||||
|
@ -13,7 +13,6 @@ export const useChannels = create((set) => ({
|
||||
export const useChannelMessages = create(
|
||||
immer((set) => ({
|
||||
messages: [],
|
||||
members: new Set(),
|
||||
replyTo: { id: null, pubkey: null, content: null },
|
||||
add: (message: any) => {
|
||||
set((state: any) => ({ messages: [...state.messages, message] }));
|
||||
@ -36,5 +35,11 @@ export const useChannelMessages = create(
|
||||
state.messages[target]["mute"] = true;
|
||||
});
|
||||
},
|
||||
clear: () => {
|
||||
set(() => ({
|
||||
messages: [],
|
||||
replyTo: { id: null, pubkey: null, content: null },
|
||||
}));
|
||||
},
|
||||
})),
|
||||
);
|
||||
|
@ -18,4 +18,7 @@ export const useChatMessages = create((set) => ({
|
||||
add: (message: any) => {
|
||||
set((state: any) => ({ messages: [...state.messages, message] }));
|
||||
},
|
||||
clear: () => {
|
||||
set(() => ({ messages: [] }));
|
||||
},
|
||||
}));
|
||||
|
@ -5,18 +5,16 @@ export const DEFAULT_AVATAR = "https://void.cat/d/KmypFh2fBdYCEvyJrPiN89.webp";
|
||||
export const DEFAULT_CHANNEL_BANNER =
|
||||
"https://bafybeiacwit7hjmdefqggxqtgh6ht5dhth7ndptwn2msl5kpkodudsr7py.ipfs.w3s.link/banner-1.jpg";
|
||||
|
||||
// metadata service
|
||||
export const METADATA_SERVICE = "https://us.rbr.bio";
|
||||
|
||||
// read-only relay list
|
||||
export const READONLY_RELAYS = [
|
||||
"wss://welcome.nostr.wine",
|
||||
"wss://relay.nostr.band",
|
||||
"wss://relay.damus.io",
|
||||
];
|
||||
|
||||
// write-only relay list
|
||||
export const WRITEONLY_RELAYS = [
|
||||
"wss://nostr.mutinywallet.com",
|
||||
"wss://relay.damus.io",
|
||||
"wss://relay.nostr.band",
|
||||
];
|
||||
|
||||
@ -27,5 +25,5 @@ export const METADATA_RELAY = ["wss://relay.nostr.band"];
|
||||
export const FULL_RELAYS = [
|
||||
"wss://welcome.nostr.wine",
|
||||
"wss://relay.nostr.band",
|
||||
"wss://nostr.mutinywallet.com",
|
||||
"wss://relay.damus.io",
|
||||
];
|
||||
|
Loading…
Reference in New Issue
Block a user