From cd7f0f8f9bba706d83ec1daaa439d52912f3ff31 Mon Sep 17 00:00:00 2001
From: Michael Manganiello <adamantike@users.noreply.github.com>
Date: Sat, 28 Jun 2025 13:38:19 -0300
Subject: [PATCH] fix: Add debounce to RomUser changes

Stop bombarding the API with updates when editing personal data, like
notes (which currently trigger an API call on each keystroke), and
status (e.g. changing values on the "Completion %" slider triggers
an API call on each change).

This change introduces a debounce of 500ms before sending updates
to the API.
---
 frontend/src/components/Details/Personal.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/Details/Personal.vue b/frontend/src/components/Details/Personal.vue
index f4b0a50ef..ffd08b287 100644
--- a/frontend/src/components/Details/Personal.vue
+++ b/frontend/src/components/Details/Personal.vue
@@ -8,6 +8,7 @@ import type { RomUserStatus } from "@/__generated__";
 import { getTextForStatus, getEmojiForStatus } from "@/utils";
 import { MdEditor, MdPreview } from "md-editor-v3";
 import "md-editor-v3/lib/style.css";
+import { debounce } from "lodash";
 import { ref, watch } from "vue";
 import { useDisplay, useTheme } from "vuetify";
 import { useI18n } from "vue-i18n";
@@ -56,14 +57,14 @@ watch(
 
 watch(
   romUser,
-  () => {
+  debounce(() => {
     if (scopes.value.includes("roms.user.write")) {
       romApi.updateUserRomProps({
         romId: props.rom.id,
         data: romUser.value,
       });
     }
-  },
+  }, 500),
   { deep: true },
 );
 </script>