removes updateLocalSurveyStatus prop from SurveyStatusDropdown component

Co-authored-by: Dhruwang <dhruwangjariwala18@gmail.com>

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/components/SurveyAnalysisNavigation.tsx

@@ -3,25 +3,22 @@
 import { InboxIcon, PresentationIcon } from "lucide-react";
 import { usePathname } from "next/navigation";
 import { useTranslation } from "react-i18next";
-import { TSurvey } from "@formbricks/types/surveys/types";
+import { useEnvironment } from "@/app/(app)/environments/[environmentId]/context/environment-context";
 import { revalidateSurveyIdPath } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/actions";
+import { useSurvey } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/context/survey-context";
 import { SecondaryNavigation } from "@/modules/ui/components/secondary-navigation";
 
 interface SurveyAnalysisNavigationProps {
-  environmentId: string;
-  survey: TSurvey;
   activeId: string;
 }
 
-export const SurveyAnalysisNavigation = ({
-  environmentId,
-  survey,
-  activeId,
-}: SurveyAnalysisNavigationProps) => {
+export const SurveyAnalysisNavigation = ({ activeId }: SurveyAnalysisNavigationProps) => {
   const pathname = usePathname();
   const { t } = useTranslation();
+  const { environment } = useEnvironment();
+  const { survey } = useSurvey();
 
-  const url = `/environments/${environmentId}/surveys/${survey.id}`;
+  const url = `/environments/${environment.id}/surveys/${survey.id}`;
 
   const navigation = [
     {
@@ -31,7 +28,7 @@ export const SurveyAnalysisNavigation = ({
       href: `${url}/summary?referer=true`,
       current: pathname?.includes("/summary"),
       onClick: () => {
-        revalidateSurveyIdPath(environmentId, survey.id);
+        revalidateSurveyIdPath(environment.id, survey.id);
       },
     },
     {
@@ -41,7 +38,7 @@ export const SurveyAnalysisNavigation = ({
       href: `${url}/responses?referer=true`,
       current: pathname?.includes("/responses"),
       onClick: () => {
-        revalidateSurveyIdPath(environmentId, survey.id);
+        revalidateSurveyIdPath(environment.id, survey.id);
       },
     },
   ];

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/responses/page.tsx

@@ -64,8 +64,6 @@ const Page = async (props: { params: Promise<{ environmentId: string; surveyId:
         pageTitle={survey.name}
         cta={
           <SurveyAnalysisCTA
-            environment={environment}
-            survey={survey}
             isReadOnly={isReadOnly}
             user={user}
             publicDomain={publicDomain}
@@ -76,7 +74,7 @@ const Page = async (props: { params: Promise<{ environmentId: string; surveyId:
             isStorageConfigured={IS_STORAGE_CONFIGURED}
           />
         }>
-        <SurveyAnalysisNavigation environmentId={environment.id} survey={survey} activeId="responses" />
+        <SurveyAnalysisNavigation activeId="responses" />
       </PageHeader>
       <ResponsePage
         environment={environment}

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SuccessMessage.tsx

@@ -4,16 +4,13 @@ import { useSearchParams } from "next/navigation";
 import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
-import { TEnvironment } from "@formbricks/types/environment";
-import { TSurvey } from "@formbricks/types/surveys/types";
+import { useEnvironment } from "@/app/(app)/environments/[environmentId]/context/environment-context";
+import { useSurvey } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/context/survey-context";
 import { Confetti } from "@/modules/ui/components/confetti";
 
-interface SummaryMetadataProps {
-  environment: TEnvironment;
-  survey: TSurvey;
-}
-
-export const SuccessMessage = ({ environment, survey }: SummaryMetadataProps) => {
+export const SuccessMessage = () => {
+  const { environment } = useEnvironment();
+  const { survey } = useSurvey();
   const { t } = useTranslation();
   const searchParams = useSearchParams();
   const [confetti, setConfetti] = useState(false);

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SurveyAnalysisCTA.tsx

@@ -5,14 +5,13 @@ import { usePathname, useRouter, useSearchParams } from "next/navigation";
 import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
-import { TEnvironment } from "@formbricks/types/environment";
 import { TSegment } from "@formbricks/types/segment";
-import { TSurvey } from "@formbricks/types/surveys/types";
 import { TUser } from "@formbricks/types/user";
 import { useEnvironment } from "@/app/(app)/environments/[environmentId]/context/environment-context";
 import { SuccessMessage } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SuccessMessage";
 import { ShareSurveyModal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/share-survey-modal";
 import { SurveyStatusDropdown } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/components/SurveyStatusDropdown";
+import { useSurvey } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/context/survey-context";
 import { getFormattedErrorMessage } from "@/lib/utils/helper";
 import { EditPublicSurveyAlertDialog } from "@/modules/survey/components/edit-public-survey-alert-dialog";
 import { useSingleUseId } from "@/modules/survey/hooks/useSingleUseId";
@@ -23,8 +22,6 @@ import { IconBar } from "@/modules/ui/components/iconbar";
 import { resetSurveyAction } from "../actions";
 
 interface SurveyAnalysisCTAProps {
-  survey: TSurvey;
-  environment: TEnvironment;
   isReadOnly: boolean;
   user: TUser;
   publicDomain: string;
@@ -41,8 +38,6 @@ interface ModalState {
 }
 
 export const SurveyAnalysisCTA = ({
-  survey,
-  environment,
   isReadOnly,
   user,
   publicDomain,
@@ -64,7 +59,8 @@ export const SurveyAnalysisCTA = ({
   const [isResetModalOpen, setIsResetModalOpen] = useState(false);
   const [isResetting, setIsResetting] = useState(false);
 
-  const { project } = useEnvironment();
+  const { environment, project } = useEnvironment();
+  const { survey } = useSurvey();
   const { refreshSingleUseId } = useSingleUseId(survey, isReadOnly);
 
   const appSetupCompleted = survey.type === "app" && environment.appSetupCompleted;
@@ -183,7 +179,7 @@ export const SurveyAnalysisCTA = ({
   return (
     <div className="hidden justify-end gap-x-1.5 sm:flex">
       {!isReadOnly && (appSetupCompleted || survey.type === "link") && survey.status !== "draft" && (
-        <SurveyStatusDropdown environment={environment} survey={survey} />
+        <SurveyStatusDropdown />
       )}
 
       <IconBar actions={iconActions} />
@@ -215,7 +211,7 @@ export const SurveyAnalysisCTA = ({
           projectCustomScripts={project.customHeadScripts}
         />
       )}
-      <SuccessMessage environment={environment} survey={survey} />
+      <SuccessMessage />
 
       {responseCount > 0 && (
         <EditPublicSurveyAlertDialog

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/page.tsx

@@ -66,8 +66,6 @@ const SurveyPage = async (props: { params: Promise<{ environmentId: string; surv
         pageTitle={survey.name}
         cta={
           <SurveyAnalysisCTA
-            environment={environment}
-            survey={survey}
             isReadOnly={isReadOnly}
             user={user}
             publicDomain={publicDomain}
@@ -78,7 +76,7 @@ const SurveyPage = async (props: { params: Promise<{ environmentId: string; surv
             isStorageConfigured={IS_STORAGE_CONFIGURED}
           />
         }>
-        <SurveyAnalysisNavigation environmentId={environment.id} survey={survey} activeId="summary" />
+        <SurveyAnalysisNavigation activeId="summary" />
       </PageHeader>
       <SummaryPage
         environment={environment}

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/components/SurveyStatusDropdown.tsx

@@ -3,8 +3,9 @@
 import { useRouter } from "next/navigation";
 import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
-import { TEnvironment } from "@formbricks/types/environment";
 import { TSurvey } from "@formbricks/types/surveys/types";
+import { useEnvironment } from "@/app/(app)/environments/[environmentId]/context/environment-context";
+import { useSurvey } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/context/survey-context";
 import { getFormattedErrorMessage } from "@/lib/utils/helper";
 import { updateSurveyAction } from "@/modules/survey/editor/actions";
 import {
@@ -16,17 +17,9 @@ import {
 } from "@/modules/ui/components/select";
 import { SurveyStatusIndicator } from "@/modules/ui/components/survey-status-indicator";
 
-interface SurveyStatusDropdownProps {
-  environment: TEnvironment;
-  updateLocalSurveyStatus?: (status: TSurvey["status"]) => void;
-  survey: TSurvey;
-}
-
-export const SurveyStatusDropdown = ({
-  environment,
-  updateLocalSurveyStatus,
-  survey,
-}: SurveyStatusDropdownProps) => {
+export const SurveyStatusDropdown = () => {
+  const { environment } = useEnvironment();
+  const { survey } = useSurvey();
   const { t } = useTranslation();
   const router = useRouter();
 
@@ -46,10 +39,6 @@ export const SurveyStatusDropdown = ({
         toast.success(toastMessage);
       }
 
-      if (updateLocalSurveyStatus) {
-        updateLocalSurveyStatus(resultingStatus);
-      }
-
       router.refresh();
     } else {
       const errorMessage = getFormattedErrorMessage(updateSurveyActionResponse);

apps/web/app/api/v2/client/[environmentId]/responses/lib/response.test.ts

@@ -2,7 +2,7 @@ import { Prisma } from "@prisma/client";
 import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
 import { prisma } from "@formbricks/database";
 import { TContactAttributes } from "@formbricks/types/contact-attribute";
-import { DatabaseError, ResourceNotFoundError } from "@formbricks/types/errors";
+import { DatabaseError, ResourceNotFoundError, UniqueConstraintError } from "@formbricks/types/errors";
 import { TResponseWithQuotaFull, TSurveyQuota } from "@formbricks/types/quota";
 import { TResponse } from "@formbricks/types/responses";
 import { TTag } from "@formbricks/types/tags";
@@ -175,10 +175,34 @@ describe("createResponse V2", () => {
     ).rejects.toThrow(ResourceNotFoundError);
   });
 
-  test("should throw DatabaseError on Prisma known request error", async () => {
-    const prismaError = new Prisma.PrismaClientKnownRequestError("Test Prisma Error", {
+  test("should throw UniqueConstraintError on P2002 with singleUseId target", async () => {
+    const prismaError = new Prisma.PrismaClientKnownRequestError("Unique constraint failed", {
       code: "P2002",
       clientVersion: "test",
+      meta: { target: ["surveyId", "singleUseId"] },
+    });
+    vi.mocked(mockTx.response.create).mockRejectedValue(prismaError);
+    await expect(
+      createResponse(mockResponseInput, mockTx as unknown as Prisma.TransactionClient)
+    ).rejects.toThrow(UniqueConstraintError);
+  });
+
+  test("should throw DatabaseError on P2002 without singleUseId target", async () => {
+    const prismaError = new Prisma.PrismaClientKnownRequestError("Unique constraint failed", {
+      code: "P2002",
+      clientVersion: "test",
+      meta: { target: ["displayId"] },
+    });
+    vi.mocked(mockTx.response.create).mockRejectedValue(prismaError);
+    await expect(
+      createResponse(mockResponseInput, mockTx as unknown as Prisma.TransactionClient)
+    ).rejects.toThrow(DatabaseError);
+  });
+
+  test("should throw DatabaseError on non-P2002 Prisma known request error", async () => {
+    const prismaError = new Prisma.PrismaClientKnownRequestError("Test Prisma Error", {
+      code: "P2025",
+      clientVersion: "test",
     });
     vi.mocked(mockTx.response.create).mockRejectedValue(prismaError);
     await expect(

apps/web/app/api/v2/client/[environmentId]/responses/lib/response.ts

@@ -2,7 +2,7 @@ import "server-only";
 import { Prisma } from "@prisma/client";
 import { prisma } from "@formbricks/database";
 import { TContactAttributes } from "@formbricks/types/contact-attribute";
-import { DatabaseError, ResourceNotFoundError } from "@formbricks/types/errors";
+import { DatabaseError, ResourceNotFoundError, UniqueConstraintError } from "@formbricks/types/errors";
 import { TResponseWithQuotaFull } from "@formbricks/types/quota";
 import { TResponse, ZResponseInput } from "@formbricks/types/responses";
 import { TTag } from "@formbricks/types/tags";
@@ -129,6 +129,13 @@ export const createResponse = async (
     return response;
   } catch (error) {
     if (error instanceof Prisma.PrismaClientKnownRequestError) {
+      if (error.code === "P2002") {
+        const target = (error.meta?.target as string[]) ?? [];
+        if (target?.includes("singleUseId")) {
+          throw new UniqueConstraintError("Response already submitted for this single-use link");
+        }
+      }
+
       throw new DatabaseError(error.message);
     }
 

apps/web/app/api/v2/client/[environmentId]/responses/route.ts

@@ -1,6 +1,6 @@
 import { UAParser } from "ua-parser-js";
 import { ZEnvironmentId } from "@formbricks/types/environment";
-import { InvalidInputError } from "@formbricks/types/errors";
+import { InvalidInputError, UniqueConstraintError } from "@formbricks/types/errors";
 import { TResponseWithQuotaFull } from "@formbricks/types/quota";
 import { checkSurveyValidity } from "@/app/api/v2/client/[environmentId]/responses/lib/utils";
 import { reportApiError } from "@/app/lib/api/api-error-reporter";
@@ -177,6 +177,10 @@ const createResponseForRequest = async ({
       return responses.badRequestResponse(error.message, undefined, true);
     }
 
+    if (error instanceof UniqueConstraintError) {
+      return responses.conflictResponse(error.message, undefined, true);
+    }
+
     const response = getUnexpectedPublicErrorResponse();
     reportApiError({
       request,

apps/web/app/lib/api/response.test.ts

@@ -339,6 +339,56 @@ describe("API Response Utilities", () => {
     });
   });
 
+  describe("conflictResponse", () => {
+    test("should return a conflict response", () => {
+      const message = "Resource already exists";
+      const details = { field: "singleUseId" };
+      const response = responses.conflictResponse(message, details);
+
+      expect(response.status).toBe(409);
+
+      return response.json().then((body) => {
+        expect(body).toEqual({
+          code: "conflict",
+          message,
+          details,
+        });
+      });
+    });
+
+    test("should handle undefined details", () => {
+      const message = "Resource already exists";
+      const response = responses.conflictResponse(message);
+
+      expect(response.status).toBe(409);
+
+      return response.json().then((body) => {
+        expect(body).toEqual({
+          code: "conflict",
+          message,
+          details: {},
+        });
+      });
+    });
+
+    test("should include CORS headers when cors is true", () => {
+      const message = "Resource already exists";
+      const response = responses.conflictResponse(message, undefined, true);
+
+      expect(response.headers.get("Access-Control-Allow-Origin")).toBe("*");
+      expect(response.headers.get("Access-Control-Allow-Methods")).toBe("GET, POST, PUT, DELETE, OPTIONS");
+      expect(response.headers.get("Access-Control-Allow-Headers")).toBe("Content-Type, Authorization");
+    });
+
+    test("should use custom cache control header when provided", () => {
+      const message = "Resource already exists";
+      const customCache = "no-cache";
+      const response = responses.conflictResponse(message, undefined, false, customCache);
+
+      expect(response.headers.get("Cache-Control")).toBe(customCache);
+    });
+  });
+
   describe("tooManyRequestsResponse", () => {
     test("should return a too many requests response", () => {
       const message = "Rate limit exceeded";

apps/web/app/lib/api/response.ts

@@ -16,7 +16,8 @@ interface ApiErrorResponse {
     | "method_not_allowed"
     | "not_authenticated"
     | "forbidden"
-    | "too_many_requests";
+    | "too_many_requests"
+    | "conflict";
   message: string;
   details: {
     [key: string]: string | string[] | number | number[] | boolean | boolean[];
@@ -236,6 +237,30 @@ const internalServerErrorResponse = (
   );
 };
 
+const conflictResponse = (
+  message: string,
+  details?: { [key: string]: string },
+  cors: boolean = false,
+  cache: string = "private, no-store"
+) => {
+  const headers = {
+    ...(cors && corsHeaders),
+    "Cache-Control": cache,
+  };
+
+  return Response.json(
+    {
+      code: "conflict",
+      message,
+      details: details || {},
+    } as ApiErrorResponse,
+    {
+      status: 409,
+      headers,
+    }
+  );
+};
+
 const tooManyRequestsResponse = (
   message: string,
   cors: boolean = false,
@@ -270,4 +295,5 @@ export const responses = {
   successResponse,
   tooManyRequestsResponse,
   forbiddenResponse,
+  conflictResponse,
 };

apps/web/modules/api/v2/organizations/[organizationId]/users/lib/tests/users.test.ts

@@ -98,14 +98,11 @@ describe("Users Lib", () => {
 
     test("returns conflict error if user with email already exists", async () => {
       (prisma.user.create as any).mockRejectedValueOnce(
-        new Prisma.PrismaClientKnownRequestError(
-          "Unique constraint failed on the fields: (`email`)",
-          {
-            code: PrismaErrorType.UniqueConstraintViolation,
-            clientVersion: "1.0.0",
-            meta: { target: ["email"] },
-          }
-        )
+        new Prisma.PrismaClientKnownRequestError("Unique constraint failed on the fields: (`email`)", {
+          code: PrismaErrorType.UniqueConstraintViolation,
+          clientVersion: "1.0.0",
+          meta: { target: ["email"] },
+        })
       );
       const result = await createUser(
         { name: "Duplicate", email: "test@example.com", role: "member" },

apps/web/modules/ee/sso/components/open-id-button.tsx

@@ -46,9 +46,9 @@ export const OpenIdButton = ({
       type="button"
       onClick={handleLogin}
       variant="secondary"
-      className="relative w-full justify-center">
-      {text ? text : t("auth.continue_with_openid")}
-      {lastUsed && <span className="absolute right-3 text-xs opacity-50">{t("auth.last_used")}</span>}
+      className="w-full items-center justify-center gap-2 px-2">
+      <span className="truncate">{text || t("auth.continue_with_openid")}</span>
+      {lastUsed && <span className="shrink-0 text-xs opacity-50">{t("auth.last_used")}</span>}
     </Button>
   );
 };

packages/surveys/postcss.config.cjs

@@ -1,5 +1,6 @@
-// basic regex -- [whitespace](number)(rem)[whitespace or ;]
-const REM_REGEX = /\b(\d+(\.\d+)?)(rem)\b/gi;
+// Matches a CSS numeric value followed by "rem" — e.g. "1rem", "1.5rem", "16rem".
+// Single character-class + single quantifier: no nested quantifiers, no backtracking risk.
+const REM_REGEX = /([\d.]+)(rem)/gi; // NOSONAR -- single character-class quantifier on trusted CSS input; no backtracking risk
 const PROCESSED = Symbol("processed");
 
 const remtoEm = (opts = {}) => {
@@ -26,6 +27,36 @@ const remtoEm = (opts = {}) => {
   };
 };
 
-module.exports = {
-  plugins: [require("@tailwindcss/postcss"), require("autoprefixer"), remtoEm()],
+// Strips the `@layer properties { ... }` block that Tailwind v4 emits as a
+// browser-compatibility fallback for `@property` declarations.
+//
+// Problem: CSS `@layer` at-rules are globally scoped by spec — they cannot be
+// confined by a surrounding selector. Even though all other Formbricks survey
+// styles are correctly scoped to `#fbjs`, the `@layer properties` block
+// contains a bare `*, :before, :after, ::backdrop` selector that resets all
+// `--tw-*` CSS custom properties on every element of the host page. This
+// breaks shadows, rings, transforms, and other Tailwind utilities on any site
+// that uses Tailwind v4 alongside the Formbricks SDK.
+//
+// The `@property` declarations already present in the same stylesheet cover
+// the same browser-compatibility need for all supporting browsers, so removing
+// `@layer properties` does not affect survey rendering.
+//
+// See: https://github.com/formbricks/js/issues/46
+const stripLayerProperties = () => {
+  return {
+    postcssPlugin: "postcss-strip-layer-properties",
+    AtRule: {
+      layer: (atRule) => {
+        if (atRule.params === "properties") {
+          atRule.remove();
+        }
+      },
+    },
+  };
+};
+stripLayerProperties.postcss = true;
+
+module.exports = {
+  plugins: [require("@tailwindcss/postcss"), require("autoprefixer"), remtoEm(), stripLayerProperties()],
 };