2023-09-02 01:27:33 +02:00
|
|
|
|
import type { Ref } from "vue";
|
|
|
|
|
import { onUnmounted } from "vue";
|
2024-02-12 16:40:46 +01:00
|
|
|
|
import type { entities } from "firefish-js";
|
2024-02-29 14:21:19 +01:00
|
|
|
|
import { useStream } from "@/stream";
|
2024-03-16 16:49:12 +01:00
|
|
|
|
import { isSignedIn, me } from "@/me";
|
2023-05-02 14:42:33 +02:00
|
|
|
|
import * as os from "@/os";
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
|
|
|
|
export function useNoteCapture(props: {
|
2024-04-12 10:37:32 +02:00
|
|
|
|
rootEl: Ref<HTMLElement | null>;
|
2024-02-12 16:40:46 +01:00
|
|
|
|
note: Ref<entities.Note>;
|
2022-02-11 13:35:28 +01:00
|
|
|
|
isDeletedRef: Ref<boolean>;
|
2024-04-20 14:55:47 +02:00
|
|
|
|
onReplied?: (note: entities.Note) => void;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}) {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
const note = props.note;
|
2024-04-22 04:32:41 +02:00
|
|
|
|
const connection = isSignedIn(me) ? useStream() : null;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2023-05-02 14:42:33 +02:00
|
|
|
|
async function onStreamNoteUpdated(noteData): Promise<void> {
|
2022-05-07 07:19:15 +02:00
|
|
|
|
const { type, id, body } = noteData;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2022-02-11 13:35:28 +01:00
|
|
|
|
if (id !== note.value.id) return;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
|
|
|
|
switch (type) {
|
2024-04-20 14:55:47 +02:00
|
|
|
|
case "replied": {
|
2024-04-24 08:02:37 +02:00
|
|
|
|
note.value.repliesCount += 1;
|
2024-04-20 14:55:47 +02:00
|
|
|
|
if (props.onReplied) {
|
|
|
|
|
const { id: createdId } = body;
|
|
|
|
|
const replyNote = await os.api("notes/show", {
|
|
|
|
|
noteId: createdId,
|
|
|
|
|
});
|
|
|
|
|
props.onReplied(replyNote);
|
|
|
|
|
}
|
|
|
|
|
break;
|
|
|
|
|
}
|
2023-01-13 05:40:33 +01:00
|
|
|
|
case "reacted": {
|
2022-01-14 02:25:51 +01:00
|
|
|
|
const reaction = body.reaction;
|
|
|
|
|
|
|
|
|
|
if (body.emoji) {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
const emojis = note.value.emojis || [];
|
2022-01-14 02:25:51 +01:00
|
|
|
|
if (!emojis.includes(body.emoji)) {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
note.value.emojis = [...emojis, body.emoji];
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// TODO: reactionsプロパティがない場合ってあったっけ? なければ || {} は消せる
|
2023-01-13 05:40:33 +01:00
|
|
|
|
const currentCount = note.value.reactions?.[reaction] || 0;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2022-02-11 13:35:28 +01:00
|
|
|
|
note.value.reactions[reaction] = currentCount + 1;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2024-04-22 04:32:41 +02:00
|
|
|
|
if (isSignedIn(me) && body.userId === me.id) {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
note.value.myReaction = reaction;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
|
2023-01-13 05:40:33 +01:00
|
|
|
|
case "unreacted": {
|
2022-01-14 02:25:51 +01:00
|
|
|
|
const reaction = body.reaction;
|
|
|
|
|
|
|
|
|
|
// TODO: reactionsプロパティがない場合ってあったっけ? なければ || {} は消せる
|
2023-01-13 05:40:33 +01:00
|
|
|
|
const currentCount = note.value.reactions?.[reaction] || 0;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2022-02-11 13:35:28 +01:00
|
|
|
|
note.value.reactions[reaction] = Math.max(0, currentCount - 1);
|
2022-01-14 02:25:51 +01:00
|
|
|
|
|
2024-04-22 04:32:41 +02:00
|
|
|
|
if (isSignedIn(me) && body.userId === me.id) {
|
2023-05-02 14:42:33 +02:00
|
|
|
|
note.value.myReaction = undefined;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
|
2023-01-13 05:40:33 +01:00
|
|
|
|
case "pollVoted": {
|
2022-01-14 02:25:51 +01:00
|
|
|
|
const choice = body.choice;
|
|
|
|
|
|
2023-05-02 14:42:33 +02:00
|
|
|
|
if (note.value.poll) {
|
|
|
|
|
const choices = [...note.value.poll.choices];
|
|
|
|
|
choices[choice] = {
|
|
|
|
|
...choices[choice],
|
|
|
|
|
votes: choices[choice].votes + 1,
|
2024-04-22 04:32:41 +02:00
|
|
|
|
...(isSignedIn(me) && body.userId === me.id
|
2023-05-02 14:42:33 +02:00
|
|
|
|
? {
|
|
|
|
|
isVoted: true,
|
2024-03-28 06:25:33 +01:00
|
|
|
|
}
|
2023-05-02 14:42:33 +02:00
|
|
|
|
: {}),
|
|
|
|
|
};
|
|
|
|
|
note.value.poll.choices = choices;
|
|
|
|
|
}
|
|
|
|
|
|
2022-01-14 02:25:51 +01:00
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
|
2023-01-13 05:40:33 +01:00
|
|
|
|
case "deleted": {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
props.isDeletedRef.value = true;
|
2022-01-14 02:25:51 +01:00
|
|
|
|
break;
|
|
|
|
|
}
|
2023-05-02 14:42:33 +02:00
|
|
|
|
|
|
|
|
|
case "updated": {
|
2024-02-21 00:42:12 +01:00
|
|
|
|
try {
|
|
|
|
|
const editedNote = await os.api("notes/show", {
|
|
|
|
|
noteId: id,
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const keys = new Set<string>();
|
|
|
|
|
Object.keys(editedNote)
|
|
|
|
|
.concat(Object.keys(note.value))
|
|
|
|
|
.forEach((key) => keys.add(key));
|
|
|
|
|
keys.forEach((key) => {
|
|
|
|
|
note.value[key] = editedNote[key];
|
|
|
|
|
});
|
|
|
|
|
} catch {
|
|
|
|
|
// delete the note if failing to get the edited note
|
|
|
|
|
props.isDeletedRef.value = true;
|
|
|
|
|
}
|
2023-05-02 14:42:33 +02:00
|
|
|
|
break;
|
|
|
|
|
}
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function capture(withHandler = false): void {
|
|
|
|
|
if (connection) {
|
|
|
|
|
// TODO: このノートがストリーミング経由で流れてきた場合のみ sr する
|
2023-01-13 05:40:33 +01:00
|
|
|
|
connection.send(document.body.contains(props.rootEl.value) ? "sr" : "s", {
|
|
|
|
|
id: note.value.id,
|
|
|
|
|
});
|
|
|
|
|
if (withHandler) connection.on("noteUpdated", onStreamNoteUpdated);
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function decapture(withHandler = false): void {
|
|
|
|
|
if (connection) {
|
2023-01-13 05:40:33 +01:00
|
|
|
|
connection.send("un", {
|
2022-02-11 13:35:28 +01:00
|
|
|
|
id: note.value.id,
|
2022-01-14 02:25:51 +01:00
|
|
|
|
});
|
2023-01-13 05:40:33 +01:00
|
|
|
|
if (withHandler) connection.off("noteUpdated", onStreamNoteUpdated);
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onStreamConnected() {
|
|
|
|
|
capture(false);
|
|
|
|
|
}
|
2023-01-13 05:40:33 +01:00
|
|
|
|
|
2022-01-14 02:25:51 +01:00
|
|
|
|
capture(true);
|
|
|
|
|
if (connection) {
|
2023-01-13 05:40:33 +01:00
|
|
|
|
connection.on("_connected_", onStreamConnected);
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
2023-01-13 05:40:33 +01:00
|
|
|
|
|
2022-01-14 02:25:51 +01:00
|
|
|
|
onUnmounted(() => {
|
|
|
|
|
decapture(true);
|
|
|
|
|
if (connection) {
|
2023-01-13 05:40:33 +01:00
|
|
|
|
connection.off("_connected_", onStreamConnected);
|
2022-01-14 02:25:51 +01:00
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|