Kieran/zap.stream
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

chore: small refactor

Browse Source
This commit is contained in:
kieran
2024-05-28 11:41:19 +01:00
parent 05fab75680
commit 440e446f86
1 changed files with 16 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/element/stream-cards/card-item.tsx
View File

@ -1,6 +1,6 @@
import { useContext } from "react"; import { useContext } from "react";
import { useDrag, useDrop } from "react-dnd"; import { useDrag, useDrop } from "react-dnd";
import { removeUndefined } from "@snort/shared"; import { removeUndefined, unwrap } from "@snort/shared";
import { NostrLink, TaggedNostrEvent } from "@snort/system"; import { NostrLink, TaggedNostrEvent } from "@snort/system";
import { SnortContext } from "@snort/system-react"; import { SnortContext } from "@snort/system-react";
import { CardItem } from "."; import { CardItem } from ".";
@ -20,20 +20,18 @@ interface CardProps {
export function Card({ canEdit, ev, cards }: CardProps) { export function Card({ canEdit, ev, cards }: CardProps) {
const system = useContext(SnortContext); const system = useContext(SnortContext);
const login = useLogin(); const login = useLogin();
const identifier = findTag(ev, "d") ?? ""; const evCard = {
const title = findTag(ev, "title") || findTag(ev, "subject"); title: findTag(ev, "title") || findTag(ev, "subject"),
const image = findTag(ev, "image"); image: findTag(ev, "image"),
const link = findTag(ev, "r"); link: findTag(ev, "r"),
const content = ev.content; content: ev.content,
const evCard = { title, image, link, content, identifier }; identifier: unwrap(findTag(ev, "d")),
};
const tags = removeUndefined(cards.map(a => NostrLink.fromEvent(a).toEventTag())); const tags = removeUndefined(cards.map(a => NostrLink.fromEvent(a).toEventTag()));
const [style, dragRef] = useDrag( const [style, dragRef] = useDrag(
() => ({ () => ({
type: "card", type: "card",
item: { identifier } as CardItem, item: { id: evCard.identifier },
canDrag: () => {
return Boolean(canEdit);
},
collect: monitor => { collect: monitor => {
const isDragging = monitor.isDragging(); const isDragging = monitor.isDragging();
return { return {
@ -42,7 +40,7 @@ export function Card({ canEdit, ev, cards }: CardProps) {
}; };
}, },
}), }),
[canEdit, identifier], [canEdit, evCard],
); );
function findTagByIdentifier(d: string) { function findTagByIdentifier(d: string) {
@ -51,7 +49,7 @@ export function Card({ canEdit, ev, cards }: CardProps) {
const [dropStyle, dropRef] = useDrop( const [dropStyle, dropRef] = useDrop(
() => ({ () => ({
accept: ["card"], accept: "card",
canDrop: () => { canDrop: () => {
return Boolean(canEdit); return Boolean(canEdit);
}, },
@ -62,13 +60,14 @@ export function Card({ canEdit, ev, cards }: CardProps) {
animation: isOvering ? "shake 0.1s 3" : "", animation: isOvering ? "shake 0.1s 3" : "",
}; };
}, },
hover: console.debug,
async drop(item) { async drop(item) {
const typed = item as CardItem; const typed = item as CardItem;
if (identifier === typed.identifier) { if (evCard.identifier === typed.identifier) {
return; return;
} }
const newItem = findTagByIdentifier(typed.identifier); const newItem = findTagByIdentifier(typed.identifier);
const oldItem = findTagByIdentifier(identifier); const oldItem = findTagByIdentifier(evCard.identifier);
const newTags = tags.map(t => { const newTags = tags.map(t => {
if (t === oldItem) { if (t === oldItem) {
return newItem; return newItem;
@ -93,12 +92,10 @@ export function Card({ canEdit, ev, cards }: CardProps) {
} }
}, },
}), }),
[canEdit, tags, identifier], [canEdit, tags, evCard],
); );
const card = ( const card = <CardPreview ref={dropRef} {...evCard} style={dropStyle} />;
<CardPreview ref={dropRef} title={title} link={link} image={image} content={content} style={dropStyle} />
);
if (canEdit) { if (canEdit) {
return ( return (
<div ref={dragRef} style={style}> <div ref={dragRef} style={style}>