build: switch from yarn to npm to manage js dependencies and move js contents to root

yarn v1 is being deprecated and starts to have some issues

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

src/components/Participation/NewPrivateMessage.vue

@@ -0,0 +1,109 @@
+<template>
+  <form @submit="sendForm">
+    <Editor
+      v-model="text"
+      mode="basic"
+      :aria-label="t('Message body')"
+      v-if="currentActor"
+      :currentActor="currentActor"
+      :placeholder="t('Write a new message')"
+    />
+    <o-button class="mt-3" nativeType="submit">{{ t("Send") }}</o-button>
+  </form>
+</template>
+
+<script lang="ts" setup>
+import { useCurrentActorClient } from "@/composition/apollo/actor";
+import { SEND_EVENT_PRIVATE_MESSAGE_MUTATION } from "@/graphql/conversations";
+import { EVENT_CONVERSATIONS } from "@/graphql/event";
+import { IConversation } from "@/types/conversation";
+import { ParticipantRole } from "@/types/enums";
+import { IEvent } from "@/types/event.model";
+import { useMutation } from "@vue/apollo-composable";
+import { computed, defineAsyncComponent, ref } from "vue";
+import { useI18n } from "vue-i18n";
+
+const { t } = useI18n({ useScope: "global" });
+
+const props = defineProps<{
+  event: IEvent;
+}>();
+
+const event = computed(() => props.event);
+
+const text = ref("");
+const {
+  mutate: eventPrivateMessageMutate,
+  onDone: onEventPrivateMessageMutated,
+} = useMutation<
+  {
+    sendEventPrivateMessage: IConversation;
+  },
+  {
+    text: string;
+    actorId: string;
+    eventId: string;
+    roles?: string;
+    inReplyToActorId?: ParticipantRole[];
+    language?: string;
+  }
+>(SEND_EVENT_PRIVATE_MESSAGE_MUTATION, {
+  update(cache, result) {
+    if (!result.data?.sendEventPrivateMessage) return;
+    const cachedData = cache.readQuery<{
+      event: Pick<IEvent, "conversations" | "id" | "uuid">;
+    }>({
+      query: EVENT_CONVERSATIONS,
+      variables: {
+        uuid: event.value.uuid,
+        page: 1,
+      },
+    });
+    if (!cachedData) return;
+    cache.writeQuery({
+      query: EVENT_CONVERSATIONS,
+      variables: {
+        uuid: event.value.uuid,
+        page: 1,
+      },
+      data: {
+        event: {
+          ...cachedData?.event,
+          conversations: {
+            ...cachedData.event.conversations,
+            total: cachedData.event.conversations.total + 1,
+            elements: [
+              ...cachedData.event.conversations.elements,
+              result.data.sendEventPrivateMessage,
+            ],
+          },
+        },
+      },
+    });
+  },
+});
+
+const { currentActor } = useCurrentActorClient();
+
+const sendForm = (e: Event) => {
+  e.preventDefault();
+  console.debug("Sending new private message");
+  if (!currentActor.value?.id || !event.value.id) return;
+  eventPrivateMessageMutate({
+    text: text.value,
+    actorId:
+      event.value?.attributedTo?.id ??
+      event.value.organizerActor?.id ??
+      currentActor.value?.id,
+    eventId: event.value.id,
+  });
+};
+
+onEventPrivateMessageMutated(() => {
+  text.value = "";
+});
+
+const Editor = defineAsyncComponent(
+  () => import("../../components/TextEditor.vue")
+);
+</script>