Implement debounced message

src/mixins/ImportJsonState.ts

@@ -8,7 +8,7 @@ import { EvenementStateJSON } from "@/store/State";
 import { Ressource } from "jc-timeline";
 import { defineComponent } from "vue";
 
-const keyofEvent: Array<keyof Evenement> = ["name", "uuid", "start", "end"];
+const keyofEvent: Array<keyof Evenement> = ["uuid", "name", "start", "end"];
 
 export default defineComponent({
   methods: {

src/store/Actions.ts

@@ -6,12 +6,26 @@ import PlanningUpdateMessage from "@/models/messages/PlanningUpdateMessage";
 import Benevole from "@/models/Benevole";
 import Competence from "@/models/Competence";
 import { IRessource, Ressource } from "jc-timeline";
+import debounce from "lodash-es/debounce";
+import Stomp from "stompjs";
 
 export enum ActionTypes {
   superCommit = "superComit",
   commitRemote = "commitRemote",
 }
 
+type EDIT_MUTATION =
+  | MutationTypes.editBenevole
+  | MutationTypes.editConstraint
+  | MutationTypes.editCreneau
+  | MutationTypes.editCreneauGroup;
+const EDIT_PAYLOAD = [
+  MutationTypes.editBenevole,
+  MutationTypes.editConstraint,
+  MutationTypes.editCreneau,
+  MutationTypes.editCreneauGroup,
+  MutationTypes.editEvenement,
+];
 const RAW_PAYLOAD = [
   MutationTypes.addBenevole2Creneau,
   MutationTypes.removeBenevole2Creneau,
@@ -20,11 +34,7 @@ const RAW_PAYLOAD = [
   MutationTypes.removeConstraint,
   MutationTypes.removeCreneau,
   MutationTypes.removeCreneauGroup,
-  MutationTypes.editBenevole,
-  MutationTypes.editConstraint,
-  MutationTypes.editCreneau,
-  MutationTypes.editCreneauGroup,
-  MutationTypes.editEvenement,
+  ...EDIT_PAYLOAD,
 ];
 const JSON_PAYLOAD = [
   MutationTypes.addBenevole,
@@ -43,35 +53,62 @@ type AugmentedActionContext = {
 export interface Actions {
   [ActionTypes.superCommit]<K extends keyof Mutations>(
     context: AugmentedActionContext,
-    payload: { mutation: K; payload: Parameters<Mutations[K]>[1] }
+    data: { mutation: K; payload: Parameters<Mutations[K]>[1] }
   ): void;
   [ActionTypes.commitRemote](context: AugmentedActionContext, payload: PlanningUpdateMessage): void;
 }
 
+let editCommit: { [key: string]: PlanningUpdateMessage } = {};
+const sendCommitsDebounced = debounce((client: Stomp.Client) => {
+  const l = Object.values(editCommit);
+  editCommit = {};
+  l.forEach((msg) => client.send("/app/notify", {}, JSON.stringify(msg)));
+}, 500);
 export const actions: ActionTree<State, State> & Actions = {
-  [ActionTypes.superCommit](context, payload) {
-    context.commit(payload.mutation, payload.payload);
+  [ActionTypes.superCommit](context, data) {
+    context.commit(data.mutation, data.payload);
     const client = context.state.stompClient;
     if (client?.connected) {
       const body: PlanningUpdateMessage = {
-        method: payload.mutation,
+        method: data.mutation,
         user: context.state.username,
         uuid: context.state.evenement.uuid,
         payload: "",
       };
-      if (RAW_PAYLOAD.includes(payload.mutation)) {
-        body.payload = JSON.stringify(payload.payload);
+      // Prepare payload
+      if (RAW_PAYLOAD.includes(data.mutation)) {
+        body.payload = JSON.stringify(data.payload);
       }
-      if (JSON_PAYLOAD.includes(payload.mutation)) {
-        const content = payload.payload as Benevole | Competence | Creneau | Ressource;
+      if (JSON_PAYLOAD.includes(data.mutation)) {
+        const content = data.payload as Benevole | Competence | Creneau | Ressource;
         body.payload = JSON.stringify(content.toJSON());
       }
-      if (payload.mutation == MutationTypes.addCreneauGroupAt) {
-        const content = payload.payload as { r: Ressource; pos: number };
+      if (data.mutation == MutationTypes.addCreneauGroupAt) {
+        const content = data.payload as { r: Ressource; pos: number };
         body.payload = JSON.stringify({ r: content.r.toJSON(), pos: content.pos });
       }
-      if (body.payload != "" || payload.mutation == MutationTypes.clearBenevole2Creneau)
+
+      // Prepare payload
+      if (
+        data.mutation === MutationTypes.editBenevole ||
+        data.mutation === MutationTypes.editConstraint ||
+        data.mutation === MutationTypes.editCreneau ||
+        data.mutation === MutationTypes.editCreneauGroup
+      ) {
+        const content = data.payload as Parameters<Mutations[EDIT_MUTATION]>[1];
+        const key = data.mutation + content.field + content.id;
+        editCommit[key] = body;
+        sendCommitsDebounced(client);
+      } else if (data.mutation === MutationTypes.editEvenement) {
+        const content = data.payload as Parameters<Mutations[MutationTypes.editEvenement]>[1];
+        if (content.field !== "uuid") {
+          const key = data.mutation + content.field;
+          editCommit[key] = body;
+          sendCommitsDebounced(client);
+        }
+      } else if (body.payload != "" || data.mutation == MutationTypes.clearBenevole2Creneau) {
         client.send("/app/notify", {}, JSON.stringify(body));
+      }
     }
   },
   [ActionTypes.commitRemote](context, data) {