fix(feedback): rate limit feedback to 4 submissions per minute based on

feedbackId

Author: fabianrbz

app/_assets/javascripts/apps/Feedback.vue

@@ -16,12 +16,16 @@
         </button>
       </div>
 
-      <p v-if="vote !== null" class="feedback__reply text-sm text-terciary flex">
+      <p v-if="vote !== null && !isRateLimited" class="feedback__reply text-sm text-terciary flex">
         Thank you! We received your feedback.
       </p>
 
+      <p v-if="isRateLimited" class="feedback__reply text-sm text-terciary flex">
+        {{ rateLimitMessage }}
+      </p>
+
       <form
-        v-if="vote === false"
+        v-if="vote === false && !isRateLimited"
         class="flex flex-col gap-2 w-full"
         @submit.prevent="handleSubmit"
       >
@@ -49,30 +53,43 @@
   const message = ref('');
   const feedbackId = ref(null);
   const isSubmitting = ref(false);
+  const isRateLimited = ref(false);
+  const rateLimitMessage = ref('');
 
-  function handleVote(val) {
+  async function handleVote(val) {
     if (isSubmitting.value) { return };
 
     vote.value = val;
     isSubmitting.value = true;
 
-    fetch('/.netlify/functions/feedback-create', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        pageUrl: window.location.href,
-        feedbackId: feedbackId.value,
-        vote: val
-      })
-    })
-      .then((res) => res.json())
-      .then((data) => {
-        feedbackId.value ||= data.feedbackId;
-        console.log('create callback')
-        console.log(`id: ${feedbackId.value}`)
+
+    try {
+      const res = await fetch('/.netlify/functions/feedback-create', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          pageUrl: window.location.href,
+          feedbackId: feedbackId.value,
+          vote: val,
+        }),
       })
-      .catch((err) => console.error('Feedback error:', err))
-      .finally(() => { isSubmitting.value = false; });
+
+      if (res.status === 429) {
+        const data = await res.json()
+        isRateLimited.value = true
+        rateLimitMessage.value = data.error || 'Too many requests. Please wait.'
+        return
+      }
+
+      const data = await res.json()
+      feedbackId.value ||= data.feedbackId
+      isRateLimited.value = false
+      rateLimitMessage.value = ''
+    } catch (err) {
+      console.error('Feedback error:', err)
+    } finally {
+      isSubmitting.value = false;
+    }
   }
 
   function handleSubmit() {

netlify/functions/feedback-create.mjs

@@ -23,6 +23,26 @@ async function sendDataToSlack(url, vote, id, webhookUrl) {
   }
 }
 
+const recentSubmissions = new Map();
+const RATE_LIMIT_MS = 60 * 1_000;
+const MAX_SUBMISSIONS = 4;
+
+function isRateLimited(id, now) {
+  for (const [submissionId, timestamps] of recentSubmissions) {
+    const validTimestamps = timestamps.filter(
+      (time) => now - time <= RATE_LIMIT_MS
+    );
+    if (validTimestamps.length === 0) {
+      recentSubmissions.delete(submissionId);
+    } else {
+      recentSubmissions.set(submissionId, validTimestamps);
+    }
+  }
+
+  const timestamps = recentSubmissions.get(id) || [];
+  return timestamps.length >= MAX_SUBMISSIONS;
+}
+
 export async function handler(event, context) {
   const webhookUrl = process.env.SLACK_WEBHOOK_URL;
   let connection;
@@ -60,6 +80,26 @@ export async function handler(event, context) {
       id = feedbackId;
     }
 
+    const now = Date.now();
+    if (isRateLimited(id, now)) {
+      const timestamps = recentSubmissions.get(id) || [];
+      const oldestSubmission = Math.min(...timestamps);
+      const remaining = Math.ceil(
+        (RATE_LIMIT_MS - (now - oldestSubmission)) / 1000
+      );
+      return {
+        statusCode: 429,
+        body: JSON.stringify({
+          error: `Rate limit exceeded. Try again in ${remaining} seconds.`,
+        }),
+        headers: { "Content-Type": "application/json" },
+      };
+    }
+
+    const timestamps = recentSubmissions.get(id) || [];
+    timestamps.push(now);
+    recentSubmissions.set(id, timestamps);
+
     const url = new URL(pageUrl);
     url.hash = "";