feat: integrate SIWA API for support ticket feedback

Author: GiselleNessi

apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/support/_components/SupportCaseDetails.tsx

@@ -18,6 +18,7 @@ import { Button } from "@/components/ui/button";
 import { DynamicHeight } from "@/components/ui/DynamicHeight";
 import { Spinner } from "@/components/ui/Spinner/Spinner";
 import { AutoResizeTextarea } from "@/components/ui/textarea";
+import { useLocalStorage } from "@/hooks/useLocalStorage";
 import { cn } from "@/lib/utils";
 import { ThirdwebMiniLogo } from "../../../../../../components/ThirdwebMiniLogo";
 import { submitSupportFeedback } from "../apis/feedback";
@@ -33,10 +34,6 @@ interface SupportCaseDetailsProps {
   team: Team;
 }
 
-// Helper function to generate localStorage key for feedback submission
-const getFeedbackSubmittedKey = (ticketId: string) =>
-  `feedback_submitted_${ticketId}`;
-
 export function SupportCaseDetails({ ticket, team }: SupportCaseDetailsProps) {
   const [replyMessage, setReplyMessage] = useState("");
   const [isSubmittingReply, setIsSubmittingReply] = useState(false);
@@ -47,14 +44,11 @@ export function SupportCaseDetails({ ticket, team }: SupportCaseDetailsProps) {
   const [feedback, setFeedback] = useState("");
 
   // Check if feedback has already been submitted for this ticket
-  const [feedbackSubmitted, setFeedbackSubmitted] = useState(() => {
-    if (typeof window !== "undefined") {
-      return (
-        localStorage.getItem(getFeedbackSubmittedKey(ticket.id)) === "true"
-      );
-    }
-    return false;
-  });
+  const [feedbackSubmitted, setFeedbackSubmitted] = useLocalStorage(
+    `feedback_submitted_${ticket.id}`,
+    false,
+    false,
+  );
 
   const handleStarClick = (starIndex: number) => {
     setRating(starIndex + 1);
@@ -78,8 +72,7 @@ export function SupportCaseDetails({ ticket, team }: SupportCaseDetailsProps) {
         throw new Error(result.error);
       }
 
-      // Mark feedback as submitted in localStorage
-      localStorage.setItem(getFeedbackSubmittedKey(ticket.id), "true");
+      // Mark feedback as submitted
       setFeedbackSubmitted(true);
 
       toast.success("Thank you for your feedback!");
@@ -89,7 +82,7 @@ export function SupportCaseDetails({ ticket, team }: SupportCaseDetailsProps) {
       console.error("Failed to submit feedback:", error);
       toast.error("Failed to submit feedback. Please try again.");
     }
-  }, [rating, feedback, ticket.id, team.id]);
+  }, [rating, feedback, ticket.id, team.id, setFeedbackSubmitted]);
 
   const handleSendReply = async () => {
     if (!team.unthreadCustomerId) {

apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/support/apis/feedback.ts

@@ -1,5 +1,6 @@
+"use server";
+
 import { z } from "zod";
-import { getVercelEnv } from "@/utils/vercel";
 
 type SupportFeedbackInput = {
   ticketId: string;
@@ -18,34 +19,28 @@ const SupportFeedbackSchema = z.object({
 export async function submitSupportFeedback(
   data: SupportFeedbackInput,
 ): Promise<{ success: true } | { error: string }> {
-  "use server";
-
   const parsed = SupportFeedbackSchema.safeParse(data);
   if (!parsed.success) {
     return { error: parsed.error.issues.map((i) => i.message).join(", ") };
   }
   const input = parsed.data;
 
   try {
-    const apiKey = process.env.NEXT_PUBLIC_DASHBOARD_CLIENT_ID;
-    if (!apiKey) {
-      return { error: "NEXT_PUBLIC_DASHBOARD_CLIENT_ID not configured" };
+    const serviceKey = process.env.SERVICE_AUTH_KEY_SIWA;
+    if (!serviceKey) {
+      return { error: "SERVICE_AUTH_KEY_SIWA not configured" };
     }
 
-    // Use the main API host, not SIWA
-    const apiHost = process.env.NEXT_PUBLIC_THIRDWEB_API_HOST;
-    if (!apiHost) {
-      return { error: "NEXT_PUBLIC_THIRDWEB_API_HOST not configured" };
+    const apiUrl = process.env.NEXT_PUBLIC_SIWA_URL;
+    if (!apiUrl) {
+      return { error: "NEXT_PUBLIC_SIWA_URL not configured" };
     }
 
-    const vercelEnv = getVercelEnv();
-    const isPreview = vercelEnv === "preview" || vercelEnv === "development";
-
-    const response = await fetch(`${apiHost}/v1/csat/saveCSATFeedback`, {
+    const response = await fetch(`${apiUrl}/v1/csat/saveCSATFeedback`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
-        "x-service-api-key": apiKey,
+        "x-service-api-key": serviceKey,
       },
       body: JSON.stringify({
         rating: input.rating,
@@ -55,22 +50,8 @@ export async function submitSupportFeedback(
     });
 
     if (!response.ok) {
-      if (response.status === 404 && isPreview) {
-        // Only in preview/dev, simulate success if the endpoint isn't deployed yet
-        console.debug(
-          "CSAT endpoint not available; treating as success in preview/dev",
-          {
-            rating: input.rating,
-            ticket_id: input.ticketId,
-            vercel_env: vercelEnv,
-          },
-        );
-        await new Promise((resolve) => setTimeout(resolve, 300));
-        return { success: true };
-      }
-
       const errorText = await response.text();
-      console.error("❌ CSAT endpoint error:", {
+      console.error("CSAT feedback submission failed:", {
         status: response.status,
         statusText: response.statusText,
         error: errorText,