Compare commits

..

1 Commits

Author SHA1 Message Date
Johannes ca55d6bbc0 fix: upgrade tar-fs to resolve CVE-2024-12905 and CVE-2025-48387
Add pnpm override to force tar-fs>=2.1.4, upgrading from vulnerable
version 2.1.3 to patched version 3.1.1.

Resolves path traversal and symlink attack vulnerabilities in tar-fs
that could allow malicious tarballs to write files outside the intended
extraction directory.

The tar-fs package is only used as a transitive dependency via
prebuild-install (used by sharp) for extracting native binaries during
installation, so this upgrade has no runtime impact on the application.

Fixes: https://github.com/formbricks/formbricks/security/dependabot/205
2025-10-06 13:11:53 +02:00
94 changed files with 1252 additions and 6500 deletions
@@ -54,10 +54,6 @@ inputs:
description: "Whether this is a prerelease (auto-tags for staging/production)"
required: false
default: "false"
make_latest:
description: "Whether to tag as latest/production (from GitHub release 'Set as the latest release' option)"
required: false
default: "false"
# Build options
dockerfile:
@@ -158,7 +154,6 @@ runs:
DEPLOY_PRODUCTION: ${{ inputs.deploy_production }}
DEPLOY_STAGING: ${{ inputs.deploy_staging }}
IS_PRERELEASE: ${{ inputs.is_prerelease }}
MAKE_LATEST: ${{ inputs.make_latest }}
run: |
set -euo pipefail
@@ -169,9 +164,9 @@ runs:
if [[ "${IS_PRERELEASE}" == "true" ]]; then
TAGS="${TAGS}\n${ECR_REGISTRY}/${ECR_REPOSITORY}:staging"
echo "Adding staging tag for prerelease"
elif [[ "${IS_PRERELEASE}" == "false" && "${MAKE_LATEST}" == "true" ]]; then
elif [[ "${IS_PRERELEASE}" == "false" ]]; then
TAGS="${TAGS}\n${ECR_REGISTRY}/${ECR_REPOSITORY}:production"
echo "Adding production tag for stable release marked as latest"
echo "Adding production tag for stable release"
fi
# Handle manual deployment overrides
@@ -201,7 +196,6 @@ runs:
VERSION: ${{ steps.version.outputs.version }}
IMAGE_NAME: ${{ inputs.ghcr_image_name }}
IS_PRERELEASE: ${{ inputs.is_prerelease }}
MAKE_LATEST: ${{ inputs.make_latest }}
run: |
set -euo pipefail
@@ -220,10 +214,10 @@ runs:
echo "Added SemVer tags: ${MAJOR}.${MINOR}, ${MAJOR}"
fi
# Add latest tag for stable releases marked as latest
if [[ "${IS_PRERELEASE}" == "false" && "${MAKE_LATEST}" == "true" ]]; then
# Add latest tag for stable releases
if [[ "${IS_PRERELEASE}" == "false" ]]; then
TAGS="${TAGS}\nghcr.io/${IMAGE_NAME}:latest"
echo "Added latest tag for stable release marked as latest"
echo "Added latest tag for stable release"
fi
echo "Generated GHCR tags:"
@@ -257,7 +251,6 @@ runs:
echo "Experimental Mode: ${{ inputs.experimental_mode }}"
echo "Event Name: ${{ github.event_name }}"
echo "Is Prerelease: ${{ inputs.is_prerelease }}"
echo "Make Latest: ${{ inputs.make_latest }}"
echo "Version: ${{ steps.version.outputs.version }}"
if [[ "${{ inputs.registry_type }}" == "ecr" ]]; then
-6
View File
@@ -32,11 +32,6 @@ on:
required: false
type: boolean
default: false
MAKE_LATEST:
description: "Whether to tag for production (from GitHub release 'Set as the latest release' option)"
required: false
type: boolean
default: false
outputs:
IMAGE_TAG:
description: "Normalized image tag used for the build"
@@ -85,7 +80,6 @@ jobs:
deploy_production: ${{ inputs.deploy_production }}
deploy_staging: ${{ inputs.deploy_staging }}
is_prerelease: ${{ inputs.IS_PRERELEASE }}
make_latest: ${{ inputs.MAKE_LATEST }}
env:
DEPOT_PROJECT_TOKEN: ${{ secrets.DEPOT_PROJECT_TOKEN }}
DUMMY_DATABASE_URL: ${{ secrets.DUMMY_DATABASE_URL }}
-76
View File
@@ -8,75 +8,6 @@ permissions:
contents: read
jobs:
check-latest-release:
name: Check if this is the latest release
runs-on: ubuntu-latest
timeout-minutes: 5
permissions:
contents: read
outputs:
is_latest: ${{ steps.compare_tags.outputs.is_latest }}
# This job determines if the current release was marked as "Set as the latest release"
# by comparing it with the latest release from GitHub API
steps:
- name: Harden the runner
uses: step-security/harden-runner@ec9f2d5744a09debf3a187a3f4f675c53b671911 # v2.13.0
with:
egress-policy: audit
- name: Get latest release tag from API
id: get_latest_release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
REPO: ${{ github.repository }}
run: |
set -euo pipefail
# Get the latest release tag from GitHub API with error handling
echo "Fetching latest release from GitHub API..."
# Use curl with error handling - API returns 404 if no releases exist
http_code=$(curl -s -w "%{http_code}" -H "Authorization: token ${GITHUB_TOKEN}" \
"https://api.github.com/repos/${REPO}/releases/latest" -o /tmp/latest_release.json)
if [[ "$http_code" == "404" ]]; then
echo "⚠️ No previous releases found (404). This appears to be the first release."
echo "latest_release=" >> $GITHUB_OUTPUT
elif [[ "$http_code" == "200" ]]; then
latest_release=$(jq -r .tag_name /tmp/latest_release.json)
if [[ "$latest_release" == "null" || -z "$latest_release" ]]; then
echo "⚠️ API returned null/empty tag_name. Treating as first release."
echo "latest_release=" >> $GITHUB_OUTPUT
else
echo "Latest release from API: ${latest_release}"
echo "latest_release=${latest_release}" >> $GITHUB_OUTPUT
fi
else
echo "❌ GitHub API error (HTTP ${http_code}). Treating as first release."
echo "latest_release=" >> $GITHUB_OUTPUT
fi
echo "Current release tag: ${{ github.event.release.tag_name }}"
- name: Compare release tags
id: compare_tags
env:
CURRENT_TAG: ${{ github.event.release.tag_name }}
LATEST_TAG: ${{ steps.get_latest_release.outputs.latest_release }}
run: |
set -euo pipefail
# Handle first release case (no previous releases)
if [[ -z "${LATEST_TAG}" ]]; then
echo "🎉 This is the first release (${CURRENT_TAG}) - treating as latest"
echo "is_latest=true" >> $GITHUB_OUTPUT
elif [[ "${CURRENT_TAG}" == "${LATEST_TAG}" ]]; then
echo "✅ This release (${CURRENT_TAG}) is marked as the latest release"
echo "is_latest=true" >> $GITHUB_OUTPUT
else
echo "️ This release (${CURRENT_TAG}) is not the latest release (latest: ${LATEST_TAG})"
echo "is_latest=false" >> $GITHUB_OUTPUT
fi
docker-build-community:
name: Build & release community docker image
permissions:
@@ -85,11 +16,8 @@ jobs:
id-token: write
uses: ./.github/workflows/release-docker-github.yml
secrets: inherit
needs:
- check-latest-release
with:
IS_PRERELEASE: ${{ github.event.release.prerelease }}
MAKE_LATEST: ${{ needs.check-latest-release.outputs.is_latest }}
docker-build-cloud:
name: Build & push Formbricks Cloud to ECR
@@ -101,9 +29,7 @@ jobs:
with:
image_tag: ${{ needs.docker-build-community.outputs.VERSION }}
IS_PRERELEASE: ${{ github.event.release.prerelease }}
MAKE_LATEST: ${{ needs.check-latest-release.outputs.is_latest }}
needs:
- check-latest-release
- docker-build-community
helm-chart-release:
@@ -148,10 +74,8 @@ jobs:
contents: write # Required for tag push operations in called workflow
uses: ./.github/workflows/move-stable-tag.yml
needs:
- check-latest-release
- docker-build-community # Ensure release is successful first
with:
release_tag: ${{ github.event.release.tag_name }}
commit_sha: ${{ github.sha }}
is_prerelease: ${{ github.event.release.prerelease }}
make_latest: ${{ needs.check-latest-release.outputs.is_latest }}
+2 -7
View File
@@ -16,11 +16,6 @@ on:
required: false
type: boolean
default: false
make_latest:
description: "Whether to move stable tag (from GitHub release 'Set as the latest release' option)"
required: false
type: boolean
default: false
permissions:
contents: read
@@ -37,8 +32,8 @@ jobs:
timeout-minutes: 10 # Prevent hung git operations
permissions:
contents: write # Required to push tags
# Only move stable tag for non-prerelease versions AND when make_latest is true
if: ${{ !inputs.is_prerelease && inputs.make_latest }}
# Only move stable tag for non-prerelease versions
if: ${{ !inputs.is_prerelease }}
steps:
- name: Harden the runner
uses: step-security/harden-runner@0634a2670c59f64b4a01f0f96f84700a4088b9f0 # v2.12.0
@@ -13,11 +13,6 @@ on:
required: false
type: boolean
default: false
MAKE_LATEST:
description: "Whether to tag as latest (from GitHub release 'Set as the latest release' option)"
required: false
type: boolean
default: false
outputs:
VERSION:
description: release version
@@ -98,7 +93,6 @@ jobs:
ghcr_image_name: ${{ env.IMAGE_NAME }}
version: ${{ steps.extract_release_tag.outputs.VERSION }}
is_prerelease: ${{ inputs.IS_PRERELEASE }}
make_latest: ${{ inputs.MAKE_LATEST }}
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
DEPOT_PROJECT_TOKEN: ${{ secrets.DEPOT_PROJECT_TOKEN }}
@@ -1,3 +1,5 @@
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
import { getLatestStableFbReleaseAction } from "@/modules/projects/settings/(setup)/app-connection/actions";
import { cleanup, render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { usePathname, useRouter } from "next/navigation";
@@ -6,8 +8,6 @@ import { TEnvironment } from "@formbricks/types/environment";
import { TOrganization } from "@formbricks/types/organizations";
import { TProject } from "@formbricks/types/project";
import { TUser } from "@formbricks/types/user";
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
import { getLatestStableFbReleaseAction } from "@/modules/projects/settings/(setup)/app-connection/actions";
import { MainNavigation } from "./MainNavigation";
// Mock constants that this test needs
@@ -210,10 +210,9 @@ describe("MainNavigation", () => {
expect(userTrigger).toBeInTheDocument(); // Ensure the trigger element is found
await userEvent.click(userTrigger);
// Wait for the dropdown content to appear - using getAllByText to handle multiple instances
// Wait for the dropdown content to appear
await waitFor(() => {
const accountElements = screen.getAllByText("common.account");
expect(accountElements).toHaveLength(2);
expect(screen.getByText("common.account")).toBeInTheDocument();
});
expect(screen.getByText("common.documentation")).toBeInTheDocument();
@@ -1,18 +1,5 @@
"use client";
import { useTranslate } from "@tolgee/react";
import { PlusIcon, TrashIcon } from "lucide-react";
import Image from "next/image";
import React, { useEffect, useMemo, useState } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TIntegrationInput } from "@formbricks/types/integration";
import {
TIntegrationNotion,
TIntegrationNotionConfigData,
TIntegrationNotionDatabase,
} from "@formbricks/types/integration/notion";
import { TSurvey, TSurveyQuestionTypeEnum } from "@formbricks/types/surveys/types";
import { createOrUpdateIntegrationAction } from "@/app/(app)/environments/[environmentId]/project/integrations/actions";
import {
ERRORS,
@@ -36,6 +23,19 @@ import {
} from "@/modules/ui/components/dialog";
import { DropdownSelector } from "@/modules/ui/components/dropdown-selector";
import { Label } from "@/modules/ui/components/label";
import { useTranslate } from "@tolgee/react";
import { PlusIcon, TrashIcon } from "lucide-react";
import Image from "next/image";
import React, { useEffect, useMemo, useState } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TIntegrationInput } from "@formbricks/types/integration";
import {
TIntegrationNotion,
TIntegrationNotionConfigData,
TIntegrationNotionDatabase,
} from "@formbricks/types/integration/notion";
import { TSurvey, TSurveyQuestionTypeEnum } from "@formbricks/types/surveys/types";
interface AddIntegrationModalProps {
environmentId: string;
@@ -134,12 +134,13 @@ export const AddIntegrationModal = ({
type: TSurveyQuestionTypeEnum.OpenText,
})) || [];
const hiddenFields =
selectedSurvey?.hiddenFields.fieldIds?.map((fId) => ({
id: fId,
name: `${t("common.hidden_field")} : ${fId}`,
type: TSurveyQuestionTypeEnum.OpenText,
})) || [];
const hiddenFields = selectedSurvey?.hiddenFields.enabled
? selectedSurvey?.hiddenFields.fieldIds?.map((fId) => ({
id: fId,
name: `${t("common.hidden_field")} : ${fId}`,
type: TSurveyQuestionTypeEnum.OpenText,
})) || []
: [];
const Metadata = [
{
id: "metadata",
@@ -1,3 +1,5 @@
import { ResponseCardModal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/responses/components/ResponseCardModal";
import { SingleResponseCard } from "@/modules/analysis/components/SingleResponseCard";
import { cleanup, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
@@ -6,8 +8,6 @@ import { TResponse } from "@formbricks/types/responses";
import { TSurvey } from "@formbricks/types/surveys/types";
import { TTag } from "@formbricks/types/tags";
import { TUser, TUserLocale } from "@formbricks/types/user";
import { ResponseCardModal } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/responses/components/ResponseCardModal";
import { SingleResponseCard } from "@/modules/analysis/components/SingleResponseCard";
vi.mock("@/modules/analysis/components/SingleResponseCard", () => ({
SingleResponseCard: vi.fn(() => <div data-testid="single-response-card">SingleResponseCard</div>),
@@ -46,11 +46,6 @@ vi.mock("@/modules/ui/components/dialog", () => ({
)),
DialogBody: vi.fn(({ children }) => <div data-testid="dialog-body">{children}</div>),
DialogFooter: vi.fn(({ children }) => <div data-testid="dialog-footer">{children}</div>),
DialogTitle: vi.fn(({ children }) => <div data-testid="dialog-title">{children}</div>),
}));
vi.mock("@radix-ui/react-visually-hidden", () => ({
VisuallyHidden: vi.fn(({ children }) => <div data-testid="visually-hidden">{children}</div>),
}));
const mockResponses = [
@@ -1,4 +1,6 @@
import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
import { SingleResponseCard } from "@/modules/analysis/components/SingleResponseCard";
import { Button } from "@/modules/ui/components/button";
import { Dialog, DialogBody, DialogContent, DialogFooter } from "@/modules/ui/components/dialog";
import { ChevronLeft, ChevronRight } from "lucide-react";
import { useEffect, useState } from "react";
import { TEnvironment } from "@formbricks/types/environment";
@@ -6,9 +8,6 @@ import { TResponse } from "@formbricks/types/responses";
import { TSurvey } from "@formbricks/types/surveys/types";
import { TTag } from "@formbricks/types/tags";
import { TUser, TUserLocale } from "@formbricks/types/user";
import { SingleResponseCard } from "@/modules/analysis/components/SingleResponseCard";
import { Button } from "@/modules/ui/components/button";
import { Dialog, DialogBody, DialogContent, DialogFooter, DialogTitle } from "@/modules/ui/components/dialog";
interface ResponseCardModalProps {
responses: TResponse[];
@@ -78,9 +77,6 @@ export const ResponseCardModal = ({
return (
<Dialog open={open} onOpenChange={handleClose}>
<DialogContent width="wide">
<VisuallyHidden asChild>
<DialogTitle>Survey Response Details</DialogTitle>
</VisuallyHidden>
<DialogBody>
<SingleResponseCard
survey={survey}
@@ -1,6 +1,3 @@
import { NextRequest } from "next/server";
import { logger } from "@formbricks/logger";
import { TUploadPublicFileRequest, ZUploadPublicFileRequest } from "@formbricks/types/storage";
import { checkAuth } from "@/app/api/v1/management/storage/lib/utils";
import { responses } from "@/app/lib/api/response";
import { transformErrorToDetails } from "@/app/lib/api/validator";
@@ -8,6 +5,9 @@ import { TApiV1Authentication, withV1ApiWrapper } from "@/app/lib/api/with-api-l
import { rateLimitConfigs } from "@/modules/core/rate-limit/rate-limit-configs";
import { getSignedUrlForUpload } from "@/modules/storage/service";
import { getErrorResponseFromStorageError } from "@/modules/storage/utils";
import { NextRequest } from "next/server";
import { logger } from "@formbricks/logger";
import { TUploadPublicFileRequest, ZUploadPublicFileRequest } from "@formbricks/types/storage";
// api endpoint for getting a signed url for uploading a public file
// uploaded files will be public, anyone can access the file
@@ -52,16 +52,7 @@ export const POST = withV1ApiWrapper({
};
}
const MAX_PUBLIC_FILE_SIZE_MB = 5;
const maxFileUploadSize = MAX_PUBLIC_FILE_SIZE_MB * 1024 * 1024;
const signedUrlResponse = await getSignedUrlForUpload(
fileName,
environmentId,
fileType,
"public",
maxFileUploadSize
);
const signedUrlResponse = await getSignedUrlForUpload(fileName, environmentId, fileType, "public");
if (!signedUrlResponse.ok) {
logger.error({ error: signedUrlResponse.error }, "Error getting signed url for upload");
+8 -14
View File
@@ -100,13 +100,10 @@ export const getAirtableToken = async (environmentId: string) => {
});
if (!newToken) {
logger.error(
{
environmentId,
airtableIntegration,
},
"Failed to fetch new Airtable token"
);
logger.error("Failed to fetch new Airtable token", {
environmentId,
airtableIntegration,
});
throw new Error("Failed to fetch new Airtable token");
}
@@ -124,13 +121,10 @@ export const getAirtableToken = async (environmentId: string) => {
return access_token;
} catch (error) {
logger.error(
{
environmentId,
error,
},
"Failed to get Airtable token"
);
logger.error("Failed to get Airtable token", {
environmentId,
error,
});
throw new Error("Failed to get Airtable token");
}
};
+1 -92
View File
@@ -1,24 +1,13 @@
import { createCipheriv, randomBytes } from "crypto";
import { beforeEach, describe, expect, test, vi } from "vitest";
import { logger } from "@formbricks/logger";
import { describe, expect, test, vi } from "vitest";
import { getHash, symmetricDecrypt, symmetricEncrypt } from "./crypto";
vi.mock("./constants", () => ({ ENCRYPTION_KEY: "0".repeat(32) }));
vi.mock("@formbricks/logger", () => ({
logger: {
warn: vi.fn(),
},
}));
const key = "0".repeat(32);
const plain = "hello";
describe("crypto", () => {
beforeEach(() => {
vi.clearAllMocks();
});
test("encrypt + decrypt roundtrip", () => {
const cipher = symmetricEncrypt(plain, key);
expect(symmetricDecrypt(cipher, key)).toBe(plain);
@@ -49,84 +38,4 @@ describe("crypto", () => {
expect(typeof h).toBe("string");
expect(h.length).toBeGreaterThan(0);
});
test("logs warning and throws when GCM decryption fails with invalid auth tag", () => {
// Create a valid GCM payload but corrupt the auth tag
const iv = randomBytes(16);
const bufKey = Buffer.from(key, "utf8");
const cipher = createCipheriv("aes-256-gcm", bufKey, iv);
let enc = cipher.update(plain, "utf8", "hex");
enc += cipher.final("hex");
const validTag = cipher.getAuthTag().toString("hex");
// Corrupt the auth tag by flipping some bits
const corruptedTag = validTag
.split("")
.map((c, i) => (i < 4 ? (parseInt(c, 16) ^ 0xf).toString(16) : c))
.join("");
const corruptedPayload = `${iv.toString("hex")}:${enc}:${corruptedTag}`;
// Should throw an error and log a warning
expect(() => symmetricDecrypt(corruptedPayload, key)).toThrow();
// Verify logger.warn was called with the correct format (object first, message second)
expect(logger.warn).toHaveBeenCalledWith(
{ err: expect.any(Error) },
"AES-GCM decryption failed; refusing to fall back to insecure CBC"
);
expect(logger.warn).toHaveBeenCalledTimes(1);
});
test("logs warning and throws when GCM decryption fails with corrupted encrypted data", () => {
// Create a payload with valid structure but corrupted encrypted data
const iv = randomBytes(16);
const bufKey = Buffer.from(key, "utf8");
const cipher = createCipheriv("aes-256-gcm", bufKey, iv);
let enc = cipher.update(plain, "utf8", "hex");
enc += cipher.final("hex");
const tag = cipher.getAuthTag().toString("hex");
// Corrupt the encrypted data
const corruptedEnc = enc
.split("")
.map((c, i) => (i < 4 ? (parseInt(c, 16) ^ 0xa).toString(16) : c))
.join("");
const corruptedPayload = `${iv.toString("hex")}:${corruptedEnc}:${tag}`;
// Should throw an error and log a warning
expect(() => symmetricDecrypt(corruptedPayload, key)).toThrow();
// Verify logger.warn was called
expect(logger.warn).toHaveBeenCalledWith(
{ err: expect.any(Error) },
"AES-GCM decryption failed; refusing to fall back to insecure CBC"
);
expect(logger.warn).toHaveBeenCalledTimes(1);
});
test("logs warning and throws when GCM decryption fails with wrong key", () => {
// Create a valid GCM payload with one key
const iv = randomBytes(16);
const bufKey = Buffer.from(key, "utf8");
const cipher = createCipheriv("aes-256-gcm", bufKey, iv);
let enc = cipher.update(plain, "utf8", "hex");
enc += cipher.final("hex");
const tag = cipher.getAuthTag().toString("hex");
const payload = `${iv.toString("hex")}:${enc}:${tag}`;
// Try to decrypt with a different key
const wrongKey = "1".repeat(32);
// Should throw an error and log a warning
expect(() => symmetricDecrypt(payload, wrongKey)).toThrow();
// Verify logger.warn was called
expect(logger.warn).toHaveBeenCalledWith(
{ err: expect.any(Error) },
"AES-GCM decryption failed; refusing to fall back to insecure CBC"
);
expect(logger.warn).toHaveBeenCalledTimes(1);
});
});
+1 -1
View File
@@ -85,7 +85,7 @@ export function symmetricDecrypt(payload: string, key: string): string {
try {
return symmetricDecryptV2(payload, key);
} catch (err) {
logger.warn({ err }, "AES-GCM decryption failed; refusing to fall back to insecure CBC");
logger.warn(err, "AES-GCM decryption failed; refusing to fall back to insecure CBC");
throw err;
}
+6 -7
View File
@@ -1,7 +1,7 @@
import { TResponseData, TResponseDataValue, TResponseVariables } from "@formbricks/types/responses";
import { TI18nString, TSurvey, TSurveyQuestion, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { getLocalizedValue } from "@/lib/i18n/utils";
import { structuredClone } from "@/lib/pollyfills/structuredClone";
import { TResponseData, TResponseDataValue, TResponseVariables } from "@formbricks/types/responses";
import { TI18nString, TSurvey, TSurveyQuestion, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { formatDateWithOrdinal, isValidDateString } from "./datetime";
export interface fallbacks {
@@ -118,16 +118,15 @@ export const replaceRecallInfoWithUnderline = (label: string): string => {
// Checks for survey questions with a "recall" pattern but no fallback value.
export const checkForEmptyFallBackValue = (survey: TSurvey, language: string): TSurveyQuestion | null => {
const doesTextHaveRecall = (text: string) => {
const findRecalls = (text: string) => {
const recalls = text.match(/#recall:[^ ]+/g);
return recalls?.some((recall) => !extractFallbackValue(recall));
return recalls && recalls.some((recall) => !extractFallbackValue(recall));
};
for (const question of survey.questions) {
if (
doesTextHaveRecall(getLocalizedValue(question.headline, language)) ||
(question.subheader && doesTextHaveRecall(getLocalizedValue(question.subheader, language))) ||
("html" in question && doesTextHaveRecall(getLocalizedValue(question.html, language)))
findRecalls(getLocalizedValue(question.headline, language)) ||
(question.subheader && findRecalls(getLocalizedValue(question.subheader, language)))
) {
return question;
}
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "Abschluss hinzufügen",
"add_ending_below": "Abschluss unten hinzufügen",
"add_fallback": "Hinzufügen",
"add_fallback_placeholder": "Platzhalter hinzufügen, falls kein Wert zur Verfügung steht.",
"add_fallback_placeholder": "Hinzufügen eines Platzhalters, der angezeigt wird, wenn die Frage übersprungen wird:",
"add_hidden_field_id": "Verstecktes Feld ID hinzufügen",
"add_highlight_border": "Rahmen hinzufügen",
"add_highlight_border_description": "Füge deiner Umfragekarte einen äußeren Rahmen hinzu.",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Umfrage automatisch als abgeschlossen markieren nach",
"back_button_label": "Zurück\"- Button ",
"background_styling": "Hintergründe",
"bold": "Fett",
"brand_color": "Markenfarbe",
"brightness": "Helligkeit",
"button_label": "Beschriftung",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "Enthält nicht alle von",
"does_not_include_one_of": "Enthält nicht eines von",
"does_not_start_with": "Fängt nicht an mit",
"edit_link": "Bearbeitungslink",
"edit_recall": "Erinnerung bearbeiten",
"edit_translations": "{lang} -Übersetzungen bearbeiten",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Teilnehmer können die Umfragesprache jederzeit während der Umfrage ändern.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "Diese Abschlusskarte wird in der Logik der Frage {questionIndex} verwendet.",
"ending_used_in_quota": "Dieses Ende wird in der \"{quotaName}\" Quote verwendet",
"ends_with": "endet mit",
"enter_fallback_value": "Ersatzwert eingeben",
"equals": "Gleich",
"equals_one_of": "Entspricht einem von",
"error_publishing_survey": "Beim Veröffentlichen der Umfrage ist ein Fehler aufgetreten.",
@@ -1400,9 +1397,6 @@
"four_points": "4 Punkte",
"heading": "Überschrift",
"hidden_field_added_successfully": "Verstecktes Feld erfolgreich hinzugefügt",
"hidden_field_used_in_recall": "Verstecktes Feld \"{hiddenField}\" wird in Frage {questionIndex} abgerufen.",
"hidden_field_used_in_recall_ending_card": "Verstecktes Feld \"{hiddenField}\" wird in der Abschlusskarte abgerufen.",
"hidden_field_used_in_recall_welcome": "Verstecktes Feld \"{hiddenField}\" wird in der Willkommenskarte abgerufen.",
"hide_advanced_settings": "Erweiterte Einstellungen ausblenden",
"hide_back_button": "'Zurück'-Button ausblenden",
"hide_back_button_description": "Den Zurück-Button in der Umfrage nicht anzeigen",
@@ -1421,7 +1415,6 @@
"inner_text": "Innerer Text",
"input_border_color": "Randfarbe des Eingabefelds",
"input_color": "Farbe des Eingabefelds",
"insert_link": "Link einfügen",
"invalid_targeting": "Ungültiges Targeting: Bitte überprüfe deine Zielgruppenfilter",
"invalid_video_url_warning": "Bitte gib eine gültige YouTube-, Vimeo- oder Loom-URL ein. Andere Video-Plattformen werden derzeit nicht unterstützt.",
"invalid_youtube_url": "Ungültige YouTube-URL",
@@ -1439,7 +1432,6 @@
"is_set": "Ist festgelegt",
"is_skipped": "Wird übersprungen",
"is_submitted": "Wird eingereicht",
"italic": "Kursiv",
"jump_to_question": "Zur Frage springen",
"keep_current_order": "Bestehende Anordnung beibehalten",
"keep_showing_while_conditions_match": "Zeige weiter, solange die Bedingungen übereinstimmen",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "Keine Bilder gefunden für ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "Keine Sprachen gefunden. Füge die erste hinzu, um loszulegen.",
"no_option_found": "Keine Option gefunden",
"no_recall_items_found": "Keine Erinnerungsstücke gefunden",
"no_variables_yet_add_first_one_below": "Noch keine Variablen. Füge die erste hinzu.",
"number": "Nummer",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Sobald die Standardsprache für diese Umfrage festgelegt ist, kann sie nur geändert werden, indem die Mehrsprachigkeitsoption deaktiviert und alle Übersetzungen gelöscht werden.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PIN darf nur Zahlen enthalten.",
"pin_must_be_a_four_digit_number": "Die PIN muss eine vierstellige Zahl sein.",
"please_enter_a_file_extension": "Bitte gib eine Dateierweiterung ein.",
"please_enter_a_valid_url": "Bitte geben Sie eine gültige URL ein (z. B. https://beispiel.de)",
"please_set_a_survey_trigger": "Bitte richte einen Umfrage-Trigger ein",
"please_specify": "Bitte angeben",
"prevent_double_submission": "Doppeltes Anbschicken verhindern",
@@ -1501,8 +1491,6 @@
"question_id_updated": "Frage-ID aktualisiert",
"question_used_in_logic": "Diese Frage wird in der Logik der Frage {questionIndex} verwendet.",
"question_used_in_quota": "Diese Frage wird in der \"{quotaName}\" Quote verwendet",
"question_used_in_recall": "Diese Frage wird in Frage {questionIndex} abgerufen.",
"question_used_in_recall_ending_card": "Diese Frage wird in der Abschlusskarte abgerufen.",
"quotas": {
"add_quota": "Quote hinzufügen",
"change_quota_for_public_survey": "Quote für öffentliche Umfrage ändern?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Alle Optionen zufällig anordnen",
"randomize_all_except_last": "Alle Optionen zufällig anordnen außer der letzten",
"range": "Reichweite",
"recall_data": "Daten abrufen",
"recall_information_from": "Information abrufen von ...",
"recontact_options": "Optionen zur erneuten Kontaktaufnahme",
"redirect_thank_you_card": "Weiterleitung anlegen",
"redirect_to_url": "Zu URL weiterleiten",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Umfrage auslösen, wenn eine der Aktionen ausgeführt wird...",
"try_lollipop_or_mountain": "Versuch 'Lolli' oder 'Berge'...",
"type_field_id": "Feld-ID eingeben",
"underline": "Unterstreichen",
"unlock_targeting_description": "Spezifische Nutzergruppen basierend auf Attributen oder Geräteinformationen ansprechen",
"unlock_targeting_title": "Targeting mit einem höheren Plan freischalten",
"unsaved_changes_warning": "Du hast ungespeicherte Änderungen in deiner Umfrage. Möchtest Du sie speichern, bevor Du gehst?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "Variable \"{variableName}\" wird in der \"{quotaName}\" Quote verwendet",
"variable_name_is_already_taken_please_choose_another": "Variablenname ist bereits vergeben, bitte wähle einen anderen.",
"variable_name_must_start_with_a_letter": "Variablenname muss mit einem Buchstaben beginnen.",
"variable_used_in_recall": "Variable \"{variable}\" wird in Frage {questionIndex} abgerufen.",
"variable_used_in_recall_ending_card": "Variable \"{variable}\" wird in der Abschlusskarte abgerufen.",
"variable_used_in_recall_welcome": "Variable \"{variable}\" wird in der Willkommenskarte abgerufen.",
"verify_email_before_submission": "E-Mail vor dem Absenden überprüfen",
"verify_email_before_submission_description": "Lass nur Leute mit einer echten E-Mail antworten.",
"wait": "Warte",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "Add ending",
"add_ending_below": "Add ending below",
"add_fallback": "Add",
"add_fallback_placeholder": "Add a placeholder to show if there is no value to recall.",
"add_fallback_placeholder": "Add a placeholder to show if the question gets skipped:",
"add_hidden_field_id": "Add hidden field ID",
"add_highlight_border": "Add highlight border",
"add_highlight_border_description": "Add an outer border to your survey card.",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Automatically mark the survey as complete after",
"back_button_label": "\"Back\" Button Label",
"background_styling": "Background Styling",
"bold": "Bold",
"brand_color": "Brand color",
"brightness": "Brightness",
"button_label": "Button Label",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "Does not include all of",
"does_not_include_one_of": "Does not include one of",
"does_not_start_with": "Does not start with",
"edit_link": "Edit link",
"edit_recall": "Edit Recall",
"edit_translations": "Edit {lang} translations",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Enable participants to switch the survey language at any point during the survey.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "This ending card is used in logic of question {questionIndex}.",
"ending_used_in_quota": "This ending is being used in \"{quotaName}\" quota",
"ends_with": "Ends with",
"enter_fallback_value": "Enter fallback value",
"equals": "Equals",
"equals_one_of": "Equals one of",
"error_publishing_survey": "An error occured while publishing the survey.",
@@ -1400,9 +1397,6 @@
"four_points": "4 points",
"heading": "Heading",
"hidden_field_added_successfully": "Hidden field added successfully",
"hidden_field_used_in_recall": "Hidden field \"{hiddenField}\" is being recalled in question {questionIndex}.",
"hidden_field_used_in_recall_ending_card": "Hidden field \"{hiddenField}\" is being recalled in Ending Card",
"hidden_field_used_in_recall_welcome": "Hidden field \"{hiddenField}\" is being recalled in Welcome card.",
"hide_advanced_settings": "Hide advanced settings",
"hide_back_button": "Hide 'Back' button",
"hide_back_button_description": "Do not display the back button in the survey",
@@ -1421,7 +1415,6 @@
"inner_text": "Inner Text",
"input_border_color": "Input border color",
"input_color": "Input color",
"insert_link": "Insert link",
"invalid_targeting": "Invalid targeting: Please check your audience filters",
"invalid_video_url_warning": "Please enter a valid YouTube, Vimeo, or Loom URL. We currently do not support other video hosting providers.",
"invalid_youtube_url": "Invalid YouTube URL",
@@ -1439,7 +1432,6 @@
"is_set": "Is set",
"is_skipped": "Is skipped",
"is_submitted": "Is submitted",
"italic": "Italic",
"jump_to_question": "Jump to question",
"keep_current_order": "Keep current order",
"keep_showing_while_conditions_match": "Keep showing while conditions match",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "No images found for ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "No languages found. Add the first one to get started.",
"no_option_found": "No option found",
"no_recall_items_found": "No recall items found ",
"no_variables_yet_add_first_one_below": "No variables yet. Add the first one below.",
"number": "Number",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Once set, the default language for this survey can only be changed by disabling the multi-language option and deleting all translations.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PIN can only contain numbers.",
"pin_must_be_a_four_digit_number": "PIN must be a four digit number.",
"please_enter_a_file_extension": "Please enter a file extension.",
"please_enter_a_valid_url": "Please enter a valid URL (e.g., https://example.com)",
"please_set_a_survey_trigger": "Please set a survey trigger",
"please_specify": "Please specify",
"prevent_double_submission": "Prevent double submission",
@@ -1501,8 +1491,6 @@
"question_id_updated": "Question ID updated",
"question_used_in_logic": "This question is used in logic of question {questionIndex}.",
"question_used_in_quota": "This question is being used in \"{quotaName}\" quota",
"question_used_in_recall": "This question is being recalled in question {questionIndex}.",
"question_used_in_recall_ending_card": "This question is being recalled in Ending Card",
"quotas": {
"add_quota": "Add quota",
"change_quota_for_public_survey": "Change quota for public survey?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Randomize all",
"randomize_all_except_last": "Randomize all except last",
"range": "Range",
"recall_data": "Recall data",
"recall_information_from": "Recall information from ...",
"recontact_options": "Recontact Options",
"redirect_thank_you_card": "Redirect thank you card",
"redirect_to_url": "Redirect to Url",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Trigger survey when one of the actions is fired...",
"try_lollipop_or_mountain": "Try 'lollipop' or 'mountain'...",
"type_field_id": "Type field id",
"underline": "Underline",
"unlock_targeting_description": "Target specific user groups based on attributes or device information",
"unlock_targeting_title": "Unlock targeting with a higher plan",
"unsaved_changes_warning": "You have unsaved changes in your survey. Would you like to save them before leaving?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "Variable \"{variableName}\" is being used in \"{quotaName}\" quota",
"variable_name_is_already_taken_please_choose_another": "Variable name is already taken, please choose another.",
"variable_name_must_start_with_a_letter": "Variable name must start with a letter.",
"variable_used_in_recall": "Variable \"{variable}\" is being recalled in question {questionIndex}.",
"variable_used_in_recall_ending_card": "Variable {variable} is being recalled in Ending Card",
"variable_used_in_recall_welcome": "Variable \"{variable}\" is being recalled in Welcome Card.",
"verify_email_before_submission": "Verify email before submission",
"verify_email_before_submission_description": "Only let people with a real email respond.",
"wait": "Wait",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "Ajouter une fin",
"add_ending_below": "Ajouter une fin ci-dessous",
"add_fallback": "Ajouter",
"add_fallback_placeholder": "Ajouter un espace réservé à afficher s'il n'y a pas de valeur à rappeler.",
"add_fallback_placeholder": "Ajouter un espace réservé pour montrer si la question est ignorée :",
"add_hidden_field_id": "Ajouter un champ caché ID",
"add_highlight_border": "Ajouter une bordure de surlignage",
"add_highlight_border_description": "Ajoutez une bordure extérieure à votre carte d'enquête.",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Marquer automatiquement l'enquête comme terminée après",
"back_button_label": "Label du bouton \"Retour''",
"background_styling": "Style de fond",
"bold": "Gras",
"brand_color": "Couleur de marque",
"brightness": "Luminosité",
"button_label": "Label du bouton",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "n'inclut pas tout",
"does_not_include_one_of": "n'inclut pas un de",
"does_not_start_with": "Ne commence pas par",
"edit_link": "Modifier le lien",
"edit_recall": "Modifier le rappel",
"edit_translations": "Modifier les traductions {lang}",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Permettre aux participants de changer la langue de l'enquête à tout moment pendant celle-ci.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "Cette carte de fin est utilisée dans la logique de la question '{'questionIndex'}'.",
"ending_used_in_quota": "Cette fin est utilisée dans le quota \"{quotaName}\"",
"ends_with": "Se termine par",
"enter_fallback_value": "Saisir une valeur de secours",
"equals": "Égal",
"equals_one_of": "Égal à l'un de",
"error_publishing_survey": "Une erreur est survenue lors de la publication de l'enquête.",
@@ -1400,9 +1397,6 @@
"four_points": "4 points",
"heading": "En-tête",
"hidden_field_added_successfully": "Champ caché ajouté avec succès",
"hidden_field_used_in_recall": "Le champ caché \"{hiddenField}\" est rappelé dans la question {questionIndex}.",
"hidden_field_used_in_recall_ending_card": "Le champ caché \"{hiddenField}\" est rappelé dans la carte de fin.",
"hidden_field_used_in_recall_welcome": "Le champ caché \"{hiddenField}\" est rappelé dans la carte de bienvenue.",
"hide_advanced_settings": "Cacher les paramètres avancés",
"hide_back_button": "Masquer le bouton 'Retour'",
"hide_back_button_description": "Ne pas afficher le bouton retour dans l'enquête",
@@ -1421,7 +1415,6 @@
"inner_text": "Texte interne",
"input_border_color": "Couleur de bordure d'entrée",
"input_color": "Couleur d'entrée",
"insert_link": "Insérer un lien",
"invalid_targeting": "Ciblage invalide : Veuillez vérifier vos filtres d'audience",
"invalid_video_url_warning": "Merci d'entrer une URL YouTube, Vimeo ou Loom valide. Les autres plateformes vidéo ne sont pas encore supportées.",
"invalid_youtube_url": "URL YouTube invalide",
@@ -1439,7 +1432,6 @@
"is_set": "Est défini",
"is_skipped": "Est ignoré",
"is_submitted": "Est soumis",
"italic": "Italique",
"jump_to_question": "Passer à la question",
"keep_current_order": "Conserver la commande actuelle",
"keep_showing_while_conditions_match": "Continuer à afficher tant que les conditions correspondent",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "Aucune image trouvée pour ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "Aucune langue trouvée. Ajoutez la première pour commencer.",
"no_option_found": "Aucune option trouvée",
"no_recall_items_found": "Aucun élément de rappel trouvé",
"no_variables_yet_add_first_one_below": "Aucune variable pour le moment. Ajoutez la première ci-dessous.",
"number": "Numéro",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Une fois défini, la langue par défaut de cette enquête ne peut être changée qu'en désactivant l'option multilingue et en supprimant toutes les traductions.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "Le code PIN ne peut contenir que des chiffres.",
"pin_must_be_a_four_digit_number": "Le code PIN doit être un numéro à quatre chiffres.",
"please_enter_a_file_extension": "Veuillez entrer une extension de fichier.",
"please_enter_a_valid_url": "Veuillez entrer une URL valide (par exemple, https://example.com)",
"please_set_a_survey_trigger": "Veuillez définir un déclencheur d'enquête.",
"please_specify": "Veuillez préciser",
"prevent_double_submission": "Empêcher la double soumission",
@@ -1501,8 +1491,6 @@
"question_id_updated": "ID de la question mis à jour",
"question_used_in_logic": "Cette question est utilisée dans la logique de la question '{'questionIndex'}'.",
"question_used_in_quota": "Cette question est utilisée dans le quota \"{quotaName}\"",
"question_used_in_recall": "Cette question est rappelée dans la question {questionIndex}.",
"question_used_in_recall_ending_card": "Cette question est rappelée dans la carte de fin.",
"quotas": {
"add_quota": "Ajouter un quota",
"change_quota_for_public_survey": "Changer le quota pour le sondage public ?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Randomiser tout",
"randomize_all_except_last": "Randomiser tout sauf le dernier",
"range": "Plage",
"recall_data": "Rappel des données",
"recall_information_from": "Rappeler les informations de ...",
"recontact_options": "Options de recontact",
"redirect_thank_you_card": "Carte de remerciement de redirection",
"redirect_to_url": "Rediriger vers l'URL",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Déclencher l'enquête lorsqu'une des actions est déclenchée...",
"try_lollipop_or_mountain": "Essayez 'sucette' ou 'montagne'...",
"type_field_id": "Identifiant de champ de type",
"underline": "Souligner",
"unlock_targeting_description": "Cibler des groupes d'utilisateurs spécifiques en fonction des attributs ou des informations sur l'appareil",
"unlock_targeting_title": "Débloquez le ciblage avec un plan supérieur.",
"unsaved_changes_warning": "Vous avez des modifications non enregistrées dans votre enquête. Souhaitez-vous les enregistrer avant de partir ?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "La variable \"{variableName}\" est utilisée dans le quota \"{quotaName}\"",
"variable_name_is_already_taken_please_choose_another": "Le nom de la variable est déjà pris, veuillez en choisir un autre.",
"variable_name_must_start_with_a_letter": "Le nom de la variable doit commencer par une lettre.",
"variable_used_in_recall": "La variable \"{variable}\" est rappelée dans la question {questionIndex}.",
"variable_used_in_recall_ending_card": "La variable {variable} est rappelée dans la carte de fin.",
"variable_used_in_recall_welcome": "La variable \"{variable}\" est rappelée dans la carte de bienvenue.",
"verify_email_before_submission": "Vérifiez l'email avant la soumission",
"verify_email_before_submission_description": "Ne laissez répondre que les personnes ayant une véritable adresse e-mail.",
"wait": "Attendre",
-18
View File
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "フォームを自動的に完了としてマークする",
"back_button_label": "「戻る」ボタンのラベル",
"background_styling": "背景のスタイル",
"bold": "太字",
"brand_color": "ブランドカラー",
"brightness": "明るさ",
"button_label": "ボタンのラベル",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "のすべてを含まない",
"does_not_include_one_of": "のいずれも含まない",
"does_not_start_with": "で始まらない",
"edit_link": "編集 リンク",
"edit_recall": "リコールを編集",
"edit_translations": "{lang} 翻訳を編集",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "回答者がフォームの途中でいつでも言語を切り替えられるようにします。",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "この終了カードは質問 {questionIndex} のロジックで使用されています。",
"ending_used_in_quota": "この 終了 は \"{quotaName}\" クォータ で使用されています",
"ends_with": "で終わる",
"enter_fallback_value": "フォールバック値を入力",
"equals": "と等しい",
"equals_one_of": "のいずれかと等しい",
"error_publishing_survey": "フォームの公開中にエラーが発生しました。",
@@ -1400,9 +1397,6 @@
"four_points": "4点",
"heading": "見出し",
"hidden_field_added_successfully": "非表示フィールドを正常に追加しました",
"hidden_field_used_in_recall": "隠し フィールド \"{hiddenField}\" が 質問 {questionIndex} で 呼び出され て います 。",
"hidden_field_used_in_recall_ending_card": "隠し フィールド \"{hiddenField}\" が エンディング カード で 呼び出され て います。",
"hidden_field_used_in_recall_welcome": "隠し フィールド \"{hiddenField}\" が ウェルカム カード で 呼び出され て います。",
"hide_advanced_settings": "詳細設定を非表示",
"hide_back_button": "「戻る」ボタンを非表示",
"hide_back_button_description": "フォームに「戻る」ボタンを表示しない",
@@ -1421,7 +1415,6 @@
"inner_text": "内部テキスト",
"input_border_color": "入力の枠線の色",
"input_color": "入力の色",
"insert_link": "リンク を 挿入",
"invalid_targeting": "無効なターゲティング: オーディエンスフィルターを確認してください",
"invalid_video_url_warning": "有効なYouTube、Vimeo、またはLoomのURLを入力してください。現在、他の動画ホスティングプロバイダーはサポートしていません。",
"invalid_youtube_url": "無効なYouTube URL",
@@ -1439,7 +1432,6 @@
"is_set": "設定されている",
"is_skipped": "スキップ済み",
"is_submitted": "送信済み",
"italic": "イタリック",
"jump_to_question": "質問にジャンプ",
"keep_current_order": "現在の順序を維持",
"keep_showing_while_conditions_match": "条件が一致する間、表示し続ける",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "''{query}'' の画像が見つかりません",
"no_languages_found_add_first_one_to_get_started": "言語が見つかりません。始めるには、最初のものを追加してください。",
"no_option_found": "オプションが見つかりません",
"no_recall_items_found": "リコールアイテムが見つかりません ",
"no_variables_yet_add_first_one_below": "まだ変数がありません。以下で最初のものを追加してください。",
"number": "数値",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "一度設定すると、このフォームのデフォルト言語は、多言語オプションを無効にしてすべての翻訳を削除することによってのみ変更できます。",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PINは数字のみでなければなりません。",
"pin_must_be_a_four_digit_number": "PINは4桁の数字でなければなりません。",
"please_enter_a_file_extension": "ファイル拡張子を入力してください。",
"please_enter_a_valid_url": "有効な URL を入力してください (例:https://example.com)",
"please_set_a_survey_trigger": "フォームのトリガーを設定してください",
"please_specify": "具体的に指定してください",
"prevent_double_submission": "二重送信を防ぐ",
@@ -1501,8 +1491,6 @@
"question_id_updated": "質問IDを更新しました",
"question_used_in_logic": "この質問は質問 {questionIndex} のロジックで使用されています。",
"question_used_in_quota": "この 質問 は \"{quotaName}\" の クオータ に使用されています",
"question_used_in_recall": "この 質問 は 質問 {questionIndex} で 呼び出され て います 。",
"question_used_in_recall_ending_card": "この 質問 は エンディング カード で 呼び出され て います。",
"quotas": {
"add_quota": "クォータを追加",
"change_quota_for_public_survey": "パブリック フォームのクォータを変更しますか?",
@@ -1537,8 +1525,6 @@
"randomize_all": "すべてをランダム化",
"randomize_all_except_last": "最後を除くすべてをランダム化",
"range": "範囲",
"recall_data": "データを呼び出す",
"recall_information_from": "... からの情報を呼び戻す",
"recontact_options": "再接触オプション",
"redirect_thank_you_card": "サンクスクカードをリダイレクト",
"redirect_to_url": "URLにリダイレクト",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "以下のアクションのいずれかが発火したときにフォームをトリガーします...",
"try_lollipop_or_mountain": "「lollipop」や「mountain」を試してみてください...",
"type_field_id": "フィールドIDを入力",
"underline": "下線",
"unlock_targeting_description": "属性またはデバイス情報に基づいて、特定のユーザーグループをターゲットにします",
"unlock_targeting_title": "上位プランでターゲティングをアンロック",
"unsaved_changes_warning": "フォームに未保存の変更があります。離れる前に保存しますか?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "変数 \"{variableName}\" は \"{quotaName}\" クォータ で使用されています",
"variable_name_is_already_taken_please_choose_another": "変数名はすでに使用されています。別の名前を選択してください。",
"variable_name_must_start_with_a_letter": "変数名はアルファベットで始まらなければなりません。",
"variable_used_in_recall": "変数 \"{variable}\" が 質問 {questionIndex} で 呼び出され て います 。",
"variable_used_in_recall_ending_card": "変数 {variable} が エンディング カード で 呼び出され て います。",
"variable_used_in_recall_welcome": "変数 \"{variable}\" が ウェルカム カード で 呼び出され て います。",
"verify_email_before_submission": "送信前にメールアドレスを認証",
"verify_email_before_submission_description": "有効なメールアドレスを持つ人のみが回答できるようにする",
"wait": "待つ",
-18
View File
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Marcar automaticamente a pesquisa como concluída após",
"back_button_label": "Voltar",
"background_styling": "Estilo de Fundo",
"bold": "Negrito",
"brand_color": "Cor da marca",
"brightness": "brilho",
"button_label": "Rótulo do Botão",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "Não inclui todos de",
"does_not_include_one_of": "Não inclui um de",
"does_not_start_with": "Não começa com",
"edit_link": "Editar link",
"edit_recall": "Editar Lembrete",
"edit_translations": "Editar traduções de {lang}",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Permitir que os participantes mudem o idioma da pesquisa a qualquer momento durante a pesquisa.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "Esse cartão de encerramento é usado na lógica da pergunta {questionIndex}.",
"ending_used_in_quota": "Este final está sendo usado na cota \"{quotaName}\"",
"ends_with": "Termina com",
"enter_fallback_value": "Insira o valor de fallback",
"equals": "Igual",
"equals_one_of": "É igual a um de",
"error_publishing_survey": "Ocorreu um erro ao publicar a pesquisa.",
@@ -1400,9 +1397,6 @@
"four_points": "4 pontos",
"heading": "Título",
"hidden_field_added_successfully": "Campo oculto adicionado com sucesso",
"hidden_field_used_in_recall": "Campo oculto \"{hiddenField}\" está sendo recordado na pergunta {questionIndex}.",
"hidden_field_used_in_recall_ending_card": "Campo oculto \"{hiddenField}\" está sendo recordado no card de Encerramento.",
"hidden_field_used_in_recall_welcome": "Campo oculto \"{hiddenField}\" está sendo recordado no card de Boas-Vindas.",
"hide_advanced_settings": "Ocultar configurações avançadas",
"hide_back_button": "Ocultar botão 'Voltar'",
"hide_back_button_description": "Não exibir o botão de voltar na pesquisa",
@@ -1421,7 +1415,6 @@
"inner_text": "Texto Interno",
"input_border_color": "Cor da borda de entrada",
"input_color": "Cor de entrada",
"insert_link": "Inserir link",
"invalid_targeting": "Segmentação inválida: Por favor, verifique os filtros do seu público",
"invalid_video_url_warning": "Por favor, insira uma URL válida do YouTube, Vimeo ou Loom. No momento, não suportamos outros provedores de vídeo.",
"invalid_youtube_url": "URL do YouTube inválida",
@@ -1439,7 +1432,6 @@
"is_set": "Está definido",
"is_skipped": "é pulado",
"is_submitted": "é submetido",
"italic": "Itálico",
"jump_to_question": "Pular para a pergunta",
"keep_current_order": "Manter pedido atual",
"keep_showing_while_conditions_match": "Continue mostrando enquanto as condições corresponderem",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "Nenhuma imagem encontrada para ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "Nenhum idioma encontrado. Adicione o primeiro para começar.",
"no_option_found": "Nenhuma opção encontrada",
"no_recall_items_found": "Nenhum item de recordação encontrado",
"no_variables_yet_add_first_one_below": "Ainda não há variáveis. Adicione a primeira abaixo.",
"number": "Número",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Depois de definido, o idioma padrão desta pesquisa só pode ser alterado desativando a opção de vários idiomas e excluindo todas as traduções.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "O PIN só pode conter números.",
"pin_must_be_a_four_digit_number": "O PIN deve ser um número de quatro dígitos.",
"please_enter_a_file_extension": "Por favor, insira uma extensão de arquivo.",
"please_enter_a_valid_url": "Por favor, insira uma URL válida (ex.: https://example.com)",
"please_set_a_survey_trigger": "Por favor, configure um gatilho para a pesquisa",
"please_specify": "Por favor, especifique",
"prevent_double_submission": "Evitar envio duplicado",
@@ -1501,8 +1491,6 @@
"question_id_updated": "ID da pergunta atualizado",
"question_used_in_logic": "Essa pergunta é usada na lógica da pergunta {questionIndex}.",
"question_used_in_quota": "Esta questão está sendo usada na cota \"{quotaName}\"",
"question_used_in_recall": "Esta pergunta está sendo recordada na pergunta {questionIndex}.",
"question_used_in_recall_ending_card": "Esta pergunta está sendo recordada no card de Encerramento",
"quotas": {
"add_quota": "Adicionar cota",
"change_quota_for_public_survey": "Alterar cota para pesquisa pública?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Randomizar tudo",
"randomize_all_except_last": "Randomizar tudo, exceto o último",
"range": "alcance",
"recall_data": "Lembrar dados",
"recall_information_from": "Recuperar informações de ...",
"recontact_options": "Opções de Recontato",
"redirect_thank_you_card": "Redirecionar cartão de agradecimento",
"redirect_to_url": "Redirecionar para URL",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Disparar pesquisa quando uma das ações for executada...",
"try_lollipop_or_mountain": "Tenta 'pirulito' ou 'montanha'...",
"type_field_id": "Digite o id do campo",
"underline": "Sublinhar",
"unlock_targeting_description": "Direcione grupos específicos de usuários com base em atributos ou informações do dispositivo",
"unlock_targeting_title": "Desbloqueie o direcionamento com um plano superior",
"unsaved_changes_warning": "Você tem alterações não salvas na sua pesquisa. Quer salvar antes de sair?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "Variável \"{variableName}\" está sendo usada na cota \"{quotaName}\"",
"variable_name_is_already_taken_please_choose_another": "O nome da variável já está em uso, por favor escolha outro.",
"variable_name_must_start_with_a_letter": "O nome da variável deve começar com uma letra.",
"variable_used_in_recall": "Variável \"{variable}\" está sendo recordada na pergunta {questionIndex}.",
"variable_used_in_recall_ending_card": "Variável {variable} está sendo recordada no card de Encerramento",
"variable_used_in_recall_welcome": "Variável \"{variable}\" está sendo recordada no Card de Boas-Vindas.",
"verify_email_before_submission": "Verifique o e-mail antes de enviar",
"verify_email_before_submission_description": "Deixe só quem tem um email real responder.",
"wait": "Espera",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "Adicionar encerramento",
"add_ending_below": "Adicionar encerramento abaixo",
"add_fallback": "Adicionar",
"add_fallback_placeholder": "Adicionar um espaço reservado para mostrar se não houver valor para recordar.",
"add_fallback_placeholder": "Adicionar um espaço reservado para mostrar se a pergunta for ignorada:",
"add_hidden_field_id": "Adicionar ID do campo oculto",
"add_highlight_border": "Adicionar borda de destaque",
"add_highlight_border_description": "Adicione uma borda externa ao seu cartão de inquérito.",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Marcar automaticamente o inquérito como concluído após",
"back_button_label": "Rótulo do botão \"Voltar\"",
"background_styling": "Estilo de Fundo",
"bold": "Negrito",
"brand_color": "Cor da marca",
"brightness": "Brilho",
"button_label": "Rótulo do botão",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "Não inclui todos de",
"does_not_include_one_of": "Não inclui um de",
"does_not_start_with": "Não começa com",
"edit_link": "Editar link",
"edit_recall": "Editar Lembrete",
"edit_translations": "Editar traduções {lang}",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Permitir aos participantes mudar a língua do inquérito a qualquer momento durante o inquérito.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "Este cartão final é usado na lógica da pergunta {questionIndex}.",
"ending_used_in_quota": "Este final está a ser usado na quota \"{quotaName}\"",
"ends_with": "Termina com",
"enter_fallback_value": "Inserir valor de substituição",
"equals": "Igual",
"equals_one_of": "Igual a um de",
"error_publishing_survey": "Ocorreu um erro ao publicar o questionário.",
@@ -1400,9 +1397,6 @@
"four_points": "4 pontos",
"heading": "Cabeçalho",
"hidden_field_added_successfully": "Campo oculto adicionado com sucesso",
"hidden_field_used_in_recall": "Campo oculto \"{hiddenField}\" está a ser recordado na pergunta {questionIndex}.",
"hidden_field_used_in_recall_ending_card": "Campo oculto \"{hiddenField}\" está a ser recordado no Cartão de Conclusão",
"hidden_field_used_in_recall_welcome": "Campo oculto \"{hiddenField}\" está a ser recordado no cartão de boas-vindas.",
"hide_advanced_settings": "Ocultar definições avançadas",
"hide_back_button": "Ocultar botão 'Retroceder'",
"hide_back_button_description": "Não mostrar o botão de retroceder no inquérito",
@@ -1421,7 +1415,6 @@
"inner_text": "Texto Interno",
"input_border_color": "Cor da borda do campo de entrada",
"input_color": "Cor do campo de entrada",
"insert_link": "Inserir ligação",
"invalid_targeting": "Segmentação inválida: Por favor, verifique os seus filtros de audiência",
"invalid_video_url_warning": "Por favor, insira um URL válido do YouTube, Vimeo ou Loom. Atualmente, não suportamos outros fornecedores de hospedagem de vídeo.",
"invalid_youtube_url": "URL do YouTube inválido",
@@ -1439,7 +1432,6 @@
"is_set": "Está definido",
"is_skipped": "É ignorado",
"is_submitted": "Está submetido",
"italic": "Itálico",
"jump_to_question": "Saltar para a pergunta",
"keep_current_order": "Manter ordem atual",
"keep_showing_while_conditions_match": "Continuar a mostrar enquanto as condições corresponderem",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "Não foram encontradas imagens para ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "Nenhuma língua encontrada. Adicione a primeira para começar.",
"no_option_found": "Nenhuma opção encontrada",
"no_recall_items_found": "Nenhum item de recordação encontrado",
"no_variables_yet_add_first_one_below": "Ainda não há variáveis. Adicione a primeira abaixo.",
"number": "Número",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Depois de definido, o idioma padrão desta pesquisa só pode ser alterado desativando a opção de vários idiomas e eliminando todas as traduções.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "O PIN só pode conter números.",
"pin_must_be_a_four_digit_number": "O PIN deve ser um número de quatro dígitos.",
"please_enter_a_file_extension": "Por favor, insira uma extensão de ficheiro.",
"please_enter_a_valid_url": "Por favor, insira um URL válido (por exemplo, https://example.com)",
"please_set_a_survey_trigger": "Por favor, defina um desencadeador de inquérito",
"please_specify": "Por favor, especifique",
"prevent_double_submission": "Impedir submissão dupla",
@@ -1501,8 +1491,6 @@
"question_id_updated": "ID da pergunta atualizado",
"question_used_in_logic": "Esta pergunta é usada na lógica da pergunta {questionIndex}.",
"question_used_in_quota": "Esta pergunta está a ser usada na quota \"{quotaName}\"",
"question_used_in_recall": "Esta pergunta está a ser recordada na pergunta {questionIndex}.",
"question_used_in_recall_ending_card": "Esta pergunta está a ser recordada no Cartão de Conclusão",
"quotas": {
"add_quota": "Adicionar quota",
"change_quota_for_public_survey": "Alterar quota para inquérito público?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Aleatorizar todos",
"randomize_all_except_last": "Aleatorizar todos exceto o último",
"range": "Intervalo",
"recall_data": "Recuperar dados",
"recall_information_from": "Recordar informação de ...",
"recontact_options": "Opções de Recontacto",
"redirect_thank_you_card": "Redirecionar cartão de agradecimento",
"redirect_to_url": "Redirecionar para Url",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Desencadear inquérito quando uma das ações for disparada...",
"try_lollipop_or_mountain": "Experimente 'lollipop' ou 'mountain'...",
"type_field_id": "Escreva o id do campo",
"underline": "Sublinhar",
"unlock_targeting_description": "Alvo de grupos de utilizadores específicos com base em atributos ou informações do dispositivo",
"unlock_targeting_title": "Desbloqueie a segmentação com um plano superior",
"unsaved_changes_warning": "Tem alterações não guardadas no seu inquérito. Gostaria de as guardar antes de sair?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "Variável \"{variableName}\" está a ser utilizada na quota \"{quotaName}\"",
"variable_name_is_already_taken_please_choose_another": "O nome da variável já está em uso, por favor escolha outro.",
"variable_name_must_start_with_a_letter": "O nome da variável deve começar com uma letra.",
"variable_used_in_recall": "Variável \"{variable}\" está a ser recordada na pergunta {questionIndex}.",
"variable_used_in_recall_ending_card": "Variável {variable} está a ser recordada no Cartão de Conclusão",
"variable_used_in_recall_welcome": "Variável \"{variable}\" está a ser recordada no cartão de boas-vindas.",
"verify_email_before_submission": "Verificar email antes da submissão",
"verify_email_before_submission_description": "Permitir apenas que pessoas com um email real respondam.",
"wait": "Aguardar",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "Adaugă finalizare",
"add_ending_below": "Adaugă finalizare mai jos",
"add_fallback": "Adaugă",
"add_fallback_placeholder": "Adaugă un placeholder pentru a afișa dacă nu există valoare de reamintit",
"add_fallback_placeholder": "Adaugă un substituent pentru a afișa dacă întrebarea este omisă:",
"add_hidden_field_id": "Adăugați ID câmp ascuns",
"add_highlight_border": "Adaugă bordură evidențiată",
"add_highlight_border_description": "Adaugă o margine exterioară cardului tău de sondaj.",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "Marcați automat sondajul ca finalizat după",
"back_button_label": "Etichetă buton \"Înapoi\"",
"background_styling": "Stilizare fundal",
"bold": "Îngroșat",
"brand_color": "Culoarea brandului",
"brightness": "Luminozitate",
"button_label": "Etichetă buton",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "Nu include toate",
"does_not_include_one_of": "Nu include una dintre",
"does_not_start_with": "Nu începe cu",
"edit_link": "Editare legătură",
"edit_recall": "Editează Referințele",
"edit_translations": "Editează traducerile {lang}",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "Permite participanților să schimbe limba sondajului în orice moment în timpul sondajului.",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "Această carte de încheiere este folosită în logica întrebării {questionIndex}.",
"ending_used_in_quota": "Finalul acesta este folosit în cota \"{quotaName}\"",
"ends_with": "Se termină cu",
"enter_fallback_value": "Introduceți valoarea implicită",
"equals": "Egal",
"equals_one_of": "Egal unu dintre",
"error_publishing_survey": "A apărut o eroare în timpul publicării sondajului.",
@@ -1400,9 +1397,6 @@
"four_points": "4 puncte",
"heading": "Titlu",
"hidden_field_added_successfully": "Câmp ascuns adăugat cu succes",
"hidden_field_used_in_recall": "Câmpul ascuns \"{hiddenField}\" este reamintit în întrebarea {questionIndex}.",
"hidden_field_used_in_recall_ending_card": "Câmpul ascuns \"{hiddenField}\" este reamintit în Cardul de Încheiere.",
"hidden_field_used_in_recall_welcome": "Câmpul ascuns \"{hiddenField}\" este reamintit în cardul de bun venit.",
"hide_advanced_settings": "Ascunde setări avansate",
"hide_back_button": "Ascunde butonul 'Înapoi'",
"hide_back_button_description": "Nu afișa butonul Înapoi în sondaj",
@@ -1421,7 +1415,6 @@
"inner_text": "Text Interior",
"input_border_color": "Culoarea graniței câmpului de introducere",
"input_color": "Culoarea câmpului de introducere",
"insert_link": "Inserează link",
"invalid_targeting": "\"Targetare nevalidă: Vă rugăm să verificați filtrele pentru audiență\"",
"invalid_video_url_warning": "Vă rugăm să introduceți un URL valid de YouTube, Vimeo sau Loom. În prezent nu susținem alți furnizori de găzduire video.",
"invalid_youtube_url": "URL YouTube invalid",
@@ -1439,7 +1432,6 @@
"is_set": "Este setat",
"is_skipped": "Este sărit",
"is_submitted": "Este trimis",
"italic": "Cursiv",
"jump_to_question": "Sări la întrebare",
"keep_current_order": "Păstrați ordinea actuală",
"keep_showing_while_conditions_match": "Continuă să afișezi cât timp condițiile se potrivesc",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "Nicio imagine găsită pentru ''{query}\"",
"no_languages_found_add_first_one_to_get_started": "Nu s-au găsit limbi. Adaugă prima pentru a începe.",
"no_option_found": "Nicio opțiune găsită",
"no_recall_items_found": "Nu s-au găsit elemente de reamintire",
"no_variables_yet_add_first_one_below": "Nu există variabile încă. Adăugați prima mai jos.",
"number": "Număr",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "Odată setată, limba implicită pentru acest sondaj poate fi schimbată doar dezactivând opțiunea multi-limbă și ștergând toate traducerile.",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PIN-ul poate conține doar numere.",
"pin_must_be_a_four_digit_number": "PIN-ul trebuie să fie un număr de patru cifre",
"please_enter_a_file_extension": "Vă rugăm să introduceți o extensie de fișier.",
"please_enter_a_valid_url": "Vă rugăm să introduceți un URL valid (de exemplu, https://example.com)",
"please_set_a_survey_trigger": "Vă rugăm să setați un declanșator sondaj",
"please_specify": "Vă rugăm să specificați",
"prevent_double_submission": "Prevenire trimitere dublă",
@@ -1501,8 +1491,6 @@
"question_id_updated": "ID întrebare actualizat",
"question_used_in_logic": "Această întrebare este folosită în logica întrebării {questionIndex}.",
"question_used_in_quota": "Întrebarea aceasta este folosită în cota \"{quotaName}\"",
"question_used_in_recall": "Această întrebare este reamintită în întrebarea {questionIndex}.",
"question_used_in_recall_ending_card": "Această întrebare este reamintită în Cardul de Încheiere.",
"quotas": {
"add_quota": "Adăugați cotă",
"change_quota_for_public_survey": "Schimbați cota pentru sondaj public?",
@@ -1537,8 +1525,6 @@
"randomize_all": "Randomizează tot",
"randomize_all_except_last": "Randomizează tot cu excepția ultimului",
"range": "Interval",
"recall_data": "Reamintiți datele",
"recall_information_from": "Reamintiți informațiile din ...",
"recontact_options": "Opțiuni de recontactare",
"redirect_thank_you_card": "Redirecționează cardul de mulțumire",
"redirect_to_url": "Redirecționează către URL",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "Declanșați sondajul atunci când una dintre acțiuni este realizată...",
"try_lollipop_or_mountain": "Încercați „lollipop” sau „mountain”...",
"type_field_id": "ID câmp tip",
"underline": "Subliniază",
"unlock_targeting_description": "Vizează grupuri specifice de utilizatori pe baza atributelor sau a informațiilor despre dispozitiv",
"unlock_targeting_title": "Deblocați țintirea cu un plan superior",
"unsaved_changes_warning": "Aveți modificări nesalvate în sondajul dumneavoastră. Doriți să le salvați înainte de a pleca?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "Variabila \"{variableName}\" este folosită în cota \"{quotaName}\"",
"variable_name_is_already_taken_please_choose_another": "Numele variabilei este deja utilizat, vă rugăm să alegeți altul.",
"variable_name_must_start_with_a_letter": "Numele variabilei trebuie să înceapă cu o literă.",
"variable_used_in_recall": "Variabila \"{variable}\" este reamintită în întrebarea {questionIndex}.",
"variable_used_in_recall_ending_card": "Variabila {variable} este reamintită în Cardul de Încheiere.",
"variable_used_in_recall_welcome": "Variabila \"{variable}\" este reamintită în cardul de bun venit.",
"verify_email_before_submission": "Verifică emailul înainte de trimitere",
"verify_email_before_submission_description": "Permite doar persoanelor cu un email real să răspundă.",
"wait": "Așteptați",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "添加结尾",
"add_ending_below": "在下方 添加 结尾",
"add_fallback": "添加",
"add_fallback_placeholder": "添加 占位符 显示 如果 没有 值以 回忆",
"add_fallback_placeholder": "添加 一个 占位符,以显示该问题是否被跳过:",
"add_hidden_field_id": "添加 隐藏 字段 ID",
"add_highlight_border": "添加 高亮 边框",
"add_highlight_border_description": "在 你的 调查 卡片 添加 外 边框。",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "自动 标记 调查 为 完成 在",
"back_button_label": "\"返回\" 按钮标签",
"background_styling": "背景 样式",
"bold": "粗体",
"brand_color": "品牌 颜色",
"brightness": "亮度",
"button_label": "按钮标签",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "不包括所有 ",
"does_not_include_one_of": "不包括一 个",
"does_not_start_with": "不 以 开头",
"edit_link": "编辑 链接",
"edit_recall": "编辑 调用",
"edit_translations": "编辑 {lang} 翻译",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "启用 参与者 在 调查 过程中 的 任何 时间 点 切换 调查 语言。",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "\"这个 结束卡片 在 问题 {questionIndex} 的 逻辑 中 使用。\"",
"ending_used_in_quota": "此 结尾 正在 被 \"{quotaName}\" 配额 使用",
"ends_with": "以...结束",
"enter_fallback_value": "输入 后备 值",
"equals": "等于",
"equals_one_of": "等于 其中 一个",
"error_publishing_survey": "发布调查时发生了错误",
@@ -1400,9 +1397,6 @@
"four_points": "4 分",
"heading": "标题",
"hidden_field_added_successfully": "隐藏字段 添加成功",
"hidden_field_used_in_recall": "隐藏 字段 \"{hiddenField}\" 正在召回于问题 {questionIndex}。",
"hidden_field_used_in_recall_ending_card": "隐藏 字段 \"{hiddenField}\" 正在召回于结束 卡",
"hidden_field_used_in_recall_welcome": "隐藏 字段 \"{hiddenField}\" 正在召回于欢迎 卡 。",
"hide_advanced_settings": "隐藏 高级设置",
"hide_back_button": "隐藏 \"返回\" 按钮",
"hide_back_button_description": "不 显示 调查 中 的 返回 按钮",
@@ -1421,7 +1415,6 @@
"inner_text": "内文",
"input_border_color": "输入 边框 颜色",
"input_color": "输入颜色",
"insert_link": "插入 链接",
"invalid_targeting": "无效的目标: 请检查 您 的受众过滤器",
"invalid_video_url_warning": "请输入有效的 YouTube、Vimeo 或 Loom URL 。我们目前不支持其他 视频 托管服务提供商。",
"invalid_youtube_url": "无效的 YouTube URL",
@@ -1439,7 +1432,6 @@
"is_set": "已设置",
"is_skipped": "已跳过",
"is_submitted": "已提交",
"italic": "斜体",
"jump_to_question": "跳 转 到 问题",
"keep_current_order": "保持 当前 顺序",
"keep_showing_while_conditions_match": "条件 符合 时 保持 显示",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "未找到与 \"{query}\" 相关的图片",
"no_languages_found_add_first_one_to_get_started": "没有找到语言。添加第一个以开始。",
"no_option_found": "找不到选择",
"no_recall_items_found": "未 找到 召回 项目",
"no_variables_yet_add_first_one_below": "还没有变量。 在下面添加第一个。",
"number": "数字",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "一旦设置,此调查的默认语言只能通过禁用多语言选项并删除所有翻译来更改。",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PIN 只能包含数字。",
"pin_must_be_a_four_digit_number": "PIN 必须是 四 位数字。",
"please_enter_a_file_extension": "请输入 文件 扩展名。",
"please_enter_a_valid_url": "请输入有效的 URL(例如, https://example.com ",
"please_set_a_survey_trigger": "请 设置 一个 调查 触发",
"please_specify": "请 指定",
"prevent_double_submission": "防止 重复 提交",
@@ -1501,8 +1491,6 @@
"question_id_updated": "问题 ID 更新",
"question_used_in_logic": "\"这个 问题 在 问题 {questionIndex} 的 逻辑 中 使用。\"",
"question_used_in_quota": "此 问题 正在 被 \"{quotaName}\" 配额 使用",
"question_used_in_recall": "此问题正在召回于问题 {questionIndex}。",
"question_used_in_recall_ending_card": "此 问题 正在召回于结束 卡片。",
"quotas": {
"add_quota": "添加 配额",
"change_quota_for_public_survey": "更改 公共调查 的配额?",
@@ -1537,8 +1525,6 @@
"randomize_all": "随机排列",
"randomize_all_except_last": "随机排列,最后一个除外",
"range": "范围",
"recall_data": "调用 数据",
"recall_information_from": "从 ... 召回信息",
"recontact_options": "重新 联系 选项",
"redirect_thank_you_card": "重定向感谢卡",
"redirect_to_url": "重定向到 URL",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "当 其中 一个 动作 被 触发 时 启动 调查…",
"try_lollipop_or_mountain": "尝试 'lollipop' 或 'mountain' ...",
"type_field_id": "类型 字段 ID",
"underline": "下划线",
"unlock_targeting_description": "根据 属性 或 设备信息 定位 特定 用户组",
"unlock_targeting_title": "通过 更 高级 划解锁 定位",
"unsaved_changes_warning": "您在调查中有未保存的更改。离开前是否要保存?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "变量 \"{variableName}\" 正在 被 \"{quotaName}\" 配额 使用",
"variable_name_is_already_taken_please_choose_another": "变量名已被占用,请选择其他。",
"variable_name_must_start_with_a_letter": "变量名 必须 以字母开头。",
"variable_used_in_recall": "变量 \"{variable}\" 正在召回于问题 {questionIndex}。",
"variable_used_in_recall_ending_card": "变量 {variable} 正在召回于结束 卡片",
"variable_used_in_recall_welcome": "变量 \"{variable}\" 正在召回于欢迎 卡 。",
"verify_email_before_submission": "提交 之前 验证电子邮件",
"verify_email_before_submission_description": "仅允许 拥有 有效 电子邮件 的 人 回应。",
"wait": "等待",
+1 -19
View File
@@ -1204,7 +1204,7 @@
"add_ending": "新增結尾",
"add_ending_below": "在下方新增結尾",
"add_fallback": "新增",
"add_fallback_placeholder": "新增 預設 以顯示是否沒 有 值 可 回憶 。",
"add_fallback_placeholder": "新增用于顯示問題被跳過時的佔位符",
"add_hidden_field_id": "新增隱藏欄位 ID",
"add_highlight_border": "新增醒目提示邊框",
"add_highlight_border_description": "在您的問卷卡片新增外邊框。",
@@ -1241,7 +1241,6 @@
"automatically_mark_the_survey_as_complete_after": "在指定時間後自動將問卷標記為完成",
"back_button_label": "「返回」按鈕標籤",
"background_styling": "背景樣式設定",
"bold": "粗體",
"brand_color": "品牌顏色",
"brightness": "亮度",
"button_label": "按鈕標籤",
@@ -1325,7 +1324,6 @@
"does_not_include_all_of": "不包含全部",
"does_not_include_one_of": "不包含其中之一",
"does_not_start_with": "不以...開頭",
"edit_link": "編輯 連結",
"edit_recall": "編輯回憶",
"edit_translations": "編輯 '{'language'}' 翻譯",
"enable_participants_to_switch_the_survey_language_at_any_point_during_the_survey": "允許參與者在問卷中的任何時間點切換問卷語言。",
@@ -1336,7 +1334,6 @@
"ending_card_used_in_logic": "此結尾卡片用於問題 '{'questionIndex'}' 的邏輯中。",
"ending_used_in_quota": "此 結尾 正被使用於 \"{quotaName}\" 配額中",
"ends_with": "結尾為",
"enter_fallback_value": "輸入 預設 值",
"equals": "等於",
"equals_one_of": "等於其中之一",
"error_publishing_survey": "發布問卷時發生錯誤。",
@@ -1400,9 +1397,6 @@
"four_points": "4 分",
"heading": "標題",
"hidden_field_added_successfully": "隱藏欄位已成功新增",
"hidden_field_used_in_recall": "隱藏欄位 \"{hiddenField}\" 於問題 {questionIndex} 中被召回。",
"hidden_field_used_in_recall_ending_card": "隱藏欄位 \"{hiddenField}\" 於結束卡中被召回。",
"hidden_field_used_in_recall_welcome": "隱藏欄位 \"{hiddenField}\" 於歡迎卡中被召回。",
"hide_advanced_settings": "隱藏進階設定",
"hide_back_button": "隱藏「Back」按鈕",
"hide_back_button_description": "不要在問卷中顯示返回按鈕",
@@ -1421,7 +1415,6 @@
"inner_text": "內部文字",
"input_border_color": "輸入邊框顏色",
"input_color": "輸入顏色",
"insert_link": "插入 連結",
"invalid_targeting": "目標設定無效:請檢查您的受眾篩選器",
"invalid_video_url_warning": "請輸入有效的 YouTube、Vimeo 或 Loom 網址。我們目前不支援其他影片託管提供者。",
"invalid_youtube_url": "無效的 YouTube 網址",
@@ -1439,7 +1432,6 @@
"is_set": "已設定",
"is_skipped": "已跳過",
"is_submitted": "已提交",
"italic": "斜體",
"jump_to_question": "跳至問題",
"keep_current_order": "保留目前順序",
"keep_showing_while_conditions_match": "在條件符合時持續顯示",
@@ -1466,7 +1458,6 @@
"no_images_found_for": "找不到「'{'query'}'」的圖片",
"no_languages_found_add_first_one_to_get_started": "找不到語言。新增第一個語言以開始使用。",
"no_option_found": "找不到選項",
"no_recall_items_found": "找不到 召回 項目",
"no_variables_yet_add_first_one_below": "尚無變數。在下方新增第一個變數。",
"number": "數字",
"once_set_the_default_language_for_this_survey_can_only_be_changed_by_disabling_the_multi_language_option_and_deleting_all_translations": "設定後,此問卷的預設語言只能藉由停用多語言選項並刪除所有翻譯來變更。",
@@ -1486,7 +1477,6 @@
"pin_can_only_contain_numbers": "PIN 碼只能包含數字。",
"pin_must_be_a_four_digit_number": "PIN 碼必須是四位數的數字。",
"please_enter_a_file_extension": "請輸入檔案副檔名。",
"please_enter_a_valid_url": "請輸入有效的 URL(例如:https://example.com",
"please_set_a_survey_trigger": "請設定問卷觸發器",
"please_specify": "請指定",
"prevent_double_submission": "防止重複提交",
@@ -1501,8 +1491,6 @@
"question_id_updated": "問題 ID 已更新",
"question_used_in_logic": "此問題用於問題 '{'questionIndex'}' 的邏輯中。",
"question_used_in_quota": "此問題 正被使用於 \"{quotaName}\" 配額中",
"question_used_in_recall": "此問題於問題 {questionIndex} 中被召回。",
"question_used_in_recall_ending_card": "此問題於結尾卡中被召回。",
"quotas": {
"add_quota": "新增額度",
"change_quota_for_public_survey": "更改 公開 問卷 的 額度?",
@@ -1537,8 +1525,6 @@
"randomize_all": "全部隨機排序",
"randomize_all_except_last": "全部隨機排序(最後一項除外)",
"range": "範圍",
"recall_data": "回憶數據",
"recall_information_from": "從 ... 獲取 信息",
"recontact_options": "重新聯絡選項",
"redirect_thank_you_card": "重新導向感謝卡片",
"redirect_to_url": "重新導向至網址",
@@ -1616,7 +1602,6 @@
"trigger_survey_when_one_of_the_actions_is_fired": "當觸發其中一個操作時,觸發問卷...",
"try_lollipop_or_mountain": "嘗試「棒棒糖」或「山峰」...",
"type_field_id": "輸入欄位 ID",
"underline": "下 劃 線",
"unlock_targeting_description": "根據屬性或裝置資訊鎖定特定使用者群組",
"unlock_targeting_title": "使用更高等級的方案解鎖目標設定",
"unsaved_changes_warning": "您的問卷中有未儲存的變更。您要先儲存它們再離開嗎?",
@@ -1633,9 +1618,6 @@
"variable_is_used_in_quota_please_remove_it_from_quota_first": "變數 \"{variableName}\" 正被使用於 \"{quotaName}\" 配額中",
"variable_name_is_already_taken_please_choose_another": "已使用此變數名稱,請選擇另一個名稱。",
"variable_name_must_start_with_a_letter": "變數名稱必須以字母開頭。",
"variable_used_in_recall": "變數 \"{variable}\" 於問題 {questionIndex} 中被召回。",
"variable_used_in_recall_ending_card": "變數 {variable} 於 結束 卡 中被召回。",
"variable_used_in_recall_welcome": "變數 \"{variable}\" 於 歡迎 Card 中被召回。",
"verify_email_before_submission": "提交前驗證電子郵件",
"verify_email_before_submission_description": "僅允許擁有真實電子郵件的人員回應。",
"wait": "等待",
@@ -1,12 +1,12 @@
"use client";
import { getLocalizedValue } from "@/lib/i18n/utils";
import { parseRecallInfo } from "@/lib/utils/recall";
import { ResponseCardQuotas } from "@/modules/ee/quotas/components/single-response-card-quotas";
import { useTranslate } from "@tolgee/react";
import { CheckCircle2Icon } from "lucide-react";
import { TResponseWithQuotas } from "@formbricks/types/responses";
import { TSurvey } from "@formbricks/types/surveys/types";
import { getLocalizedValue } from "@/lib/i18n/utils";
import { parseRecallInfo } from "@/lib/utils/recall";
import { ResponseCardQuotas } from "@/modules/ee/quotas/components/single-response-card-quotas";
import { isValidValue } from "../util";
import { HiddenFields } from "./HiddenFields";
import { QuestionSkip } from "./QuestionSkip";
@@ -118,7 +118,7 @@ export const SingleResponseCardBody = ({
{survey.variables.length > 0 && (
<ResponseVariables variables={survey.variables} variablesData={response.variables} />
)}
{survey.hiddenFields.fieldIds && (
{survey.hiddenFields.enabled && survey.hiddenFields.fieldIds && (
<HiddenFields hiddenFields={survey.hiddenFields} responseData={response.data} />
)}
+16 -26
View File
@@ -1,6 +1,6 @@
import { logSignOut } from "@/modules/auth/lib/utils";
import { beforeEach, describe, expect, test, vi } from "vitest";
import { logger } from "@formbricks/logger";
import { logSignOut } from "@/modules/auth/lib/utils";
import { logSignOutAction } from "./sign-out";
// Mock the dependencies
@@ -80,7 +80,6 @@ describe("logSignOutAction", () => {
"email_change",
"session_timeout",
"forced_logout",
"password_reset",
] as const;
for (const reason of reasons) {
@@ -101,14 +100,11 @@ describe("logSignOutAction", () => {
await expect(() => logSignOutAction(mockUserId, mockUserEmail, mockContext)).rejects.toThrow(mockError);
expect(logger.error).toHaveBeenCalledWith(
{
userId: mockUserId,
context: mockContext,
error: mockError.message,
},
"Failed to log sign out event"
);
expect(logger.error).toHaveBeenCalledWith("Failed to log sign out event", {
userId: mockUserId,
context: mockContext,
error: mockError.message,
});
expect(logger.error).toHaveBeenCalledTimes(1);
});
@@ -120,14 +116,11 @@ describe("logSignOutAction", () => {
await expect(() => logSignOutAction(mockUserId, mockUserEmail, mockContext)).rejects.toThrow(mockError);
expect(logger.error).toHaveBeenCalledWith(
{
userId: mockUserId,
context: mockContext,
error: mockError,
},
"Failed to log sign out event"
);
expect(logger.error).toHaveBeenCalledWith("Failed to log sign out event", {
userId: mockUserId,
context: mockContext,
error: mockError,
});
expect(logger.error).toHaveBeenCalledTimes(1);
});
@@ -140,14 +133,11 @@ describe("logSignOutAction", () => {
await expect(() => logSignOutAction(mockUserId, mockUserEmail, emptyContext)).rejects.toThrow(mockError);
expect(logger.error).toHaveBeenCalledWith(
{
userId: mockUserId,
context: emptyContext,
error: mockError.message,
},
"Failed to log sign out event"
);
expect(logger.error).toHaveBeenCalledWith("Failed to log sign out event", {
userId: mockUserId,
context: emptyContext,
error: mockError.message,
});
expect(logger.error).toHaveBeenCalledTimes(1);
});
+6 -9
View File
@@ -1,7 +1,7 @@
"use server";
import { logger } from "@formbricks/logger";
import { logSignOut } from "@/modules/auth/lib/utils";
import { logger } from "@formbricks/logger";
/**
* Logs a sign out event
@@ -27,14 +27,11 @@ export const logSignOutAction = async (
try {
logSignOut(userId, userEmail, context);
} catch (error) {
logger.error(
{
userId,
context,
error: error instanceof Error ? error.message : String(error),
},
"Failed to log sign out event"
);
logger.error("Failed to log sign out event", {
userId,
context,
error: error instanceof Error ? error.message : String(error),
});
// Re-throw to ensure callers are aware of the failure
throw error;
}
+3 -45
View File
@@ -1,7 +1,7 @@
import * as Sentry from "@sentry/nextjs";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import { queueAuditEventBackground } from "@/modules/ee/audit-logs/lib/handler";
import { UNKNOWN_DATA } from "@/modules/ee/audit-logs/types/audit-log";
import * as Sentry from "@sentry/nextjs";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import {
createAuditIdentifier,
hashPassword,
@@ -43,26 +43,16 @@ vi.mock("@/lib/constants", () => ({
}));
// Mock cache module
const { mockCache, mockLogger } = vi.hoisted(() => ({
const { mockCache } = vi.hoisted(() => ({
mockCache: {
getRedisClient: vi.fn(),
},
mockLogger: {
warn: vi.fn(),
error: vi.fn(),
info: vi.fn(),
debug: vi.fn(),
},
}));
vi.mock("@/lib/cache", () => ({
cache: mockCache,
}));
vi.mock("@formbricks/logger", () => ({
logger: mockLogger,
}));
// Mock @formbricks/cache
vi.mock("@formbricks/cache", () => ({
createCacheKey: {
@@ -135,38 +125,6 @@ describe("Auth Utils", () => {
expect(await verifyPassword(complexPassword, hashedComplex)).toBe(true);
expect(await verifyPassword("wrong", hashedComplex)).toBe(false);
});
test("should handle bcrypt errors gracefully and log warning", async () => {
// Save the original bcryptjs implementation
const originalModule = await import("bcryptjs");
// Mock bcryptjs to throw an error on compare
vi.doMock("bcryptjs", () => ({
...originalModule,
compare: vi.fn().mockRejectedValue(new Error("Invalid salt version")),
hash: originalModule.hash, // Keep hash working
}));
// Re-import the utils module to use the mocked bcryptjs
const { verifyPassword: verifyPasswordMocked } = await import("./utils?t=" + Date.now());
const password = "testPassword";
const invalidHash = "invalid-hash-format";
const result = await verifyPasswordMocked(password, invalidHash);
// Should return false for security
expect(result).toBe(false);
// Should log warning
expect(mockLogger.warn).toHaveBeenCalledWith(
{ error: expect.any(Error) },
"Password verification failed due to invalid hash format"
);
// Restore the module
vi.doUnmock("bcryptjs");
});
});
describe("Audit Identifier Utils", () => {
+6 -6
View File
@@ -1,12 +1,12 @@
import { cache } from "@/lib/cache";
import { IS_PRODUCTION, SENTRY_DSN } from "@/lib/constants";
import { queueAuditEventBackground } from "@/modules/ee/audit-logs/lib/handler";
import { TAuditAction, TAuditStatus, UNKNOWN_DATA } from "@/modules/ee/audit-logs/types/audit-log";
import * as Sentry from "@sentry/nextjs";
import { compare, hash } from "bcryptjs";
import { createHash, randomUUID } from "crypto";
import { createCacheKey } from "@formbricks/cache";
import { logger } from "@formbricks/logger";
import { cache } from "@/lib/cache";
import { IS_PRODUCTION, SENTRY_DSN } from "@/lib/constants";
import { queueAuditEventBackground } from "@/modules/ee/audit-logs/lib/handler";
import { TAuditAction, TAuditStatus, UNKNOWN_DATA } from "@/modules/ee/audit-logs/types/audit-log";
export const hashPassword = async (password: string) => {
const hashedPassword = await hash(password, 12);
@@ -19,7 +19,7 @@ export const verifyPassword = async (password: string, hashedPassword: string) =
return isValid;
} catch (error) {
// Log warning for debugging purposes, but don't throw to maintain security
logger.warn({ error }, "Password verification failed due to invalid hash format");
logger.warn("Password verification failed due to invalid hash format", { error });
// Return false for invalid hashes or other bcrypt errors
return false;
}
@@ -279,7 +279,7 @@ export const shouldLogAuthFailure = async (
return currentCount % 10 === 0 || timeSinceLastLog > 60000;
} catch (error) {
logger.warn({ error }, "Redis rate limiting failed, not logging due to Redis requirement");
logger.warn("Redis rate limiting failed, not logging due to Redis requirement", { error });
// If Redis fails, do not log as Redis is required for audit logs
return false;
}
@@ -1,9 +1,9 @@
import { beforeEach, describe, expect, test, vi } from "vitest";
import { logger } from "@formbricks/logger";
import { err, ok } from "@formbricks/types/error-handlers";
import { hashString } from "@/lib/hash-string";
// Import modules after mocking
import { getClientIpFromHeaders } from "@/lib/utils/client-ip";
import { beforeEach, describe, expect, test, vi } from "vitest";
import { logger } from "@formbricks/logger";
import { err, ok } from "@formbricks/types/error-handlers";
import { applyIPRateLimit, applyRateLimit, getClientIdentifier } from "./helpers";
import { checkRateLimit } from "./rate-limit";
@@ -67,8 +67,8 @@ describe("helpers", () => {
await expect(getClientIdentifier()).rejects.toThrow("Failed to hash IP");
// Verify that the error was logged with proper context (pino 10 format: object first, message second)
expect(logger.error).toHaveBeenCalledWith({ error: originalError }, "Failed to hash IP");
// Verify that the error was logged with proper context
expect(logger.error).toHaveBeenCalledWith("Failed to hash IP", { error: originalError });
});
});
+3 -3
View File
@@ -1,7 +1,7 @@
import { logger } from "@formbricks/logger";
import { TooManyRequestsError } from "@formbricks/types/errors";
import { hashString } from "@/lib/hash-string";
import { getClientIpFromHeaders } from "@/lib/utils/client-ip";
import { logger } from "@formbricks/logger";
import { TooManyRequestsError } from "@formbricks/types/errors";
import { checkRateLimit } from "./rate-limit";
import { type TRateLimitConfig } from "./types/rate-limit";
@@ -19,7 +19,7 @@ export const getClientIdentifier = async (): Promise<string> => {
return hashString(ip);
} catch (error) {
const errorMessage = "Failed to hash IP";
logger.error({ error }, errorMessage);
logger.error(errorMessage, { error });
throw new Error(errorMessage);
}
};
@@ -1,10 +1,10 @@
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import type { Mock } from "vitest";
import { prisma } from "@formbricks/database";
import {
TEnterpriseLicenseDetails,
TEnterpriseLicenseFeatures,
} from "@/modules/ee/license-check/types/enterprise-license";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import type { Mock } from "vitest";
import { prisma } from "@formbricks/database";
// Mock declarations must be at the top level
vi.mock("@/lib/env", () => ({
@@ -59,17 +59,6 @@ vi.mock("@formbricks/database", () => ({
},
}));
const mockLogger = {
error: vi.fn(),
warn: vi.fn(),
info: vi.fn(),
debug: vi.fn(),
};
vi.mock("@formbricks/logger", () => ({
logger: mockLogger,
}));
// Mock constants as they are used in the original license.ts indirectly
vi.mock("@/lib/constants", async (importOriginal) => {
const actual = await importOriginal();
@@ -91,10 +80,6 @@ describe("License Core Logic", () => {
mockCache.set.mockReset();
mockCache.del.mockReset();
mockCache.withCache.mockReset();
mockLogger.error.mockReset();
mockLogger.warn.mockReset();
mockLogger.info.mockReset();
mockLogger.debug.mockReset();
// Set up default mock implementations for Result types
mockCache.get.mockResolvedValue({ ok: true, data: null });
@@ -542,136 +527,4 @@ describe("License Core Logic", () => {
);
});
});
describe("Error and Warning Logging", () => {
test("should log warning when setPreviousResult cache.set fails (line 176-178)", async () => {
const { getEnterpriseLicense } = await import("./license");
const fetch = (await import("node-fetch")).default as Mock;
const mockFetchedLicenseDetails: TEnterpriseLicenseDetails = {
status: "active",
features: {
isMultiOrgEnabled: true,
contacts: true,
projects: 10,
whitelabel: true,
removeBranding: true,
twoFactorAuth: true,
sso: true,
saml: true,
spamProtection: true,
ai: false,
auditLogs: true,
multiLanguageSurveys: true,
accessControl: true,
quotas: true,
},
};
// Mock successful fetch from API
mockCache.withCache.mockResolvedValue(mockFetchedLicenseDetails);
// Mock cache.set to fail when saving previous result
mockCache.set.mockResolvedValue({
ok: false,
error: new Error("Redis connection failed"),
});
await getEnterpriseLicense();
// Verify that the warning was logged
expect(mockLogger.warn).toHaveBeenCalledWith(
{ error: new Error("Redis connection failed") },
"Failed to cache previous result"
);
});
test("should log error when trackApiError is called (line 196-203)", async () => {
const { getEnterpriseLicense } = await import("./license");
const fetch = (await import("node-fetch")).default as Mock;
// Mock cache.withCache to execute the function (simulating cache miss)
mockCache.withCache.mockImplementation(async (fn) => await fn());
// Mock API response with 500 status
const mockStatus = 500;
fetch.mockResolvedValueOnce({
ok: false,
status: mockStatus,
json: async () => ({ error: "Internal Server Error" }),
} as any);
await getEnterpriseLicense();
// Verify that the API error was logged with correct structure
expect(mockLogger.error).toHaveBeenCalledWith(
expect.objectContaining({
status: mockStatus,
code: "API_ERROR",
timestamp: expect.any(String),
}),
expect.stringContaining("License API error:")
);
});
test("should log error when trackApiError is called with different status codes (line 196-203)", async () => {
const { getEnterpriseLicense } = await import("./license");
const fetch = (await import("node-fetch")).default as Mock;
// Test with 403 Forbidden
mockCache.withCache.mockImplementation(async (fn) => await fn());
const mockStatus = 403;
fetch.mockResolvedValueOnce({
ok: false,
status: mockStatus,
json: async () => ({ error: "Forbidden" }),
} as any);
await getEnterpriseLicense();
// Verify that the API error was logged with correct structure
expect(mockLogger.error).toHaveBeenCalledWith(
expect.objectContaining({
status: mockStatus,
code: "API_ERROR",
timestamp: expect.any(String),
}),
expect.stringContaining("License API error:")
);
});
test("should log info when trackFallbackUsage is called during grace period", async () => {
const { getEnterpriseLicense } = await import("./license");
const fetch = (await import("node-fetch")).default as Mock;
const previousTime = new Date(Date.now() - 1 * 24 * 60 * 60 * 1000); // 1 day ago
const mockPreviousResult = {
active: true,
features: { removeBranding: true, projects: 5 },
lastChecked: previousTime,
version: 1,
};
mockCache.withCache.mockResolvedValue(null);
mockCache.get.mockImplementation(async (key) => {
if (key.includes(":previous_result")) {
return { ok: true, data: mockPreviousResult };
}
return { ok: true, data: null };
});
fetch.mockResolvedValueOnce({ ok: false, status: 500 } as any);
await getEnterpriseLicense();
// Verify that the fallback info was logged
expect(mockLogger.info).toHaveBeenCalledWith(
expect.objectContaining({
fallbackLevel: "grace",
timestamp: expect.any(String),
}),
expect.stringContaining("Using license fallback level: grace")
);
});
});
});
@@ -1,11 +1,4 @@
import "server-only";
import { HttpsProxyAgent } from "https-proxy-agent";
import fetch from "node-fetch";
import { cache as reactCache } from "react";
import { z } from "zod";
import { createCacheKey } from "@formbricks/cache";
import { prisma } from "@formbricks/database";
import { logger } from "@formbricks/logger";
import { cache } from "@/lib/cache";
import { env } from "@/lib/env";
import { hashString } from "@/lib/hash-string";
@@ -13,6 +6,13 @@ import {
TEnterpriseLicenseDetails,
TEnterpriseLicenseFeatures,
} from "@/modules/ee/license-check/types/enterprise-license";
import { HttpsProxyAgent } from "https-proxy-agent";
import fetch from "node-fetch";
import { cache as reactCache } from "react";
import { z } from "zod";
import { createCacheKey } from "@formbricks/cache";
import { prisma } from "@formbricks/database";
import { logger } from "@formbricks/logger";
// Configuration
const CONFIG = {
@@ -154,7 +154,7 @@ const getPreviousResult = async (): Promise<TPreviousResult> => {
};
}
} catch (error) {
logger.error({ error }, "Failed to get previous result from cache");
logger.error("Failed to get previous result from cache", { error });
}
return {
@@ -174,33 +174,27 @@ const setPreviousResult = async (previousResult: TPreviousResult) => {
CONFIG.CACHE.PREVIOUS_RESULT_TTL_MS
);
if (!result.ok) {
logger.warn({ error: result.error }, "Failed to cache previous result");
logger.warn("Failed to cache previous result", { error: result.error });
}
} catch (error) {
logger.error({ error }, "Failed to set previous result in cache");
logger.error("Failed to set previous result in cache", { error });
}
};
// Monitoring functions
const trackFallbackUsage = (level: FallbackLevel) => {
logger.info(
{
fallbackLevel: level,
timestamp: new Date().toISOString(),
},
`Using license fallback level: ${level}`
);
logger.info(`Using license fallback level: ${level}`, {
fallbackLevel: level,
timestamp: new Date().toISOString(),
});
};
const trackApiError = (error: LicenseApiError) => {
logger.error(
{
status: error.status,
code: error.code,
timestamp: new Date().toISOString(),
},
`License API error: ${error.message}`
);
logger.error(`License API error: ${error.message}`, {
status: error.status,
code: error.code,
timestamp: new Date().toISOString(),
});
};
// Validation functions
@@ -1,15 +1,15 @@
"use client";
import { extractLanguageCodes, isLabelValidForAllLanguages } from "@/lib/i18n/utils";
import { md } from "@/lib/markdownIt";
import { recallToHeadline } from "@/lib/utils/recall";
import { Editor } from "@/modules/ui/components/editor";
import { useTranslate } from "@tolgee/react";
import DOMPurify from "dompurify";
import type { Dispatch, SetStateAction } from "react";
import { useMemo } from "react";
import type { TI18nString, TSurvey } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { extractLanguageCodes, isLabelValidForAllLanguages } from "@/lib/i18n/utils";
import { md } from "@/lib/markdownIt";
import { recallToHeadline } from "@/lib/utils/recall";
import { Editor } from "@/modules/ui/components/editor";
import { LanguageIndicator } from "./language-indicator";
interface LocalizedEditorProps {
@@ -24,7 +24,6 @@ interface LocalizedEditorProps {
firstRender: boolean;
setFirstRender?: Dispatch<SetStateAction<boolean>>;
locale: TUserLocale;
questionId: string;
}
const checkIfValueIsIncomplete = (
@@ -51,8 +50,7 @@ export function LocalizedEditor({
firstRender,
setFirstRender,
locale,
questionId,
}: Readonly<LocalizedEditorProps>) {
}: LocalizedEditorProps) {
const { t } = useTranslate();
const surveyLanguageCodes = useMemo(
() => extractLanguageCodes(localSurvey.languages),
@@ -86,9 +84,6 @@ export function LocalizedEditor({
updateQuestion(questionIdx, { html: translatedHtml });
}
}}
localSurvey={localSurvey}
questionId={questionId}
selectedLanguageCode={selectedLanguageCode}
/>
{localSurvey.languages.length > 1 && (
<div>
@@ -1,15 +1,15 @@
import "@testing-library/jest-dom/vitest";
import { cleanup, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { beforeEach, describe, expect, test, vi } from "vitest";
import { TOrganization } from "@formbricks/types/organizations";
import { TUser } from "@formbricks/types/user";
import {
removeOrganizationEmailLogoUrlAction,
sendTestEmailAction,
updateOrganizationEmailLogoUrlAction,
} from "@/modules/ee/whitelabel/email-customization/actions";
import { handleFileUpload } from "@/modules/storage/file-upload";
import "@testing-library/jest-dom/vitest";
import { cleanup, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { beforeEach, describe, expect, test, vi } from "vitest";
import { TOrganization } from "@formbricks/types/organizations";
import { TUser } from "@formbricks/types/user";
import { EmailCustomizationSettings } from "./email-customization-settings";
vi.mock("@/lib/constants", () => ({
@@ -107,6 +107,7 @@ describe("EmailCustomizationSettings", () => {
const saveButton = screen.getAllByRole("button", { name: /save/i });
await user.click(saveButton[0]);
// The component calls `uploadFile` then `updateOrganizationEmailLogoUrlAction`
expect(handleFileUpload).toHaveBeenCalledWith(testFile, "env-123", ["jpeg", "png", "jpg", "webp"]);
expect(updateOrganizationEmailLogoUrlAction).toHaveBeenCalledWith({
organizationId: "org-123",
@@ -1,14 +1,5 @@
"use client";
import { useTranslate } from "@tolgee/react";
import { RepeatIcon, Trash2Icon } from "lucide-react";
import Image from "next/image";
import { useRouter } from "next/navigation";
import React, { useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { TOrganization } from "@formbricks/types/organizations";
import { TAllowedFileExtension } from "@formbricks/types/storage";
import { TUser } from "@formbricks/types/user";
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { cn } from "@/lib/cn";
import { getFormattedErrorMessage } from "@/lib/utils/helper";
@@ -24,6 +15,15 @@ import { Uploader } from "@/modules/ui/components/file-input/components/uploader
import { showStorageNotConfiguredToast } from "@/modules/ui/components/storage-not-configured-toast/lib/utils";
import { Muted, P, Small } from "@/modules/ui/components/typography";
import { ModalButton, UpgradePrompt } from "@/modules/ui/components/upgrade-prompt";
import { useTranslate } from "@tolgee/react";
import { RepeatIcon, Trash2Icon } from "lucide-react";
import Image from "next/image";
import { useRouter } from "next/navigation";
import React, { useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { TOrganization } from "@formbricks/types/organizations";
import { TAllowedFileExtension } from "@formbricks/types/storage";
import { TUser } from "@formbricks/types/user";
const allowedFileExtensions: TAllowedFileExtension[] = ["jpeg", "png", "jpg", "webp"];
@@ -1,10 +1,5 @@
"use client";
import { Project } from "@prisma/client";
import { useTranslate } from "@tolgee/react";
import Image from "next/image";
import { ChangeEvent, useRef, useState } from "react";
import toast from "react-hot-toast";
import { getFormattedErrorMessage } from "@/lib/utils/helper";
import { updateProjectAction } from "@/modules/projects/settings/actions";
import { handleFileUpload } from "@/modules/storage/file-upload";
@@ -16,6 +11,11 @@ import { DeleteDialog } from "@/modules/ui/components/delete-dialog";
import { FileInput } from "@/modules/ui/components/file-input";
import { Input } from "@/modules/ui/components/input";
import { showStorageNotConfiguredToast } from "@/modules/ui/components/storage-not-configured-toast/lib/utils";
import { Project } from "@prisma/client";
import { useTranslate } from "@tolgee/react";
import Image from "next/image";
import { ChangeEvent, useRef, useState } from "react";
import toast from "react-hot-toast";
interface EditLogoProps {
project: Project;
@@ -151,7 +151,6 @@ export const EditLogo = ({ project, environmentId, isReadOnly, isStorageConfigur
setIsEditing(true);
}}
disabled={isReadOnly}
maxSizeInMB={5}
isStorageConfigured={isStorageConfigured}
/>
)}
+2 -4
View File
@@ -1,7 +1,7 @@
export enum FileUploadError {
NO_FILE = "No file provided or invalid file type. Expected a File or Blob.",
INVALID_FILE_TYPE = "Please upload an image file.",
FILE_SIZE_EXCEEDED = "File size must be less than 5 MB.",
FILE_SIZE_EXCEEDED = "File size must be less than 10 MB.",
UPLOAD_FAILED = "Upload failed. Please try again.",
INVALID_FILE_NAME = "Invalid file name. Please rename your file and try again.",
}
@@ -36,9 +36,7 @@ export const handleFileUpload = async (
const bufferBytes = fileBuffer.byteLength;
const bufferKB = bufferBytes / 1024;
const MAX_FILE_SIZE_MB = 5;
const maxSizeInKB = MAX_FILE_SIZE_MB * 1024;
if (bufferKB > maxSizeInKB) {
if (bufferKB > 10240) {
return {
error: FileUploadError.FILE_SIZE_EXCEEDED,
url: "",
@@ -57,15 +57,15 @@ describe("FallbackInput", () => {
render(<FallbackInput {...defaultProps} />);
expect(screen.getByText("Add a placeholder to show if the question gets skipped:")).toBeInTheDocument();
expect(screen.getByLabelText("Item 1")).toBeInTheDocument();
expect(screen.getByLabelText("Item 2")).toBeInTheDocument();
expect(screen.getByRole("button", { name: "common.save" })).toBeDisabled();
expect(screen.getByPlaceholderText("Fallback for Item 1")).toBeInTheDocument();
expect(screen.getByPlaceholderText("Fallback for Item 2")).toBeInTheDocument();
expect(screen.getByRole("button", { name: "Add" })).toBeDisabled();
});
test("enables Save button when fallbacks are provided for all items", () => {
test("enables Add button when fallbacks are provided for all items", () => {
render(<FallbackInput {...defaultProps} fallbacks={{ item1: "fallback1", item2: "fallback2" }} />);
expect(screen.getByRole("button", { name: "common.save" })).toBeEnabled();
expect(screen.getByRole("button", { name: "Add" })).toBeEnabled();
});
test("updates fallbacks when input changes", async () => {
@@ -73,11 +73,10 @@ describe("FallbackInput", () => {
render(<FallbackInput {...defaultProps} />);
const input1 = screen.getByLabelText("Item 1");
await user.type(input1, "test");
const input1 = screen.getByPlaceholderText("Fallback for Item 1");
await user.type(input1, "new fallback");
// Check that setFallbacks was called (at least once)
expect(mockSetFallbacks).toHaveBeenCalled();
expect(mockSetFallbacks).toHaveBeenCalledWith({ item1: "new fallback" });
});
test("handles Enter key press correctly when input is valid", async () => {
@@ -85,7 +84,7 @@ describe("FallbackInput", () => {
render(<FallbackInput {...defaultProps} fallbacks={{ item1: "fallback1", item2: "fallback2" }} />);
const input = screen.getByLabelText("Item 1");
const input = screen.getByPlaceholderText("Fallback for Item 1");
await user.type(input, "{Enter}");
expect(mockAddFallback).toHaveBeenCalled();
@@ -97,7 +96,7 @@ describe("FallbackInput", () => {
render(<FallbackInput {...defaultProps} fallbacks={{ item1: "" }} />);
const input = screen.getByLabelText("Item 1");
const input = screen.getByPlaceholderText("Fallback for Item 1");
await user.type(input, "{Enter}");
expect(toast.error).toHaveBeenCalledWith("Fallback missing");
@@ -105,13 +104,13 @@ describe("FallbackInput", () => {
expect(mockSetOpen).not.toHaveBeenCalled();
});
test("calls addFallback when Save button is clicked", async () => {
test("calls addFallback when Add button is clicked", async () => {
const user = userEvent.setup();
render(<FallbackInput {...defaultProps} fallbacks={{ item1: "fallback1", item2: "fallback2" }} />);
const saveButton = screen.getByRole("button", { name: "common.save" });
await user.click(saveButton);
const addButton = screen.getByRole("button", { name: "Add" });
await user.click(addButton);
expect(mockAddFallback).toHaveBeenCalled();
expect(mockSetOpen).toHaveBeenCalledWith(false);
@@ -125,14 +124,14 @@ describe("FallbackInput", () => {
render(<FallbackInput {...defaultProps} filteredRecallItems={mixedRecallItems} />);
expect(screen.getByLabelText("Item 1")).toBeInTheDocument();
expect(screen.getByPlaceholderText("Fallback for Item 1")).toBeInTheDocument();
expect(screen.queryByText("undefined")).not.toBeInTheDocument();
});
test("replaces 'nbsp' with space in fallback value", () => {
render(<FallbackInput {...defaultProps} fallbacks={{ item1: "fallbacknbsptext" }} />);
const input = screen.getByLabelText("Item 1");
const input = screen.getByPlaceholderText("Fallback for Item 1");
expect(input).toHaveValue("fallback text");
});
@@ -1,31 +1,29 @@
import { useTranslate } from "@tolgee/react";
import { ReactNode } from "react";
import { toast } from "react-hot-toast";
import { TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { replaceRecallInfoWithUnderline } from "@/lib/utils/recall";
import { Button } from "@/modules/ui/components/button";
import { Input } from "@/modules/ui/components/input";
import { Label } from "@/modules/ui/components/label";
import { Popover, PopoverContent, PopoverTrigger } from "@/modules/ui/components/popover";
import { useTranslate } from "@tolgee/react";
import { RefObject } from "react";
import { toast } from "react-hot-toast";
import { TSurveyRecallItem } from "@formbricks/types/surveys/types";
interface FallbackInputProps {
filteredRecallItems: (TSurveyRecallItem | undefined)[];
fallbacks: { [type: string]: string };
setFallbacks: (fallbacks: { [type: string]: string }) => void;
fallbackInputRef: RefObject<HTMLInputElement>;
addFallback: () => void;
open: boolean;
setOpen: (open: boolean) => void;
triggerButton?: ReactNode;
}
export const FallbackInput = ({
filteredRecallItems,
fallbacks,
setFallbacks,
fallbackInputRef,
addFallback,
open,
setOpen,
triggerButton,
}: FallbackInputProps) => {
const { t } = useTranslate();
const containsEmptyFallback = () => {
@@ -34,9 +32,9 @@ export const FallbackInput = ({
};
return (
<Popover open={open} onOpenChange={setOpen}>
<Popover open={open}>
<PopoverTrigger asChild>
{open ? <div className="z-10 h-0 w-full cursor-pointer" /> : triggerButton}
<div className="z-10 h-0 w-full cursor-pointer" />
</PopoverTrigger>
<PopoverContent
@@ -46,21 +44,18 @@ export const FallbackInput = ({
sideOffset={4}>
<p className="font-medium">{t("environments.surveys.edit.add_fallback_placeholder")}</p>
<div className="mt-2 space-y-3">
<div className="mt-2 space-y-2">
{filteredRecallItems.map((recallItem, idx) => {
if (!recallItem) return null;
const inputId = `fallback-${recallItem.id}`;
return (
<div key={recallItem.id} className="flex flex-col gap-1">
<Label htmlFor={inputId} className="text-xs font-medium text-slate-700">
{replaceRecallInfoWithUnderline(recallItem.label)}
</Label>
<div key={recallItem.id} className="flex flex-col">
<Input
className="h-9 bg-white"
id={inputId}
className="placeholder:text-md h-full bg-white"
ref={idx === 0 ? fallbackInputRef : undefined}
id="fallback"
autoFocus={idx === filteredRecallItems.length - 1}
value={fallbacks[recallItem.id]?.replaceAll("nbsp", " ") || ""}
placeholder={t("environments.surveys.edit.enter_fallback_value")}
value={fallbacks[recallItem.id]?.replaceAll("nbsp", " ")}
placeholder={`${t("environments.surveys.edit.fallback_for")} ${recallItem.label}`}
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault();
@@ -85,14 +80,14 @@ export const FallbackInput = ({
<div className="flex w-full justify-end">
<Button
className="mt-2 h-9"
className="mt-2 h-full py-2"
disabled={containsEmptyFallback()}
onClick={(e) => {
e.preventDefault();
addFallback();
setOpen(false);
}}>
{t("common.save")}
{t("environments.surveys.edit.add_fallback")}
</Button>
</div>
</PopoverContent>
@@ -197,6 +197,6 @@ describe("RecallItemSelect", () => {
const searchInput = screen.getByPlaceholderText("Search options");
await user.type(searchInput, "nonexistent");
expect(screen.getByText("environments.surveys.edit.no_recall_items_found")).toBeInTheDocument();
expect(screen.getByText("No recall items found 🤷")).toBeInTheDocument();
});
});
@@ -1,4 +1,11 @@
import { useTranslate } from "@tolgee/react";
import { replaceRecallInfoWithUnderline } from "@/lib/utils/recall";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuTrigger,
} from "@/modules/ui/components/dropdown-menu";
import { Input } from "@/modules/ui/components/input";
import { DropdownMenuItem } from "@radix-ui/react-dropdown-menu";
import {
CalendarDaysIcon,
ContactIcon,
@@ -22,14 +29,6 @@ import {
TSurveyQuestionId,
TSurveyRecallItem,
} from "@formbricks/types/surveys/types";
import { replaceRecallInfoWithUnderline } from "@/lib/utils/recall";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/modules/ui/components/dropdown-menu";
import { Input } from "@/modules/ui/components/input";
const questionIconMapping = {
openText: MessageSquareTextIcon,
@@ -63,7 +62,6 @@ export const RecallItemSelect = ({
selectedLanguageCode,
}: RecallItemSelectProps) => {
const [searchValue, setSearchValue] = useState("");
const { t } = useTranslate();
const isNotAllowedQuestionType = (question: TSurveyQuestion): boolean => {
return (
question.type === "fileUpload" ||
@@ -164,66 +162,60 @@ export const RecallItemSelect = ({
};
return (
<DropdownMenu defaultOpen={true} modal={true}>
<DropdownMenuTrigger className="z-10 cursor-pointer" asChild>
<div className="flex w-full items-center justify-between overflow-hidden" />
</DropdownMenuTrigger>
<DropdownMenuContent
className="flex w-96 flex-col gap-2 bg-slate-50 p-3 text-xs text-slate-700"
align="start"
side="bottom"
data-recall-dropdown>
<p className="font-medium">{t("environments.surveys.edit.recall_information_from")}</p>
<Input
id="recallItemSearchInput"
placeholder="Search options"
className="w-full bg-white"
onChange={(e) => setSearchValue(e.target.value)}
autoFocus={true}
value={searchValue}
onKeyDown={(e) => {
if (e.key === "ArrowDown") {
document.getElementById("recallItem-0")?.focus();
}
}}
/>
<div className="max-h-72 overflow-y-auto overflow-x-hidden">
{filteredRecallItems.map((recallItem, index) => {
const IconComponent = getRecallItemIcon(recallItem);
return (
<DropdownMenuItem
id={"recallItem-" + index}
key={recallItem.id}
title={recallItem.type}
onSelect={() => {
addRecallItem({ id: recallItem.id, label: recallItem.label, type: recallItem.type });
setShowRecallItemSelect(false);
}}
autoFocus={false}
className="flex w-full cursor-pointer items-center rounded-md p-2 focus:bg-slate-200 focus:outline-none"
onKeyDown={(e) => {
if (
(e.key === "ArrowUp" && index === 0) ||
(e.key === "ArrowDown" && index === filteredRecallItems.length - 1)
) {
e.preventDefault();
document.getElementById("recallItemSearchInput")?.focus();
}
}}>
<div>{IconComponent && <IconComponent className="mr-2 w-4" />}</div>
<p className="max-w-full overflow-hidden text-ellipsis whitespace-nowrap text-sm">
{getRecallLabel(recallItem.label)}
</p>
</DropdownMenuItem>
);
})}
{filteredRecallItems.length === 0 && (
<p className="p-2 text-sm font-medium text-slate-700">
{t("environments.surveys.edit.no_recall_items_found")}
</p>
)}
</div>
</DropdownMenuContent>
</DropdownMenu>
<>
<DropdownMenu defaultOpen={true} modal={false}>
<DropdownMenuTrigger className="z-10 cursor-pointer" asChild>
<div className="flex h-0 w-full items-center justify-between overflow-hidden" />
</DropdownMenuTrigger>
<DropdownMenuContent className="w-96 bg-slate-50 text-slate-700" align="start" side="bottom">
<p className="m-2 text-sm font-medium">Recall Information from...</p>
<Input
id="recallItemSearchInput"
placeholder="Search options"
className="mb-1 w-full bg-white"
onChange={(e) => setSearchValue(e.target.value)}
autoFocus={true}
value={searchValue}
onKeyDown={(e) => {
if (e.key === "ArrowDown") {
document.getElementById("recallItem-0")?.focus();
}
}}
/>
<div className="max-h-72 overflow-y-auto overflow-x-hidden">
{filteredRecallItems.map((recallItem, index) => {
const IconComponent = getRecallItemIcon(recallItem);
return (
<DropdownMenuItem
id={"recallItem-" + index}
key={recallItem.id}
title={recallItem.label}
onSelect={() => {
addRecallItem({ id: recallItem.id, label: recallItem.label, type: recallItem.type });
setShowRecallItemSelect(false);
}}
autoFocus={false}
className="flex w-full cursor-pointer items-center rounded-md p-2 focus:bg-slate-200 focus:outline-none"
onKeyDown={(e) => {
if (e.key === "ArrowUp" && index === 0) {
document.getElementById("recallItemSearchInput")?.focus();
} else if (e.key === "ArrowDown" && index === filteredRecallItems.length - 1) {
document.getElementById("recallItemSearchInput")?.focus();
}
}}>
<div>{IconComponent && <IconComponent className="mr-2 w-4" />}</div>
<p className="max-w-full overflow-hidden text-ellipsis whitespace-nowrap text-sm">
{getRecallLabel(recallItem.label)}
</p>
</DropdownMenuItem>
);
})}
{filteredRecallItems.length === 0 && (
<p className="p-2 text-sm font-medium text-slate-700">No recall items found 🤷</p>
)}
</div>
</DropdownMenuContent>
</DropdownMenu>
</>
);
};
@@ -1,11 +1,11 @@
import * as recallUtils from "@/lib/utils/recall";
import { RecallItemSelect } from "@/modules/survey/components/question-form-input/components/recall-item-select";
import "@testing-library/jest-dom/vitest";
import { cleanup, fireEvent, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { toast } from "react-hot-toast";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import * as recallUtils from "@/lib/utils/recall";
import { RecallItemSelect } from "@/modules/survey/components/question-form-input/components/recall-item-select";
import { RecallWrapper } from "./recall-wrapper";
vi.mock("react-hot-toast", () => ({
@@ -144,16 +144,82 @@ describe("RecallWrapper", () => {
expect(RecallItemSelect).toHaveBeenCalled();
});
test("detects recall items when value contains recall syntax", () => {
test("handles fallback addition through user interaction and verifies state changes", async () => {
// Start with a value that already contains a recall item
const valueWithRecall = "Test with #recall:testId/fallback:# inside";
const recallItems = [{ id: "testId", label: "testLabel", type: "question" }] as TSurveyRecallItem[];
// Set up mocks to simulate the component's recall detection and fallback functionality
vi.mocked(recallUtils.getRecallItems).mockReturnValue(recallItems);
vi.mocked(recallUtils.findRecallInfoById).mockReturnValue("#recall:testId/fallback:#");
vi.mocked(recallUtils.getFallbackValues).mockReturnValue({ testId: "" });
render(<RecallWrapper {...defaultProps} value={valueWithRecall} />);
// Track onChange and onAddFallback calls to verify component state changes
const onChangeMock = vi.fn();
const onAddFallbackMock = vi.fn();
// Verify that recall items are detected
expect(recallUtils.getRecallItems).toHaveBeenCalledWith(valueWithRecall, expect.any(Object), "en");
render(
<RecallWrapper
{...defaultProps}
value={valueWithRecall}
onChange={onChangeMock}
onAddFallback={onAddFallbackMock}
/>
);
// Verify that the edit recall button appears (indicating recall item is detected)
expect(screen.getByText("Edit Recall")).toBeInTheDocument();
// Click the "Edit Recall" button to trigger the fallback addition flow
await userEvent.click(screen.getByText("Edit Recall"));
// Since the mocked FallbackInput renders a simplified version,
// check if the fallback input interface is shown
const { FallbackInput } = await import(
"@/modules/survey/components/question-form-input/components/fallback-input"
);
const FallbackInputMock = vi.mocked(FallbackInput);
// If the FallbackInput is rendered, verify its state and simulate the fallback addition
if (FallbackInputMock.mock.calls.length > 0) {
// Get the functions from the mock call
const lastCall = FallbackInputMock.mock.calls[FallbackInputMock.mock.calls.length - 1][0];
const { addFallback, setFallbacks } = lastCall;
// Simulate user adding a fallback value
setFallbacks({ testId: "test fallback value" });
// Simulate clicking the "Add Fallback" button
addFallback();
// Verify that the component's state was updated through the callbacks
expect(onChangeMock).toHaveBeenCalled();
expect(onAddFallbackMock).toHaveBeenCalled();
// Verify that the final value reflects the fallback addition
const finalValue = onAddFallbackMock.mock.calls[0][0];
expect(finalValue).toContain("#recall:testId/fallback:");
expect(finalValue).toContain("test fallback value");
expect(finalValue).toContain("# inside");
} else {
// Verify that the component is in a state that would allow fallback addition
expect(screen.getByText("Edit Recall")).toBeInTheDocument();
// Verify that the callbacks are configured and would handle fallback addition
expect(onChangeMock).toBeDefined();
expect(onAddFallbackMock).toBeDefined();
// Simulate the expected behavior of fallback addition
// This tests that the component would handle fallback addition correctly
const simulatedFallbackValue = "Test with #recall:testId/fallback:test fallback value# inside";
onAddFallbackMock(simulatedFallbackValue);
// Verify that the simulated fallback value has the correct structure
expect(onAddFallbackMock).toHaveBeenCalledWith(simulatedFallbackValue);
expect(simulatedFallbackValue).toContain("#recall:testId/fallback:");
expect(simulatedFallbackValue).toContain("test fallback value");
expect(simulatedFallbackValue).toContain("# inside");
}
});
test("displays error when trying to add empty recall item", async () => {
@@ -197,27 +263,37 @@ describe("RecallWrapper", () => {
expect(screen.getByTestId("recall-select-visible").textContent).toBe("false");
});
test("renders recall items when value contains recall syntax", () => {
test("shows edit recall button when value contains recall syntax", () => {
const valueWithRecall = "Test with #recall:testId/fallback:# inside";
const recallItems = [{ id: "testId", label: "testLabel", type: "question" }] as TSurveyRecallItem[];
vi.mocked(recallUtils.getRecallItems).mockReturnValue(recallItems);
render(<RecallWrapper {...defaultProps} value={valueWithRecall} />);
// Verify that recall items are detected and rendered
expect(recallUtils.getRecallItems).toHaveBeenCalledWith(valueWithRecall, expect.any(Object), "en");
expect(screen.getByText("Edit Recall")).toBeInTheDocument();
});
test("handles recall item state changes", () => {
test("edit recall button toggles visibility state", async () => {
const valueWithRecall = "Test with #recall:testId/fallback:# inside";
const recallItems = [{ id: "testId", label: "testLabel", type: "question" }] as TSurveyRecallItem[];
vi.mocked(recallUtils.getRecallItems).mockReturnValue(recallItems);
render(<RecallWrapper {...defaultProps} value={valueWithRecall} />);
// Verify that recall items are detected
expect(recallUtils.getRecallItems).toHaveBeenCalledWith(valueWithRecall, expect.any(Object), "en");
const editButton = screen.getByText("Edit Recall");
// Verify the edit button is functional and clickable
expect(editButton).toBeInTheDocument();
expect(editButton).toBeEnabled();
// Click the "Edit Recall" button - this should work without errors
await userEvent.click(editButton);
// The button should still be present and functional after clicking
expect(editButton).toBeInTheDocument();
expect(editButton).toBeEnabled();
// Click again to verify the button can be clicked multiple times
await userEvent.click(editButton);
// Button should still be functional
expect(editButton).toBeInTheDocument();
expect(editButton).toBeEnabled();
});
});
@@ -1,10 +1,5 @@
"use client";
import { useTranslate } from "@tolgee/react";
import { PencilIcon } from "lucide-react";
import React, { JSX, ReactNode, useCallback, useEffect, useState } from "react";
import { toast } from "react-hot-toast";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { structuredClone } from "@/lib/pollyfills/structuredClone";
import {
extractId,
@@ -19,6 +14,11 @@ import {
import { FallbackInput } from "@/modules/survey/components/question-form-input/components/fallback-input";
import { RecallItemSelect } from "@/modules/survey/components/question-form-input/components/recall-item-select";
import { Button } from "@/modules/ui/components/button";
import { useTranslate } from "@tolgee/react";
import { PencilIcon } from "lucide-react";
import React, { JSX, ReactNode, useCallback, useEffect, useMemo, useRef, useState } from "react";
import { toast } from "react-hot-toast";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
interface RecallWrapperRenderProps {
value: string;
@@ -61,19 +61,16 @@ export const RecallWrapper = ({
const [internalValue, setInternalValue] = useState<string>(headlineToRecall(value, recallItems, fallbacks));
const [renderedText, setRenderedText] = useState<JSX.Element[]>([]);
const fallbackInputRef = useRef<HTMLInputElement>(null);
const hasRecallItems = useMemo(() => {
return recallItems.length > 0 || value?.includes("recall:");
}, [recallItems.length, value]);
useEffect(() => {
setInternalValue(headlineToRecall(value, recallItems, fallbacks));
}, [value, recallItems, fallbacks]);
// Update recall items when value changes
useEffect(() => {
if (value?.includes("#recall:")) {
const newRecallItems = getRecallItems(value, localSurvey, usedLanguageCode);
setRecallItems(newRecallItems);
}
}, [value, localSurvey, usedLanguageCode]);
const checkForRecallSymbol = useCallback((str: string) => {
// Get cursor position by finding last character
// Only trigger when @ is the last character typed
@@ -181,6 +178,12 @@ export const RecallWrapper = ({
[fallbacks, internalValue, onChange, recallItems, setInternalValue]
);
useEffect(() => {
if (showFallbackInput && fallbackInputRef.current) {
fallbackInputRef.current.focus();
}
}, [showFallbackInput]);
useEffect(() => {
const recallItemLabels = recallItems.flatMap((recallItem) => {
if (!recallItem.label.includes("#recall:")) {
@@ -252,6 +255,20 @@ export const RecallWrapper = ({
isRecallSelectVisible: showRecallItemSelect,
children: (
<div>
{hasRecallItems && (
<Button
variant="ghost"
type="button"
className="absolute right-2 top-full z-[1] flex h-6 cursor-pointer items-center rounded-b-lg rounded-t-none bg-slate-100 px-2.5 py-0 text-xs hover:bg-slate-200"
onClick={(e) => {
e.preventDefault();
setShowFallbackInput(!showFallbackInput);
}}>
{t("environments.surveys.edit.edit_recall")}
<PencilIcon className="h-3 w-3" />
</Button>
)}
{showRecallItemSelect && (
<RecallItemSelect
localSurvey={localSurvey}
@@ -264,23 +281,15 @@ export const RecallWrapper = ({
/>
)}
{recallItems.length > 0 && (
{showFallbackInput && recallItems.length > 0 && (
<FallbackInput
filteredRecallItems={recallItems}
fallbacks={fallbacks}
setFallbacks={setFallbacks}
fallbackInputRef={fallbackInputRef as React.RefObject<HTMLInputElement>}
addFallback={addFallback}
open={showFallbackInput}
setOpen={setShowFallbackInput}
triggerButton={
<Button
variant="ghost"
type="button"
className="absolute right-2 top-full z-[1] flex h-6 cursor-pointer items-center rounded-b-lg rounded-t-none bg-slate-100 px-2.5 py-0 text-xs hover:bg-slate-200">
{t("environments.surveys.edit.edit_recall")}
<PencilIcon className="h-3 w-3" />
</Button>
}
/>
)}
</div>
@@ -346,7 +346,6 @@ export const QuestionFormInput = ({
fileUrl={getFileUrl()}
videoUrl={getVideoUrl()}
isVideoAllowed={true}
maxSizeInMB={5}
isStorageConfigured={isStorageConfigured}
/>
)}
@@ -1,12 +1,12 @@
"use client";
import { LocalizedEditor } from "@/modules/ee/multi-language-surveys/components/localized-editor";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
import { Label } from "@/modules/ui/components/label";
import { useTranslate } from "@tolgee/react";
import { type JSX, useState } from "react";
import { TSurvey, TSurveyConsentQuestion } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { LocalizedEditor } from "@/modules/ee/multi-language-surveys/components/localized-editor";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
import { Label } from "@/modules/ui/components/label";
interface ConsentQuestionFormProps {
localSurvey: TSurvey;
@@ -64,7 +64,6 @@ export const ConsentQuestionForm = ({
setFirstRender={setFirstRender}
questionIdx={questionIdx}
locale={locale}
questionId={question.id}
/>
</div>
</div>
@@ -1,15 +1,15 @@
"use client";
import { useAutoAnimate } from "@formkit/auto-animate/react";
import { useTranslate } from "@tolgee/react";
import { type JSX, useState } from "react";
import { TSurvey, TSurveyCTAQuestion } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { LocalizedEditor } from "@/modules/ee/multi-language-surveys/components/localized-editor";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
import { Input } from "@/modules/ui/components/input";
import { Label } from "@/modules/ui/components/label";
import { OptionsSwitch } from "@/modules/ui/components/options-switch";
import { useAutoAnimate } from "@formkit/auto-animate/react";
import { useTranslate } from "@tolgee/react";
import { type JSX, useState } from "react";
import { TSurvey, TSurveyCTAQuestion } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
interface CTAQuestionFormProps {
localSurvey: TSurvey;
@@ -77,7 +77,6 @@ export const CTAQuestionForm = ({
setFirstRender={setFirstRender}
questionIdx={questionIdx}
locale={locale}
questionId={question.id}
/>
</div>
</div>
@@ -1,5 +1,11 @@
"use client";
import { cn } from "@/lib/cn";
import { LocalizedEditor } from "@/modules/ee/multi-language-surveys/components/localized-editor";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
import { FileInput } from "@/modules/ui/components/file-input";
import { Label } from "@/modules/ui/components/label";
import { Switch } from "@/modules/ui/components/switch";
import * as Collapsible from "@radix-ui/react-collapsible";
import { useTranslate } from "@tolgee/react";
import { Hand } from "lucide-react";
@@ -7,12 +13,6 @@ import { usePathname } from "next/navigation";
import { useState } from "react";
import { TSurvey, TSurveyQuestionId, TSurveyWelcomeCard } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { cn } from "@/lib/cn";
import { LocalizedEditor } from "@/modules/ee/multi-language-surveys/components/localized-editor";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
import { FileInput } from "@/modules/ui/components/file-input";
import { Label } from "@/modules/ui/components/label";
import { Switch } from "@/modules/ui/components/switch";
interface EditWelcomeCardProps {
localSurvey: TSurvey;
@@ -156,7 +156,6 @@ export const EditWelcomeCard = ({
setFirstRender={setFirstRender}
questionIdx={-1}
locale={locale}
questionId="start"
/>
</div>
</div>
@@ -3,20 +3,11 @@ import userEvent from "@testing-library/user-event";
import { toast } from "react-hot-toast";
import { afterEach, describe, expect, test, vi } from "vitest";
import { TSurvey } from "@formbricks/types/surveys/types";
import { extractRecallInfo } from "@/lib/utils/recall";
import { findHiddenFieldUsedInLogic, isUsedInQuota, isUsedInRecall } from "@/modules/survey/editor/lib/utils";
import { HiddenFieldsCard } from "./hidden-fields-card";
// Mock the Tag component to avoid rendering its internal logic
vi.mock("@/modules/ui/components/tag", () => ({
Tag: ({ tagName, onDelete }: { tagName: string; onDelete: (fieldId: string) => void }) => (
<div>
{tagName}
<button onClick={() => onDelete(tagName)} aria-label={`Delete ${tagName}`}>
Delete
</button>
</div>
),
Tag: ({ tagName }: { tagName: string }) => <div>{tagName}</div>,
}));
// Mock window.matchMedia
@@ -38,21 +29,9 @@ vi.mock("@formkit/auto-animate/react", () => ({
useAutoAnimate: () => [null],
}));
// Mock the recall utility functions
vi.mock("@/lib/utils/recall", () => ({
extractRecallInfo: vi.fn(),
}));
vi.mock("@/modules/survey/editor/lib/utils", () => ({
findHiddenFieldUsedInLogic: vi.fn(),
isUsedInQuota: vi.fn(),
isUsedInRecall: vi.fn(),
}));
describe("HiddenFieldsCard", () => {
afterEach(() => {
cleanup();
vi.clearAllMocks();
});
test("should render all hidden fields when localSurvey.hiddenFields.fieldIds is populated", () => {
@@ -79,7 +58,6 @@ describe("HiddenFieldsCard", () => {
setLocalSurvey={vi.fn()}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
@@ -111,7 +89,6 @@ describe("HiddenFieldsCard", () => {
setLocalSurvey={vi.fn()}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
@@ -145,7 +122,6 @@ describe("HiddenFieldsCard", () => {
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
@@ -193,7 +169,6 @@ describe("HiddenFieldsCard", () => {
setLocalSurvey={setLocalSurveyMock}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
@@ -211,303 +186,4 @@ describe("HiddenFieldsCard", () => {
expect(toastErrorSpy).toHaveBeenCalled();
expect(setLocalSurveyMock).not.toHaveBeenCalled();
});
describe("Recall Functionality", () => {
const createMockSurveyWithRecall = (fieldId: string) =>
({
id: "survey1",
name: "Test Survey",
welcomeCard: { enabled: false, headline: {} } as unknown as TSurvey["welcomeCard"],
questions: [
{
id: "question1",
headline: { en: `Question with #recall:${fieldId}/fallback:default#` },
type: "shortText",
},
],
endings: [],
hiddenFields: {
enabled: true,
fieldIds: [fieldId],
},
followUps: [],
type: "link",
createdAt: new Date("2024-01-01T00:00:00.000Z"),
updatedAt: new Date("2024-01-01T00:00:00.000Z"),
languages: [],
}) as unknown as TSurvey;
test("should remove recall info from question headlines when deleting hidden field", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
// Mock extractRecallInfo to return the recall pattern
vi.mocked(extractRecallInfo).mockReturnValue(`#recall:${fieldId}/fallback:default#`);
// Mock the utility functions to allow deletion
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
vi.mocked(isUsedInRecall).mockReturnValue(-1);
vi.mocked(isUsedInQuota).mockReturnValue(false);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(setLocalSurvey).toHaveBeenCalledWith(
expect.objectContaining({
questions: expect.arrayContaining([
expect.objectContaining({
headline: { en: "Question with " }, // Recall info should be removed
}),
]),
hiddenFields: expect.objectContaining({
fieldIds: [], // Field should be removed
}),
})
);
});
test("should prevent deletion when hidden field is used in recall in welcome card", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
const toastErrorSpy = vi.mocked(toast.error);
// Mock findHiddenFieldUsedInLogic to return -1 (not found in logic)
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
// Mock isUsedInRecall to return -2 (welcome card)
vi.mocked(isUsedInRecall).mockReturnValue(-2);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(toastErrorSpy).toHaveBeenCalledWith(
expect.stringContaining("environments.surveys.edit.hidden_field_used_in_recall_welcome")
);
expect(setLocalSurvey).not.toHaveBeenCalled();
});
test("should prevent deletion when hidden field is used in recall in ending card", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
const toastErrorSpy = vi.mocked(toast.error);
// Mock findHiddenFieldUsedInLogic to return -1 (not found in logic)
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
// Mock isUsedInRecall to return questions.length (ending card)
vi.mocked(isUsedInRecall).mockReturnValue(localSurvey.questions.length);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(toastErrorSpy).toHaveBeenCalledWith(
expect.stringContaining("environments.surveys.edit.hidden_field_used_in_recall_ending_card")
);
expect(setLocalSurvey).not.toHaveBeenCalled();
});
test("should prevent deletion when hidden field is used in recall in question", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
const toastErrorSpy = vi.mocked(toast.error);
// Mock findHiddenFieldUsedInLogic to return -1 (not found in logic)
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
// Mock isUsedInRecall to return question index
vi.mocked(isUsedInRecall).mockReturnValue(0);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(toastErrorSpy).toHaveBeenCalledWith(
expect.stringContaining("environments.surveys.edit.hidden_field_used_in_recall")
);
expect(setLocalSurvey).not.toHaveBeenCalled();
});
test("should handle multiple language codes when removing recall info", () => {
const fieldId = "testField";
const localSurvey = {
id: "survey1",
name: "Test Survey",
welcomeCard: { enabled: false, headline: {} } as unknown as TSurvey["welcomeCard"],
questions: [
{
id: "question1",
headline: {
en: `Question with #recall:${fieldId}/fallback:default#`,
es: `Pregunta con #recall:${fieldId}/fallback:default#`,
},
type: "shortText",
},
],
endings: [],
hiddenFields: {
enabled: true,
fieldIds: [fieldId],
},
followUps: [],
type: "link",
createdAt: new Date("2024-01-01T00:00:00.000Z"),
updatedAt: new Date("2024-01-01T00:00:00.000Z"),
languages: [],
} as unknown as TSurvey;
const setLocalSurvey = vi.fn();
// Mock extractRecallInfo to return the recall pattern
vi.mocked(extractRecallInfo).mockReturnValue(`#recall:${fieldId}/fallback:default#`);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Mock the utility functions to allow deletion
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
vi.mocked(isUsedInRecall).mockReturnValue(-1);
vi.mocked(isUsedInQuota).mockReturnValue(false);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(setLocalSurvey).toHaveBeenCalledWith(
expect.objectContaining({
questions: expect.arrayContaining([
expect.objectContaining({
headline: {
en: "Question with ",
es: "Pregunta con ",
}, // Recall info should be removed from both languages
}),
]),
})
);
});
test("should not remove recall info when extractRecallInfo returns null", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
// Mock extractRecallInfo to return null
vi.mocked(extractRecallInfo).mockReturnValue(null);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Mock the utility functions to allow deletion
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
vi.mocked(isUsedInRecall).mockReturnValue(-1);
vi.mocked(isUsedInQuota).mockReturnValue(false);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(setLocalSurvey).toHaveBeenCalledWith(
expect.objectContaining({
questions: expect.arrayContaining([
expect.objectContaining({
headline: { en: `Question with #recall:${fieldId}/fallback:default#` }, // Recall info should remain
}),
]),
})
);
});
test("should handle deletion when hidden field is not used in recall", () => {
const fieldId = "testField";
const localSurvey = createMockSurveyWithRecall(fieldId);
const setLocalSurvey = vi.fn();
// Mock findHiddenFieldUsedInLogic to return -1 (not found in logic)
vi.mocked(findHiddenFieldUsedInLogic).mockReturnValue(-1);
// Mock isUsedInRecall to return -1 (not found)
vi.mocked(isUsedInRecall).mockReturnValue(-1);
// Mock isUsedInQuota to return false (not used in quota)
vi.mocked(isUsedInQuota).mockReturnValue(false);
render(
<HiddenFieldsCard
localSurvey={localSurvey}
setLocalSurvey={setLocalSurvey}
activeQuestionId={"hidden"}
setActiveQuestionId={vi.fn()}
quotas={[]}
/>
);
// Find and click the delete button for the hidden field
const deleteButton = screen.getByLabelText(`Delete ${fieldId}`);
fireEvent.click(deleteButton);
expect(setLocalSurvey).toHaveBeenCalledWith(
expect.objectContaining({
hiddenFields: expect.objectContaining({
fieldIds: [], // Field should be removed
}),
})
);
});
});
});
@@ -1,5 +1,13 @@
"use client";
import { cn } from "@/lib/cn";
import { extractRecallInfo } from "@/lib/utils/recall";
import { findHiddenFieldUsedInLogic, isUsedInQuota } from "@/modules/survey/editor/lib/utils";
import { Button } from "@/modules/ui/components/button";
import { Input } from "@/modules/ui/components/input";
import { Label } from "@/modules/ui/components/label";
import { Switch } from "@/modules/ui/components/switch";
import { Tag } from "@/modules/ui/components/tag";
import { useAutoAnimate } from "@formkit/auto-animate/react";
import * as Collapsible from "@radix-ui/react-collapsible";
import { useTranslate } from "@tolgee/react";
@@ -9,13 +17,6 @@ import { toast } from "react-hot-toast";
import { TSurveyQuota } from "@formbricks/types/quota";
import { TSurvey, TSurveyHiddenFields, TSurveyQuestionId } from "@formbricks/types/surveys/types";
import { validateId } from "@formbricks/types/surveys/validation";
import { cn } from "@/lib/cn";
import { extractRecallInfo } from "@/lib/utils/recall";
import { findHiddenFieldUsedInLogic, isUsedInQuota, isUsedInRecall } from "@/modules/survey/editor/lib/utils";
import { Button } from "@/modules/ui/components/button";
import { Input } from "@/modules/ui/components/input";
import { Label } from "@/modules/ui/components/label";
import { Tag } from "@/modules/ui/components/tag";
interface HiddenFieldsCardProps {
localSurvey: TSurvey;
@@ -86,28 +87,6 @@ export const HiddenFieldsCard = ({
);
return;
}
const recallQuestionIdx = isUsedInRecall(localSurvey, fieldId);
if (recallQuestionIdx === -2) {
toast.error(
t("environments.surveys.edit.hidden_field_used_in_recall_welcome", { hiddenField: fieldId })
);
return;
}
if (recallQuestionIdx === localSurvey.questions.length) {
toast.error(
t("environments.surveys.edit.hidden_field_used_in_recall_ending_card", { hiddenField: fieldId })
);
return;
}
if (recallQuestionIdx !== -1) {
toast.error(
t("environments.surveys.edit.hidden_field_used_in_recall", {
hiddenField: fieldId,
questionIndex: recallQuestionIdx + 1,
})
);
return;
}
const quotaIdx = quotas.findIndex((quota) => isUsedInQuota(quota, { hiddenFieldId: fieldId }));
@@ -166,6 +145,21 @@ export const HiddenFieldsCard = ({
<p className="text-sm font-semibold">{t("common.hidden_fields")}</p>
</div>
</div>
<div className="flex items-center space-x-2">
<Label htmlFor="hidden-fields-toggle">
{localSurvey?.hiddenFields?.enabled ? t("common.on") : t("common.off")}
</Label>
<Switch
id="hidden-fields-toggle"
checked={localSurvey?.hiddenFields?.enabled}
onClick={(e) => {
e.stopPropagation();
updateSurvey({ enabled: !localSurvey.hiddenFields?.enabled });
}}
/>
</div>
</div>
</Collapsible.CollapsibleTrigger>
<Collapsible.CollapsibleContent className={`flex flex-col px-4 ${open && "pb-6"}`} ref={parent}>
@@ -224,7 +218,7 @@ export const HiddenFieldsCard = ({
onChange={(e) => setHiddenField(e.target.value.trim())}
placeholder={t("environments.surveys.edit.type_field_id") + "..."}
/>
<Button variant="secondary" type="submit" className="h-10 whitespace-nowrap">
<Button variant="secondary" type="submit" size="sm" className="whitespace-nowrap">
{t("environments.surveys.edit.add_hidden_field_id")}
</Button>
</div>
@@ -1,6 +1,6 @@
import { UploadImageSurveyBg } from "@/modules/survey/editor/components/image-survey-bg";
import { cleanup, render, screen } from "@testing-library/react";
import { afterEach, describe, expect, test, vi } from "vitest";
import { UploadImageSurveyBg } from "@/modules/survey/editor/components/image-survey-bg";
// Create a ref to store the props passed to FileInput
const mockFileInputProps: any = { current: null };
@@ -44,7 +44,7 @@ describe("UploadImageSurveyBg", () => {
allowedFileExtensions: ["png", "jpeg", "jpg", "webp", "heic"],
environmentId: mockEnvironmentId,
fileUrl: mockBackground,
maxSizeInMB: 5,
maxSizeInMB: 2,
});
});
@@ -197,7 +197,7 @@ describe("UploadImageSurveyBg", () => {
expect(mockHandleBgChange).not.toHaveBeenCalled();
});
test("should not call handleBgChange when a file exceeding 5MB size limit is uploaded", () => {
test("should not call handleBgChange when a file exceeding 2MB size limit is uploaded", () => {
render(
<UploadImageSurveyBg
environmentId={mockEnvironmentId}
@@ -209,7 +209,7 @@ describe("UploadImageSurveyBg", () => {
// Verify FileInput was rendered with correct maxSizeInMB prop
expect(screen.getByTestId("file-input-mock")).toBeInTheDocument();
expect(mockFileInputProps.current?.maxSizeInMB).toBe(5);
expect(mockFileInputProps.current?.maxSizeInMB).toBe(2);
// Get the onFileUpload function from the props passed to FileInput
const onFileUpload = mockFileInputProps.current?.onFileUpload;
@@ -28,7 +28,7 @@ export const UploadImageSurveyBg = ({
}
}}
fileUrl={background}
maxSizeInMB={5}
maxSizeInMB={2}
isStorageConfigured={isStorageConfigured}
/>
</div>
@@ -1,12 +1,5 @@
"use client";
import { useAutoAnimate } from "@formkit/auto-animate/react";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import { PlusIcon } from "lucide-react";
import type { JSX } from "react";
import { TSurvey, TSurveyPictureSelectionQuestion } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { cn } from "@/lib/cn";
import { createI18nString, extractLanguageCodes } from "@/lib/i18n/utils";
import { QuestionFormInput } from "@/modules/survey/components/question-form-input";
@@ -14,6 +7,13 @@ import { Button } from "@/modules/ui/components/button";
import { FileInput } from "@/modules/ui/components/file-input";
import { Label } from "@/modules/ui/components/label";
import { Switch } from "@/modules/ui/components/switch";
import { useAutoAnimate } from "@formkit/auto-animate/react";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import { PlusIcon } from "lucide-react";
import type { JSX } from "react";
import { TSurvey, TSurveyPictureSelectionQuestion } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
interface PictureSelectionFormProps {
localSurvey: TSurvey;
@@ -141,7 +141,6 @@ export const PictureSelectionForm = ({
onFileUpload={handleFileInputChanges}
fileUrl={question?.choices?.map((choice) => choice.imageUrl)}
multiple={true}
maxSizeInMB={5}
isStorageConfigured={isStorageConfigured}
/>
</div>
@@ -1,3 +1,5 @@
import { checkForEmptyFallBackValue } from "@/lib/utils/recall";
import { validateQuestion, validateSurveyQuestionsInBatch } from "@/modules/survey/editor/lib/validation";
import { DndContext } from "@dnd-kit/core";
import { createId } from "@paralleldrive/cuid2";
import { Language, Project } from "@prisma/client";
@@ -13,8 +15,6 @@ import {
TSurveyQuestionTypeEnum,
} from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { checkForEmptyFallBackValue } from "@/lib/utils/recall";
import { validateQuestion, validateSurveyQuestionsInBatch } from "@/modules/survey/editor/lib/validation";
import { QuestionsView } from "./questions-view";
// Mock dependencies
@@ -53,7 +53,6 @@ vi.mock("@/lib/surveyLogic/utils", () => ({
vi.mock("@/lib/utils/recall", () => ({
checkForEmptyFallBackValue: vi.fn(),
extractRecallInfo: vi.fn(),
isUsedInRecall: vi.fn().mockReturnValue(-1),
}));
vi.mock("@/modules/ee/multi-language-surveys/components/multi-language-card", () => ({
@@ -135,7 +134,6 @@ vi.mock("@/modules/survey/editor/components/survey-variables-card", () => ({
vi.mock("@/modules/survey/editor/lib/utils", () => ({
findQuestionUsedInLogic: vi.fn(() => -1),
isUsedInQuota: vi.fn(() => false),
isUsedInRecall: vi.fn(() => -1),
}));
vi.mock("@dnd-kit/core", async (importOriginal) => {
@@ -1,5 +1,19 @@
"use client";
import { getDefaultEndingCard } from "@/app/lib/survey-builder";
import { addMultiLanguageLabels, extractLanguageCodes } from "@/lib/i18n/utils";
import { structuredClone } from "@/lib/pollyfills/structuredClone";
import { isConditionGroup } from "@/lib/surveyLogic/utils";
import { checkForEmptyFallBackValue, extractRecallInfo } from "@/lib/utils/recall";
import { MultiLanguageCard } from "@/modules/ee/multi-language-surveys/components/multi-language-card";
import { AddEndingCardButton } from "@/modules/survey/editor/components/add-ending-card-button";
import { AddQuestionButton } from "@/modules/survey/editor/components/add-question-button";
import { EditEndingCard } from "@/modules/survey/editor/components/edit-ending-card";
import { EditWelcomeCard } from "@/modules/survey/editor/components/edit-welcome-card";
import { HiddenFieldsCard } from "@/modules/survey/editor/components/hidden-fields-card";
import { QuestionsDroppable } from "@/modules/survey/editor/components/questions-droppable";
import { SurveyVariablesCard } from "@/modules/survey/editor/components/survey-variables-card";
import { findQuestionUsedInLogic, isUsedInQuota } from "@/modules/survey/editor/lib/utils";
import {
DndContext,
DragEndEvent,
@@ -27,20 +41,6 @@ import {
import { TSurvey, TSurveyQuestion } from "@formbricks/types/surveys/types";
import { findQuestionsWithCyclicLogic } from "@formbricks/types/surveys/validation";
import { TUserLocale } from "@formbricks/types/user";
import { getDefaultEndingCard } from "@/app/lib/survey-builder";
import { addMultiLanguageLabels, extractLanguageCodes } from "@/lib/i18n/utils";
import { structuredClone } from "@/lib/pollyfills/structuredClone";
import { isConditionGroup } from "@/lib/surveyLogic/utils";
import { checkForEmptyFallBackValue, extractRecallInfo } from "@/lib/utils/recall";
import { MultiLanguageCard } from "@/modules/ee/multi-language-surveys/components/multi-language-card";
import { AddEndingCardButton } from "@/modules/survey/editor/components/add-ending-card-button";
import { AddQuestionButton } from "@/modules/survey/editor/components/add-question-button";
import { EditEndingCard } from "@/modules/survey/editor/components/edit-ending-card";
import { EditWelcomeCard } from "@/modules/survey/editor/components/edit-welcome-card";
import { HiddenFieldsCard } from "@/modules/survey/editor/components/hidden-fields-card";
import { QuestionsDroppable } from "@/modules/survey/editor/components/questions-droppable";
import { SurveyVariablesCard } from "@/modules/survey/editor/components/survey-variables-card";
import { findQuestionUsedInLogic, isUsedInQuota, isUsedInRecall } from "@/modules/survey/editor/lib/utils";
import {
isEndingCardValid,
isWelcomeCardValid,
@@ -277,18 +277,6 @@ export const QuestionsView = ({
return;
}
const recallQuestionIdx = isUsedInRecall(localSurvey, questionId);
if (recallQuestionIdx === localSurvey.questions.length) {
toast.error(t("environments.surveys.edit.question_used_in_recall_ending_card"));
return;
}
if (recallQuestionIdx !== -1) {
toast.error(
t("environments.surveys.edit.question_used_in_recall", { questionIndex: recallQuestionIdx + 1 })
);
return;
}
const quotaIdx = quotas.findIndex((quota) => isUsedInQuota(quota, { questionId }));
if (quotaIdx !== -1) {
toast.error(
@@ -1,10 +1,10 @@
import * as utils from "@/modules/survey/editor/lib/utils";
import { cleanup, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import React from "react";
import { FormProvider, useForm } from "react-hook-form";
import { afterEach, describe, expect, test, vi } from "vitest";
import { TSurvey, TSurveyVariable } from "@formbricks/types/surveys/types";
import * as utils from "@/modules/survey/editor/lib/utils";
import { SurveyVariablesCardItem } from "./survey-variables-card-item";
vi.mock("@/modules/survey/editor/lib/utils", () => {
@@ -17,7 +17,6 @@ vi.mock("@/modules/survey/editor/lib/utils", () => {
}),
translateOptions: vi.fn().mockReturnValue([]),
validateLogic: vi.fn(),
isUsedInRecall: vi.fn().mockReturnValue(-1),
};
});
@@ -401,9 +400,6 @@ describe("SurveyVariablesCardItem", () => {
const findVariableUsedInLogicMock = vi.fn().mockReturnValue(-1);
vi.spyOn(utils, "findVariableUsedInLogic").mockImplementation(findVariableUsedInLogicMock);
// Explicitly mock isUsedInRecall to return -1
vi.mocked(utils.isUsedInRecall).mockReturnValue(-1);
const initialSurvey = {
id: "survey123",
createdAt: new Date(),
@@ -428,7 +424,7 @@ describe("SurveyVariablesCardItem", () => {
{
id: "q1",
type: "openText",
headline: { default: "Question without recall" },
headline: { default: "Question with recall:recallVarId in it" },
required: false,
},
],
@@ -457,244 +453,4 @@ describe("SurveyVariablesCardItem", () => {
expect(mockSetLocalSurvey).toHaveBeenCalledTimes(1);
expect(mockSetLocalSurvey).toHaveBeenCalledWith(expect.any(Function));
});
test("should show error toast if trying to delete a variable used in recall and not call setLocalSurvey", async () => {
const variableUsedInRecall = {
id: "recallVarId",
name: "recall_variable",
type: "text",
value: "recall_value",
} as TSurveyVariable;
const mockSetLocalSurvey = vi.fn();
// Mock findVariableUsedInLogic to return -1, indicating the variable is not used in logic
const findVariableUsedInLogicMock = vi.fn().mockReturnValue(-1);
vi.spyOn(utils, "findVariableUsedInLogic").mockImplementation(findVariableUsedInLogicMock);
// Mock isUsedInRecall to return 2, indicating the variable is used in recall at question index 2
const isUsedInRecallMock = vi.fn().mockReturnValue(2);
vi.spyOn(utils, "isUsedInRecall").mockImplementation(isUsedInRecallMock);
const initialSurvey = {
id: "survey123",
createdAt: new Date(),
updatedAt: new Date(),
name: "Test Survey",
status: "draft",
environmentId: "env123",
type: "app",
welcomeCard: {
enabled: true,
timeToFinish: false,
headline: { default: "Welcome" },
buttonLabel: { default: "Start" },
showResponseCount: false,
},
autoClose: null,
delay: 0,
displayOption: "displayOnce",
recontactDays: null,
displayLimit: null,
questions: [
{
id: "q1",
type: "openText",
headline: { default: "Question 1" },
required: false,
},
{
id: "q2",
type: "openText",
headline: { default: "Question 2" },
required: false,
},
{
id: "q3",
type: "openText",
headline: { default: "Question with recall #recall:recallVarId/fallback:default" },
required: false,
},
],
endings: [],
hiddenFields: {
enabled: true,
fieldIds: ["field1", "field2"],
},
variables: [variableUsedInRecall],
} as unknown as TSurvey;
render(
<SurveyVariablesCardItem
mode="edit"
localSurvey={initialSurvey}
setLocalSurvey={mockSetLocalSurvey}
variable={variableUsedInRecall}
quotas={[]}
/>
);
const deleteButton = screen.getByRole("button");
await userEvent.click(deleteButton);
expect(utils.findVariableUsedInLogic).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(utils.isUsedInRecall).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(mockSetLocalSurvey).not.toHaveBeenCalled();
});
test("should show error toast if trying to delete a variable used in recall in welcome card", async () => {
const variableUsedInRecall = {
id: "recallVarId",
name: "recall_variable",
type: "text",
value: "recall_value",
} as TSurveyVariable;
const mockSetLocalSurvey = vi.fn();
// Mock findVariableUsedInLogic to return -1, indicating the variable is not used in logic
const findVariableUsedInLogicMock = vi.fn().mockReturnValue(-1);
vi.spyOn(utils, "findVariableUsedInLogic").mockImplementation(findVariableUsedInLogicMock);
// Mock isUsedInRecall to return -2, indicating the variable is used in recall in welcome card
const isUsedInRecallMock = vi.fn().mockReturnValue(-2);
vi.spyOn(utils, "isUsedInRecall").mockImplementation(isUsedInRecallMock);
const initialSurvey = {
id: "survey123",
createdAt: new Date(),
updatedAt: new Date(),
name: "Test Survey",
status: "draft",
environmentId: "env123",
type: "app",
welcomeCard: {
enabled: true,
timeToFinish: false,
headline: { default: "Welcome #recall:recallVarId/fallback:default" },
buttonLabel: { default: "Start" },
showResponseCount: false,
},
autoClose: null,
delay: 0,
displayOption: "displayOnce",
recontactDays: null,
displayLimit: null,
questions: [],
endings: [],
hiddenFields: {
enabled: true,
fieldIds: ["field1", "field2"],
},
variables: [variableUsedInRecall],
} as unknown as TSurvey;
render(
<SurveyVariablesCardItem
mode="edit"
localSurvey={initialSurvey}
setLocalSurvey={mockSetLocalSurvey}
variable={variableUsedInRecall}
quotas={[]}
/>
);
const deleteButton = screen.getByRole("button");
await userEvent.click(deleteButton);
expect(utils.findVariableUsedInLogic).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(utils.isUsedInRecall).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(mockSetLocalSurvey).not.toHaveBeenCalled();
});
test("should show error toast if trying to delete a variable used in recall in ending card", async () => {
const variableUsedInRecall = {
id: "recallVarId",
name: "recall_variable",
type: "text",
value: "recall_value",
} as TSurveyVariable;
const mockSetLocalSurvey = vi.fn();
// Mock findVariableUsedInLogic to return -1, indicating the variable is not used in logic
const findVariableUsedInLogicMock = vi.fn().mockReturnValue(-1);
vi.spyOn(utils, "findVariableUsedInLogic").mockImplementation(findVariableUsedInLogicMock);
// Mock isUsedInRecall to return questions.length, indicating the variable is used in recall in ending card
const isUsedInRecallMock = vi.fn().mockReturnValue(3); // 3 questions, so ending card index is 3
vi.spyOn(utils, "isUsedInRecall").mockImplementation(isUsedInRecallMock);
const initialSurvey = {
id: "survey123",
createdAt: new Date(),
updatedAt: new Date(),
name: "Test Survey",
status: "draft",
environmentId: "env123",
type: "app",
welcomeCard: {
enabled: true,
timeToFinish: false,
headline: { default: "Welcome" },
buttonLabel: { default: "Start" },
showResponseCount: false,
},
autoClose: null,
delay: 0,
displayOption: "displayOnce",
recontactDays: null,
displayLimit: null,
questions: [
{
id: "q1",
type: "openText",
headline: { default: "Question 1" },
required: false,
},
{
id: "q2",
type: "openText",
headline: { default: "Question 2" },
required: false,
},
{
id: "q3",
type: "openText",
headline: { default: "Question 3" },
required: false,
},
],
endings: [
{
id: "end1",
type: "endScreen" as const,
headline: { default: "Thank you #recall:recallVarId/fallback:default" },
subheader: { default: "End message" },
},
],
hiddenFields: {
enabled: true,
fieldIds: ["field1", "field2"],
},
variables: [variableUsedInRecall],
} as unknown as TSurvey;
render(
<SurveyVariablesCardItem
mode="edit"
localSurvey={initialSurvey}
setLocalSurvey={mockSetLocalSurvey}
variable={variableUsedInRecall}
quotas={[]}
/>
);
const deleteButton = screen.getByRole("button");
await userEvent.click(deleteButton);
expect(utils.findVariableUsedInLogic).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(utils.isUsedInRecall).toHaveBeenCalledWith(initialSurvey, variableUsedInRecall.id);
expect(mockSetLocalSurvey).not.toHaveBeenCalled();
});
});
@@ -1,15 +1,7 @@
"use client";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import { TrashIcon } from "lucide-react";
import React, { useCallback } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TSurveyQuota } from "@formbricks/types/quota";
import { TSurvey, TSurveyVariable } from "@formbricks/types/surveys/types";
import { extractRecallInfo } from "@/lib/utils/recall";
import { findVariableUsedInLogic, isUsedInQuota, isUsedInRecall } from "@/modules/survey/editor/lib/utils";
import { findVariableUsedInLogic, isUsedInQuota } from "@/modules/survey/editor/lib/utils";
import { Button } from "@/modules/ui/components/button";
import { FormControl, FormField, FormItem, FormProvider } from "@/modules/ui/components/form";
import { Input } from "@/modules/ui/components/input";
@@ -21,6 +13,14 @@ import {
SelectTrigger,
SelectValue,
} from "@/modules/ui/components/select";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import { TrashIcon } from "lucide-react";
import React, { useCallback } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TSurveyQuota } from "@formbricks/types/quota";
import { TSurvey, TSurveyVariable } from "@formbricks/types/surveys/types";
interface SurveyVariablesCardItemProps {
variable?: TSurveyVariable;
@@ -93,32 +93,6 @@ export const SurveyVariablesCardItem = ({
);
return;
}
const recallQuestionIdx = isUsedInRecall(localSurvey, variableToDelete.id);
if (recallQuestionIdx === -2) {
toast.error(
t("environments.surveys.edit.variable_used_in_recall_welcome", { variable: variableToDelete.name })
);
return;
}
if (recallQuestionIdx === localSurvey.questions.length) {
toast.error(
t("environments.surveys.edit.variable_used_in_recall_ending_card", {
variable: variableToDelete.name,
})
);
return;
}
if (recallQuestionIdx !== -1) {
toast.error(
t("environments.surveys.edit.variable_used_in_recall", {
variable: variableToDelete.name,
questionIndex: recallQuestionIdx + 1,
})
);
return;
}
const quotaIdx = quotas.findIndex((quota) => isUsedInQuota(quota, { variableId: variableToDelete.id }));
@@ -1,3 +1,4 @@
import * as recallUtils from "@/lib/utils/recall";
import { cleanup } from "@testing-library/react";
import { TFnType } from "@tolgee/react";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
@@ -18,7 +19,6 @@ import {
findOptionUsedInLogic,
findQuestionUsedInLogic,
findVariableUsedInLogic,
formatTextWithSlashes,
getActionObjectiveOptions,
getActionOperatorOptions,
getActionTargetOptions,
@@ -29,11 +29,9 @@ import {
getDefaultOperatorForQuestion,
getFormatLeftOperandValue,
getMatchValueProps,
getQuestionOperatorOptions,
getSurveyFollowUpActionDefaultBody,
hasJumpToQuestionAction,
isUsedInQuota,
isUsedInRecall,
replaceEndingCardHeadlineRecall,
} from "./utils";
@@ -381,11 +379,7 @@ const createMockCondition = (leftOperandType: string): TSingleCondition => ({
id: "condition1",
leftOperand: {
type: leftOperandType as "question" | "variable" | "hiddenField",
value: (() => {
if (leftOperandType === "question") return "question1";
if (leftOperandType === "variable") return "var1";
return "field1";
})(),
value: leftOperandType === "question" ? "question1" : leftOperandType === "variable" ? "var1" : "field1",
},
operator: "equals",
rightOperand: {
@@ -427,24 +421,6 @@ describe("Survey Editor Utils", () => {
const result = extractParts("");
expect(result).toEqual([""]);
});
test("extracts parts from text with slash and backslash delimiters", () => {
const text = "Hello /world\\ and /universe\\";
const result = extractParts(text);
expect(result).toEqual(["Hello ", "world", " and ", "universe"]);
});
test("handles unmatched closing backslash", () => {
const text = "Hello world\\";
const result = extractParts(text);
expect(result).toEqual(["Hello world\\"]);
});
test("handles multiple delimiter pairs", () => {
const text = "/first\\ and /second\\ and /third\\";
const result = extractParts(text);
expect(result).toEqual(["first", " and ", "second", " and ", "third"]);
});
});
describe("getConditionValueOptions", () => {
@@ -496,12 +472,13 @@ describe("Survey Editor Utils", () => {
describe("replaceEndingCardHeadlineRecall", () => {
test("replaces ending card headlines with recalled values", () => {
const survey = createMockSurvey();
const recallToHeadlineSpy = vi.fn();
const recallToHeadlineSpy = vi.spyOn(recallUtils, "recallToHeadline");
replaceEndingCardHeadlineRecall(survey, "en");
// Should call recallToHeadline for the ending with type 'endScreen'
expect(recallToHeadlineSpy).toHaveBeenCalledTimes(0); // Mock is called, not spy
expect(recallToHeadlineSpy).toHaveBeenCalledTimes(1);
expect(recallToHeadlineSpy).toHaveBeenCalledWith(expect.any(Object), expect.any(Object), false, "en");
});
test("returns a new survey object without modifying the original", () => {
@@ -1433,191 +1410,4 @@ describe("Survey Editor Utils", () => {
expect(result).toBe(true);
});
});
describe("formatTextWithSlashes", () => {
test("should format text with slash and backslash delimiters and default classNames", () => {
const text = "Hello /world\\";
const result = formatTextWithSlashes(text);
expect(result).toHaveLength(2);
expect(result[0]).toBe("Hello ");
// Check that the second element is a JSX element
expect(typeof result[1]).toBe("object");
});
test("should format text with custom prefix and classNames", () => {
const text = "Hello /world\\";
const result = formatTextWithSlashes(text, "prefix-", ["custom-class"]);
expect(result).toHaveLength(2);
expect(result[0]).toBe("Hello ");
// Check that the second element is a JSX element
expect(typeof result[1]).toBe("object");
});
test("should handle text without delimiters", () => {
const text = "Hello world";
const result = formatTextWithSlashes(text);
expect(result).toEqual(["Hello world"]);
});
test("should handle empty text", () => {
const text = "";
const result = formatTextWithSlashes(text);
expect(result).toEqual([""]);
});
});
describe("getQuestionOperatorOptions", () => {
test("should return operator options for openText question", () => {
const survey = createMockSurvey();
const question = survey.questions[0];
const result = getQuestionOperatorOptions(question, mockT);
expect(result).toBeDefined();
expect(Array.isArray(result)).toBe(true);
});
test("should return operator options for matrix question", () => {
const survey = createMockSurvey();
const question = survey.questions[9]; // Matrix question
const condition: TSingleCondition = {
id: "condition1",
leftOperand: { type: "question", value: "question10", meta: { row: "0" } },
operator: "equals",
};
const result = getQuestionOperatorOptions(question, mockT, condition);
expect(result).toBeDefined();
expect(Array.isArray(result)).toBe(true);
});
test("should filter out isSkipped for required questions", () => {
const survey = createMockSurvey();
const requiredQuestion = { ...survey.questions[0], required: true };
const result = getQuestionOperatorOptions(requiredQuestion, mockT);
const hasIsSkipped = result.some((option) => option.value === "isSkipped");
expect(hasIsSkipped).toBe(false);
});
});
describe("isUsedInRecall", () => {
test("should find recall pattern in welcome card", () => {
const surveyWithRecall = {
...createMockSurvey(),
welcomeCard: {
enabled: true,
timeToFinish: false,
showResponseCount: false,
headline: { default: "Welcome #recall:question1/fallback:default" },
html: { default: "Welcome HTML" },
},
} as TSurvey;
const result = isUsedInRecall(surveyWithRecall, "question1");
expect(result).toBe(-2); // Special index for welcome card
});
test("should find recall pattern in question", () => {
const surveyWithRecall = {
...createMockSurvey(),
questions: [
...createMockSurvey().questions,
{
id: "question11",
type: TSurveyQuestionTypeEnum.OpenText,
headline: { default: "Question #recall:question1/fallback:default" },
subheader: { default: "" },
required: false,
inputType: "text",
placeholder: { default: "Enter text" },
longAnswer: false,
logic: [],
charLimit: { enabled: false },
},
],
} as TSurvey;
const result = isUsedInRecall(surveyWithRecall, "question1");
expect(result).toBe(10); // Index of question11
});
test("should find recall pattern in ending cards", () => {
const surveyWithRecall = {
...createMockSurvey(),
endings: [
{
id: "end1",
type: "endScreen" as const,
headline: { default: "Thank you #recall:question1/fallback:default" },
subheader: { default: "End message" },
},
],
} as TSurvey;
const result = isUsedInRecall(surveyWithRecall, "question1");
expect(result).toBe(10); // Special index for ending cards (questions.length)
});
test("should return -1 when recall pattern is not found", () => {
const survey = createMockSurvey();
const result = isUsedInRecall(survey, "question999");
expect(result).toBe(-1);
});
test("should find recall pattern in question subheader", () => {
const surveyWithRecall = {
...createMockSurvey(),
questions: [
...createMockSurvey().questions,
{
id: "question11",
type: TSurveyQuestionTypeEnum.OpenText,
headline: { default: "Question" },
subheader: { default: "Subheader #recall:question1/fallback:default" },
required: false,
inputType: "text",
placeholder: { default: "Enter text" },
longAnswer: false,
logic: [],
charLimit: { enabled: false },
},
],
} as TSurvey;
const result = isUsedInRecall(surveyWithRecall, "question1");
expect(result).toBe(10); // Index of question11
});
test("should find recall pattern in question html field", () => {
const surveyWithRecall = {
...createMockSurvey(),
questions: [
...createMockSurvey().questions,
{
id: "question11",
type: TSurveyQuestionTypeEnum.Consent,
headline: { default: "Question" },
html: { default: "HTML #recall:question1/fallback:default" },
required: false,
},
],
} as TSurvey;
const result = isUsedInRecall(surveyWithRecall, "question1");
expect(result).toBe(10); // Index of question11
});
});
});
+5 -78
View File
@@ -1,15 +1,18 @@
import { getLocalizedValue } from "@/lib/i18n/utils";
import { isConditionGroup } from "@/lib/surveyLogic/utils";
import { recallToHeadline } from "@/lib/utils/recall";
import { getQuestionTypes } from "@/modules/survey/lib/questions";
import { TComboboxGroupedOption, TComboboxOption } from "@/modules/ui/components/input-combo-box";
import { TFnType } from "@tolgee/react";
import { EyeOffIcon, FileDigitIcon, FileType2Icon } from "lucide-react";
import { HTMLInputTypeAttribute, JSX } from "react";
import { TSurveyQuota } from "@formbricks/types/quota";
import {
TConditionGroup,
TI18nString,
TLeftOperand,
TRightOperand,
TSingleCondition,
TSurvey,
TSurveyEndings,
TSurveyLogic,
TSurveyLogicAction,
TSurveyLogicActions,
@@ -18,13 +21,7 @@ import {
TSurveyQuestionId,
TSurveyQuestionTypeEnum,
TSurveyVariable,
TSurveyWelcomeCard,
} from "@formbricks/types/surveys/types";
import { getLocalizedValue } from "@/lib/i18n/utils";
import { isConditionGroup } from "@/lib/surveyLogic/utils";
import { recallToHeadline } from "@/lib/utils/recall";
import { getQuestionTypes } from "@/modules/survey/lib/questions";
import { TComboboxGroupedOption, TComboboxOption } from "@/modules/ui/components/input-combo-box";
import { TLogicRuleOption, getLogicRules } from "./logic-rule-engine";
export const MAX_STRING_LENGTH = 2000;
@@ -1256,76 +1253,6 @@ export const isUsedInQuota = (
return false;
};
const checkTextForRecallPattern = (textObject: TI18nString | undefined, recallPattern: string): boolean => {
return textObject ? Object.values(textObject).some((text: string) => text.includes(recallPattern)) : false;
};
const checkWelcomeCardForRecall = (welcomeCard: TSurveyWelcomeCard, recallPattern: string): boolean => {
if (!welcomeCard.enabled) return false;
return (
checkTextForRecallPattern(welcomeCard.headline, recallPattern) ||
checkTextForRecallPattern(welcomeCard.html, recallPattern)
);
};
const checkQuestionForRecall = (question: TSurveyQuestion, recallPattern: string): boolean => {
// Check headline
if (Object.values(question.headline).some((text) => text.includes(recallPattern))) {
return true;
}
// Check subheader
if (checkTextForRecallPattern(question.subheader, recallPattern)) {
return true;
}
// Check html field (for consent and CTA questions)
if ("html" in question && checkTextForRecallPattern(question.html, recallPattern)) {
return true;
}
return false;
};
const checkEndingCardsForRecall = (endings: TSurveyEndings | undefined, recallPattern: string): boolean => {
if (!endings) return false;
return endings.some((ending) => {
if (ending.type === "endScreen") {
return (
checkTextForRecallPattern(ending.headline, recallPattern) ||
checkTextForRecallPattern(ending.subheader, recallPattern)
);
}
return false;
});
};
export const isUsedInRecall = (survey: TSurvey, id: string): number => {
const recallPattern = `#recall:${id}/fallback:`;
// Check welcome card
if (checkWelcomeCardForRecall(survey.welcomeCard, recallPattern)) {
return -2; // Special index for welcome card
}
// Check questions
const questionIndex = survey.questions.findIndex((question) =>
checkQuestionForRecall(question, recallPattern)
);
if (questionIndex !== -1) {
return questionIndex;
}
// Check ending cards
if (checkEndingCardsForRecall(survey.endings, recallPattern)) {
return survey.questions.length; // Special index for ending cards
}
return -1; // Not found
};
export const findOptionUsedInLogic = (
survey: TSurvey,
questionId: TSurveyQuestionId,
@@ -1,24 +1,5 @@
"use client";
import { zodResolver } from "@hookform/resolvers/zod";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import DOMpurify from "isomorphic-dompurify";
import {
ArrowDownIcon,
EyeOffIcon,
HandshakeIcon,
MailIcon,
TriangleAlertIcon,
UserIcon,
ZapIcon,
} from "lucide-react";
import { useEffect, useMemo, useRef, useState } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TSurveyFollowUpAction, TSurveyFollowUpTrigger } from "@formbricks/database/types/survey-follow-up";
import { TSurvey, TSurveyQuestionTypeEnum } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
import { getLocalizedValue } from "@/lib/i18n/utils";
import { recallToHeadline } from "@/lib/utils/recall";
import { getSurveyFollowUpActionDefaultBody } from "@/modules/survey/editor/lib/utils";
@@ -60,6 +41,25 @@ import {
SelectValue,
} from "@/modules/ui/components/select";
import { cn } from "@/modules/ui/lib/utils";
import { zodResolver } from "@hookform/resolvers/zod";
import { createId } from "@paralleldrive/cuid2";
import { useTranslate } from "@tolgee/react";
import DOMpurify from "isomorphic-dompurify";
import {
ArrowDownIcon,
EyeOffIcon,
HandshakeIcon,
MailIcon,
TriangleAlertIcon,
UserIcon,
ZapIcon,
} from "lucide-react";
import { useEffect, useMemo, useRef, useState } from "react";
import { useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { TSurveyFollowUpAction, TSurveyFollowUpTrigger } from "@formbricks/database/types/survey-follow-up";
import { TSurvey, TSurveyQuestionTypeEnum } from "@formbricks/types/surveys/types";
import { TUserLocale } from "@formbricks/types/user";
interface AddFollowUpModalProps {
localSurvey: TSurvey;
@@ -118,9 +118,10 @@ export const FollowUpModal = ({
return false;
});
const hiddenFields = localSurvey.hiddenFields.fieldIds
? { fieldIds: localSurvey.hiddenFields.fieldIds }
: { fieldIds: [] };
const hiddenFields =
localSurvey.hiddenFields.enabled && localSurvey.hiddenFields.fieldIds
? { fieldIds: localSurvey.hiddenFields.fieldIds }
: { fieldIds: [] };
const updatedTeamMemberDetails = teamMemberDetails.map((teamMemberDetail) => {
if (teamMemberDetail.email === userEmail) {
+4 -6
View File
@@ -1,8 +1,5 @@
"use server";
import { z } from "zod";
import { ResourceNotFoundError } from "@formbricks/types/errors";
import { ZSurveyFilterCriteria } from "@formbricks/types/surveys/types";
import { authenticatedActionClient } from "@/lib/utils/action-client";
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
@@ -22,6 +19,9 @@ import {
getSurvey,
getSurveys,
} from "@/modules/survey/list/lib/survey";
import { z } from "zod";
import { ResourceNotFoundError } from "@formbricks/types/errors";
import { ZSurveyFilterCriteria } from "@formbricks/types/surveys/types";
const ZGetSurveyAction = z.object({
surveyId: z.string().cuid2(),
@@ -53,7 +53,6 @@ const ZCopySurveyToOtherEnvironmentAction = z.object({
environmentId: z.string().cuid2(),
surveyId: z.string().cuid2(),
targetEnvironmentId: z.string().cuid2(),
copyResponses: z.boolean().default(false),
});
export const copySurveyToOtherEnvironmentAction = authenticatedActionClient
@@ -121,8 +120,7 @@ export const copySurveyToOtherEnvironmentAction = authenticatedActionClient
parsedInput.environmentId,
parsedInput.surveyId,
parsedInput.targetEnvironmentId,
ctx.user.id,
parsedInput.copyResponses
ctx.user.id
);
ctx.auditLoggingCtx.newObject = result;
return result;
@@ -1,10 +1,5 @@
"use client";
import { zodResolver } from "@hookform/resolvers/zod";
import { useTranslate } from "@tolgee/react";
import { AlertCircleIcon, CopyIcon, DatabaseIcon } from "lucide-react";
import { useFieldArray, useForm } from "react-hook-form";
import toast from "react-hot-toast";
import { getFormattedErrorMessage } from "@/lib/utils/helper";
import { copySurveyToOtherEnvironmentAction } from "@/modules/survey/list/actions";
import { TUserProject } from "@/modules/survey/list/types/projects";
@@ -13,7 +8,11 @@ import { Button } from "@/modules/ui/components/button";
import { Checkbox } from "@/modules/ui/components/checkbox";
import { FormControl, FormField, FormItem, FormProvider } from "@/modules/ui/components/form";
import { Label } from "@/modules/ui/components/label";
import { OptionsSwitch } from "@/modules/ui/components/options-switch";
import { zodResolver } from "@hookform/resolvers/zod";
import { useTranslate } from "@tolgee/react";
import { AlertCircleIcon } from "lucide-react";
import { useFieldArray, useForm } from "react-hook-form";
import toast from "react-hot-toast";
interface CopySurveyFormProps {
readonly defaultProjects: TUserProject[];
@@ -108,7 +107,6 @@ export const CopySurveyForm = ({ defaultProjects, survey, onCancel, setOpen }: C
project: project.id,
environments: [],
})),
copyMode: "survey_only",
},
});
@@ -134,7 +132,6 @@ export const CopySurveyForm = ({ defaultProjects, survey, onCancel, setOpen }: C
environmentId: survey.environmentId,
surveyId: survey.id,
targetEnvironmentId: environmentId,
copyResponses: data.copyMode === "survey_with_responses",
}),
projectName: project?.name ?? "Unknown Project",
environmentType: environment?.type ?? "unknown",
@@ -186,7 +183,6 @@ export const CopySurveyForm = ({ defaultProjects, survey, onCancel, setOpen }: C
});
}
} catch (error) {
console.error("Error copying survey:", error);
toast.error(t("environments.surveys.copy_survey_error"));
} finally {
setOpen(false);
@@ -197,42 +193,6 @@ export const CopySurveyForm = ({ defaultProjects, survey, onCancel, setOpen }: C
<FormProvider {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="flex h-full w-full flex-col bg-white">
<div className="flex-1 space-y-8 overflow-y-auto">
<div className="mb-6">
<Label htmlFor="copyMode">{t("common.copy_options")}</Label>
<div className="mt-2">
<FormField
control={form.control}
name="copyMode"
render={({ field }) => (
<FormItem>
<FormControl>
<OptionsSwitch
options={[
{
value: "survey_only",
label: t("environments.surveys.survey_only"),
icon: <CopyIcon className="h-4 w-4" />,
},
{
value: "survey_with_responses",
label: t("environments.surveys.survey_with_responses"),
icon: <DatabaseIcon className="h-4 w-4" />,
},
]}
currentOption={field.value}
handleOptionChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
</div>
<p className="mt-2 text-sm text-slate-500">
{form.watch("copyMode") === "survey_with_responses"
? t("environments.surveys.copy_with_responses_description")
: t("environments.surveys.copy_survey_only_description")}
</p>
</div>
{formFields.fields.map((field, projectIndex) => {
const project = filteredProjects.find((project) => project.id === field.project);
if (!project) return null;
@@ -1,372 +0,0 @@
import "server-only";
import { createId } from "@paralleldrive/cuid2";
import { Prisma } from "@prisma/client";
import { prisma } from "@formbricks/database";
import { logger } from "@formbricks/logger";
import { DatabaseError, ResourceNotFoundError } from "@formbricks/types/errors";
import { createTag, getTag } from "@/lib/tag/service";
const STORAGE_URL_PATTERN = /\/storage\/([^/]+)\/(public|private)\/([^/\s]+)/g;
const BATCH_SIZE = 100;
interface CopyResponsesResult {
copiedCount: number;
errors: string[];
}
export const extractFileUrlsFromResponseData = (data: Prisma.JsonValue): string[] => {
const urls: string[] = [];
const extractFromValue = (value: any): void => {
if (typeof value === "string") {
const matches = value.matchAll(STORAGE_URL_PATTERN);
for (const match of matches) {
urls.push(match[0]);
}
} else if (Array.isArray(value)) {
value.forEach(extractFromValue);
} else if (value && typeof value === "object") {
Object.values(value).forEach(extractFromValue);
}
};
extractFromValue(data);
return [...new Set(urls)];
};
export const downloadAndReuploadFile = async (
fileUrl: string,
sourceEnvironmentId: string,
targetEnvironmentId: string
): Promise<string | null> => {
try {
const match = fileUrl.match(/\/storage\/([^/]+)\/(public|private)\/([^/\s]+)/);
if (!match) {
logger.error(`Invalid file URL format: ${fileUrl}`);
return null;
}
const [, urlEnvironmentId, accessType, fileName] = match;
if (urlEnvironmentId !== sourceEnvironmentId) {
logger.warn(`File URL environment ID mismatch: ${urlEnvironmentId} vs ${sourceEnvironmentId}`);
}
const newFileName = fileName.includes("--fid--")
? fileName.replace(/--fid--[^.]+/, `--fid--${createId()}`)
: `${fileName}--fid--${createId()}`;
const newUrl = fileUrl.replace(
`/storage/${urlEnvironmentId}/${accessType}/${fileName}`,
`/storage/${targetEnvironmentId}/${accessType}/${newFileName}`
);
return newUrl;
} catch (error) {
logger.error(`Error processing file URL ${fileUrl}:`, error);
return null;
}
};
export const rewriteFileUrlsInData = (
data: Prisma.JsonValue,
urlMap: Map<string, string>
): Prisma.JsonValue => {
const rewriteValue = (value: any): any => {
if (typeof value === "string") {
let result = value;
urlMap.forEach((newUrl, oldUrl) => {
result = result.replace(oldUrl, newUrl);
});
return result;
} else if (Array.isArray(value)) {
return value.map(rewriteValue);
} else if (value && typeof value === "object") {
const rewritten: any = {};
for (const [key, val] of Object.entries(value)) {
rewritten[key] = rewriteValue(val);
}
return rewritten;
}
return value;
};
return rewriteValue(data);
};
export const mapOrCreateContact = async (
sourceContactId: string | null,
targetEnvironmentId: string
): Promise<string | null> => {
if (!sourceContactId) {
return null;
}
try {
const sourceContact = await prisma.contact.findUnique({
where: { id: sourceContactId },
include: { attributes: true },
});
if (!sourceContact) {
return null;
}
let targetContact = await prisma.contact.findFirst({
where: {
environmentId: targetEnvironmentId,
},
});
if (!targetContact) {
targetContact = await prisma.contact.create({
data: {
environmentId: targetEnvironmentId,
},
});
}
return targetContact.id;
} catch (error) {
logger.error(`Error mapping contact ${sourceContactId}:`, error);
return null;
}
};
export const mapOrCreateTags = async (
sourceTagIds: string[],
targetEnvironmentId: string
): Promise<string[]> => {
if (sourceTagIds.length === 0) {
return [];
}
try {
const sourceTags = await prisma.tag.findMany({
where: { id: { in: sourceTagIds } },
});
const targetTagIds: string[] = [];
for (const sourceTag of sourceTags) {
let targetTag = await getTag(targetEnvironmentId, sourceTag.name);
if (!targetTag) {
targetTag = await createTag(targetEnvironmentId, sourceTag.name);
}
targetTagIds.push(targetTag.id);
}
return targetTagIds;
} catch (error) {
logger.error(`Error mapping tags:`, error);
return [];
}
};
const processResponseFileUrls = async (
data: Prisma.JsonValue,
sourceEnvironmentId: string,
targetEnvironmentId: string
): Promise<Prisma.JsonValue> => {
const fileUrls = extractFileUrlsFromResponseData(data);
const urlMap = new Map<string, string>();
for (const oldUrl of fileUrls) {
const newUrl = await downloadAndReuploadFile(oldUrl, sourceEnvironmentId, targetEnvironmentId);
if (newUrl) {
urlMap.set(oldUrl, newUrl);
}
}
return rewriteFileUrlsInData(data, urlMap);
};
const createResponseQuotaLinks = async (
response: any,
newResponseId: string,
targetSurvey: any
): Promise<void> => {
if (response.quotaLinks.length === 0 || targetSurvey.quotas.length === 0) {
return;
}
const quotaNameToIdMap = new Map(targetSurvey.quotas.map((q: any) => [q.name, q.id]));
const quotaLinksToCreate = response.quotaLinks
.map((link: any) => {
const targetQuotaId = quotaNameToIdMap.get(link.quota.name);
if (targetQuotaId) {
return {
responseId: newResponseId,
quotaId: targetQuotaId,
status: link.status,
};
}
return null;
})
.filter((link: any): link is NonNullable<typeof link> => link !== null);
if (quotaLinksToCreate.length > 0) {
await prisma.responseQuotaLink.createMany({
data: quotaLinksToCreate,
skipDuplicates: true,
});
}
};
const createResponseDisplay = async (
response: any,
targetSurveyId: string,
targetContactId: string | null
): Promise<void> => {
if (response.display && targetContactId) {
await prisma.display.create({
data: {
surveyId: targetSurveyId,
contactId: targetContactId,
createdAt: response.display.createdAt,
updatedAt: new Date(),
},
});
}
};
const copySingleResponse = async (
response: any,
targetSurveyId: string,
sourceEnvironmentId: string,
targetEnvironmentId: string,
targetSurvey: any
): Promise<void> => {
const rewrittenData = await processResponseFileUrls(
response.data,
sourceEnvironmentId,
targetEnvironmentId
);
const targetContactId = await mapOrCreateContact(response.contactId, targetEnvironmentId);
const sourceTagIds = response.tags.map((t: any) => t.tag.id);
const targetTagIds = await mapOrCreateTags(sourceTagIds, targetEnvironmentId);
const newResponseId = createId();
await prisma.response.create({
data: {
id: newResponseId,
surveyId: targetSurveyId,
finished: response.finished,
data: rewrittenData,
variables: response.variables,
ttc: response.ttc,
meta: response.meta,
contactAttributes: response.contactAttributes,
contactId: targetContactId,
endingId: response.endingId,
singleUseId: response.singleUseId,
language: response.language,
createdAt: response.createdAt,
updatedAt: new Date(),
},
});
if (targetTagIds.length > 0) {
await prisma.tagsOnResponses.createMany({
data: targetTagIds.map((tagId) => ({
responseId: newResponseId,
tagId,
})),
skipDuplicates: true,
});
}
await createResponseQuotaLinks(response, newResponseId, targetSurvey);
await createResponseDisplay(response, targetSurveyId, targetContactId);
};
export const copyResponsesForSurvey = async (params: {
sourceSurveyId: string;
targetSurveyId: string;
sourceEnvironmentId: string;
targetEnvironmentId: string;
batchSize?: number;
}): Promise<CopyResponsesResult> => {
const {
sourceSurveyId,
targetSurveyId,
sourceEnvironmentId,
targetEnvironmentId,
batchSize = BATCH_SIZE,
} = params;
const result: CopyResponsesResult = {
copiedCount: 0,
errors: [],
};
try {
const targetSurvey = await prisma.survey.findUnique({
where: { id: targetSurveyId },
include: { quotas: true },
});
if (!targetSurvey) {
throw new ResourceNotFoundError("Target survey", targetSurveyId);
}
let offset = 0;
let hasMore = true;
while (hasMore) {
const responses = await prisma.response.findMany({
where: { surveyId: sourceSurveyId },
include: {
tags: { include: { tag: true } },
quotaLinks: { include: { quota: true } },
display: true,
},
take: batchSize,
skip: offset,
orderBy: { createdAt: "asc" },
});
if (responses.length === 0) {
break;
}
for (const response of responses) {
try {
await copySingleResponse(
response,
targetSurveyId,
sourceEnvironmentId,
targetEnvironmentId,
targetSurvey
);
result.copiedCount++;
} catch (error) {
const errorMessage = error instanceof Error ? error.message : "Unknown error";
result.errors.push(`Response ${response.id}: ${errorMessage}`);
logger.error(`Error copying response ${response.id}:`, error);
}
}
if (responses.length < batchSize) {
hasMore = false;
} else {
offset += batchSize;
}
}
logger.info(
`Copied ${result.copiedCount} responses from survey ${sourceSurveyId} to ${targetSurveyId}. Errors: ${result.errors.length}`
);
return result;
} catch (error) {
logger.error(`Fatal error copying responses:`, error);
throw error instanceof DatabaseError ? error : new DatabaseError((error as Error).message);
}
};
+10 -33
View File
@@ -1,4 +1,13 @@
import "server-only";
import { getOrganizationByEnvironmentId } from "@/lib/organization/service";
import { checkForInvalidImagesInQuestions } from "@/lib/survey/utils";
import { validateInputs } from "@/lib/utils/validate";
import { getIsQuotasEnabled } from "@/modules/ee/license-check/lib/utils";
import { getQuotas } from "@/modules/ee/quotas/lib/quotas";
import { buildOrderByClause, buildWhereClause } from "@/modules/survey/lib/utils";
import { doesEnvironmentExist } from "@/modules/survey/list/lib/environment";
import { getProjectWithLanguagesByEnvironmentId } from "@/modules/survey/list/lib/project";
import { TProjectWithLanguages, TSurvey } from "@/modules/survey/list/types/surveys";
import { createId } from "@paralleldrive/cuid2";
import { Prisma } from "@prisma/client";
import { cache as reactCache } from "react";
@@ -7,16 +16,6 @@ import { prisma } from "@formbricks/database";
import { logger } from "@formbricks/logger";
import { DatabaseError, ResourceNotFoundError } from "@formbricks/types/errors";
import { TSurveyFilterCriteria } from "@formbricks/types/surveys/types";
import { getOrganizationByEnvironmentId } from "@/lib/organization/service";
import { checkForInvalidImagesInQuestions } from "@/lib/survey/utils";
import { validateInputs } from "@/lib/utils/validate";
import { getIsQuotasEnabled } from "@/modules/ee/license-check/lib/utils";
import { getQuotas } from "@/modules/ee/quotas/lib/quotas";
import { buildOrderByClause, buildWhereClause } from "@/modules/survey/lib/utils";
import { copyResponsesForSurvey } from "@/modules/survey/list/lib/copy-survey-responses";
import { doesEnvironmentExist } from "@/modules/survey/list/lib/environment";
import { getProjectWithLanguagesByEnvironmentId } from "@/modules/survey/list/lib/project";
import { TProjectWithLanguages, TSurvey } from "@/modules/survey/list/types/surveys";
export const surveySelect: Prisma.SurveySelect = {
id: true,
@@ -282,8 +281,7 @@ export const copySurveyToOtherEnvironment = async (
environmentId: string,
surveyId: string,
targetEnvironmentId: string,
userId: string,
copyResponses: boolean = false
userId: string
) => {
try {
const isSameEnvironment = environmentId === targetEnvironmentId;
@@ -585,27 +583,6 @@ export const copySurveyToOtherEnvironment = async (
},
});
if (copyResponses) {
try {
const copyResult = await copyResponsesForSurvey({
sourceSurveyId: surveyId,
targetSurveyId: newSurvey.id,
sourceEnvironmentId: environmentId,
targetEnvironmentId: targetEnvironmentId,
});
logger.info(
`Copied ${copyResult.copiedCount} responses from survey ${surveyId} to ${newSurvey.id}. ${copyResult.errors.length} errors occurred.`
);
if (copyResult.errors.length > 0) {
logger.warn(`Errors during response copy: ${copyResult.errors.slice(0, 10).join("; ")}`);
}
} catch (error) {
logger.error(error, "Error copying responses");
}
}
return newSurvey;
} catch (error) {
if (error instanceof Prisma.PrismaClientKnownRequestError) {
@@ -33,7 +33,6 @@ export const ZSurveyCopyFormValidation = z.object({
environments: z.array(z.string()),
})
),
copyMode: z.enum(["survey_only", "survey_with_responses"]).default("survey_only"),
});
export type TSurveyCopyFormData = z.infer<typeof ZSurveyCopyFormValidation>;
@@ -1,20 +1,10 @@
import { cleanup, render, screen } from "@testing-library/react";
import { afterEach, describe, expect, test, vi } from "vitest";
import { TSurvey } from "@formbricks/types/surveys/types";
import { Editor } from "./editor";
// Mock sub-components used in Editor
vi.mock("@lexical/react/LexicalComposerContext", () => ({
useLexicalComposerContext: vi.fn(() => [
{
registerUpdateListener: vi.fn(),
registerCommand: vi.fn(),
getEditorState: vi.fn(() => ({
read: vi.fn((callback) => callback()),
})),
update: vi.fn((callback) => callback()),
},
]),
useLexicalComposerContext: vi.fn(() => [{ registerUpdateListener: vi.fn() }]),
}));
vi.mock("@lexical/react/LexicalRichTextPlugin", () => ({
@@ -60,18 +50,8 @@ vi.mock("./auto-link-plugin", () => ({
}));
vi.mock("./editor-content-checker", () => ({
EditorContentChecker: () => <div data-testid="editor-content-checker" />,
}));
vi.mock("./recall-plugin", () => ({
RecallPlugin: (props: any) => <div data-testid="recall-plugin" data-props={JSON.stringify(props)} />,
}));
vi.mock("@/modules/survey/components/question-form-input/components/fallback-input", () => ({
FallbackInput: (props: any) => (
<div data-testid="fallback-input" data-props={JSON.stringify(props)}>
<div data-testid="fallback-trigger-button">{props.triggerButton}</div>
</div>
EditorContentChecker: ({ onEmptyChange }: { onEmptyChange: (isEmpty: boolean) => void }) => (
<div data-testid="editor-content-checker" />
),
}));
@@ -94,12 +74,6 @@ vi.mock("@/lib/cn", () => ({
cn: (...args: any[]) => args.filter(Boolean).join(" "),
}));
vi.mock("@tolgee/react", () => ({
useTranslate: () => ({
t: (key: string) => key,
}),
}));
describe("Editor", () => {
afterEach(() => {
cleanup();
@@ -133,7 +107,7 @@ describe("Editor", () => {
render(<Editor getText={() => "Sample text"} setText={() => {}} variables={variables} />);
const toolbarPlugin = screen.getByTestId("toolbar-plugin");
const props = JSON.parse(toolbarPlugin.dataset.props || "{}");
const props = JSON.parse(toolbarPlugin.getAttribute("data-props") || "{}");
expect(props.variables).toEqual(variables);
});
@@ -157,280 +131,4 @@ describe("Editor", () => {
// Should have filtered out two list transformers
expect(markdownPlugin).not.toHaveAttribute("data-transformers-count", "7");
});
describe("Recall Functionality", () => {
const createMockSurvey = (): TSurvey =>
({
id: "survey1",
name: "Test Survey",
welcomeCard: { enabled: false, headline: {} } as unknown as TSurvey["welcomeCard"],
questions: [
{
id: "question1",
headline: { en: "Question 1" },
type: "shortText",
},
],
endings: [],
hiddenFields: { enabled: true, fieldIds: [] },
followUps: [],
type: "link",
createdAt: new Date("2024-01-01T00:00:00.000Z"),
updatedAt: new Date("2024-01-01T00:00:00.000Z"),
languages: [],
}) as unknown as TSurvey;
test("renders RecallPlugin when all required recall props are provided", () => {
const localSurvey = createMockSurvey();
const fallbacks = { q1: "default" };
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
fallbacks={fallbacks}
/>
);
expect(screen.getByTestId("recall-plugin")).toBeInTheDocument();
});
test("does not render RecallPlugin when localSurvey is missing", () => {
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
questionId="question1"
selectedLanguageCode="en"
/>
);
expect(screen.queryByTestId("recall-plugin")).not.toBeInTheDocument();
});
test("does not render RecallPlugin when questionId is missing", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
selectedLanguageCode="en"
/>
);
expect(screen.queryByTestId("recall-plugin")).not.toBeInTheDocument();
});
test("does not render RecallPlugin when selectedLanguageCode is missing", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
/>
);
expect(screen.queryByTestId("recall-plugin")).not.toBeInTheDocument();
});
test("passes correct props to RecallPlugin", () => {
const localSurvey = createMockSurvey();
const fallbacks = { q1: "default" };
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
fallbacks={fallbacks}
/>
);
const recallPlugin = screen.getByTestId("recall-plugin");
const props = JSON.parse(recallPlugin.dataset.props || "{}");
expect(props.localSurvey.id).toBe(localSurvey.id);
expect(props.localSurvey.name).toBe(localSurvey.name);
expect(props.localSurvey.type).toBe(localSurvey.type);
expect(props.questionId).toBe("question1");
expect(props.selectedLanguageCode).toBe("en");
expect(props.fallbacks).toEqual(fallbacks);
// Functions are not serialized in JSON, so we check that the props object exists
expect(props).toBeDefined();
});
test("passes recall props to ToolbarPlugin", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
/>
);
const toolbarPlugin = screen.getByTestId("toolbar-plugin");
const props = JSON.parse(toolbarPlugin.dataset.props || "{}");
expect(props.localSurvey.id).toBe(localSurvey.id);
expect(props.localSurvey.name).toBe(localSurvey.name);
expect(props.localSurvey.type).toBe(localSurvey.type);
expect(props.questionId).toBe("question1");
expect(props.selectedLanguageCode).toBe("en");
// Functions are not serialized in JSON, so we check that the props object exists
expect(props).toBeDefined();
});
test("does not render FallbackInput when recallItems is empty", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
/>
);
expect(screen.queryByTestId("fallback-input")).not.toBeInTheDocument();
});
test("does not render FallbackInput when recallItems are empty even with fallbacks prop", () => {
const localSurvey = createMockSurvey();
const fallbacks = { q1: "default" };
const addFallback = vi.fn();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
fallbacks={fallbacks}
addFallback={addFallback}
/>
);
// Since recallItems is empty, FallbackInput should not be rendered
expect(screen.queryByTestId("fallback-input")).not.toBeInTheDocument();
});
test("does not render trigger button when recallItems are empty", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
/>
);
// Since recallItems is empty, trigger button should not be rendered
expect(screen.queryByTestId("fallback-trigger-button")).not.toBeInTheDocument();
});
test("handles fallbacks prop correctly", () => {
const localSurvey = createMockSurvey();
const fallbacks = { q1: "default", q2: "fallback" };
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
fallbacks={fallbacks}
/>
);
const recallPlugin = screen.getByTestId("recall-plugin");
const props = JSON.parse(recallPlugin.dataset.props || "{}");
expect(props.fallbacks).toEqual(fallbacks);
});
test("does not render FallbackInput when recallItems are empty even with addFallback prop", () => {
const localSurvey = createMockSurvey();
const addFallback = vi.fn();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
addFallback={addFallback}
/>
);
// Since recallItems is empty, FallbackInput should not be rendered
expect(screen.queryByTestId("fallback-input")).not.toBeInTheDocument();
});
test("includes RecallNode in editor config nodes", () => {
const localSurvey = createMockSurvey();
render(
<Editor
getText={() => "Sample text"}
setText={() => {}}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
/>
);
// The RecallNode should be included in the editor config
// This is tested indirectly by the RecallPlugin being able to function
expect(screen.getByTestId("recall-plugin")).toBeInTheDocument();
});
test("manages recall state correctly", () => {
const localSurvey = createMockSurvey();
const setText = vi.fn();
render(
<Editor
getText={() => "Sample text"}
setText={setText}
localSurvey={localSurvey}
questionId="question1"
selectedLanguageCode="en"
/>
);
const recallPlugin = screen.getByTestId("recall-plugin");
const props = JSON.parse(recallPlugin.dataset.props || "{}");
// Test that state management functions are provided
// Functions are not serialized in JSON, so we check that the props object exists
expect(props).toBeDefined();
// Test initial state
expect(props.recallItems).toEqual([]);
expect(props.fallbacks).toEqual({});
expect(props.showRecallItemSelect).toBe(false);
});
});
});
@@ -1,3 +1,6 @@
import { cn } from "@/lib/cn";
import "@/modules/ui/components/editor/styles-editor-frontend.css";
import "@/modules/ui/components/editor/styles-editor.css";
import { CodeHighlightNode, CodeNode } from "@lexical/code";
import { AutoLinkNode, LinkNode } from "@lexical/link";
import { ListItemNode, ListNode } from "@lexical/list";
@@ -11,20 +14,12 @@ import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPl
import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
import { HeadingNode, QuoteNode } from "@lexical/rich-text";
import { TableCellNode, TableNode, TableRowNode } from "@lexical/table";
import { type Dispatch, type SetStateAction, useRef, useState } from "react";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { cn } from "@/lib/cn";
import { FallbackInput } from "@/modules/survey/components/question-form-input/components/fallback-input";
import "@/modules/ui/components/editor/styles-editor-frontend.css";
import "@/modules/ui/components/editor/styles-editor.css";
import { type Dispatch, type SetStateAction, useRef } from "react";
import { exampleTheme } from "../lib/example-theme";
import "../styles-editor-frontend.css";
import "../styles-editor.css";
import { PlaygroundAutoLinkPlugin as AutoLinkPlugin } from "./auto-link-plugin";
import { EditorContentChecker } from "./editor-content-checker";
import { LinkEditor } from "./link-editor";
import { RecallNode } from "./recall-node";
import { RecallPlugin } from "./recall-plugin";
import { ToolbarPlugin } from "./toolbar-plugin";
/*
@@ -49,11 +44,6 @@ export type TextEditorProps = {
editable?: boolean;
onEmptyChange?: (isEmpty: boolean) => void;
isInvalid?: boolean;
localSurvey?: TSurvey;
questionId?: string;
selectedLanguageCode?: string;
fallbacks?: { [id: string]: string };
addFallback?: () => void;
};
const editorConfig = {
@@ -74,101 +64,56 @@ const editorConfig = {
TableRowNode,
AutoLinkNode,
LinkNode,
RecallNode,
],
};
export const Editor = (props: TextEditorProps) => {
const editable = props.editable ?? true;
const editorContainerRef = useRef<HTMLDivElement>(null);
const [showFallbackInput, setShowFallbackInput] = useState(false);
const [recallItems, setRecallItems] = useState<TSurveyRecallItem[]>([]);
const [fallbacks, setFallbacks] = useState<{ [id: string]: string }>(props.fallbacks || {});
const [addFallbackFunction, setAddFallbackFunction] = useState<(() => void) | null>(null);
const [showRecallItemSelect, setShowRecallItemSelect] = useState(false);
const [showLinkEditor, setShowLinkEditor] = useState(false);
return (
<>
<div className="editor cursor-text rounded-md">
<LexicalComposer initialConfig={{ ...editorConfig, editable }}>
<div className="editor cursor-text rounded-md">
<LexicalComposer initialConfig={{ ...editorConfig, editable }}>
<div
ref={editorContainerRef}
className={cn("editor-container rounded-md p-0", props.isInvalid && "!border !border-red-500")}>
<ToolbarPlugin
getText={props.getText}
setText={props.setText}
editable={editable}
excludedToolbarItems={props.excludedToolbarItems}
variables={props.variables}
updateTemplate={props.updateTemplate}
firstRender={props.firstRender}
setFirstRender={props.setFirstRender}
container={editorContainerRef.current}
/>
{props.onEmptyChange ? <EditorContentChecker onEmptyChange={props.onEmptyChange} /> : null}
<div
ref={editorContainerRef}
className={cn("editor-container rounded-md p-0", props.isInvalid && "!border !border-red-500")}>
<ToolbarPlugin
getText={props.getText}
setText={props.setText}
editable={editable}
excludedToolbarItems={props.excludedToolbarItems}
variables={props.variables}
updateTemplate={props.updateTemplate}
firstRender={props.firstRender}
setFirstRender={props.setFirstRender}
localSurvey={props.localSurvey}
questionId={props.questionId}
selectedLanguageCode={props.selectedLanguageCode}
setShowRecallItemSelect={setShowRecallItemSelect}
recallItemsCount={recallItems.length}
setShowFallbackInput={setShowFallbackInput}
setShowLinkEditor={setShowLinkEditor}
className={cn("editor-inner scroll-bar", !editable && "bg-muted")}
style={{ height: props.height }}>
<RichTextPlugin
contentEditable={<ContentEditable style={{ height: props.height }} className="editor-input" />}
placeholder={
<div className="-mt-11 cursor-text p-3 text-sm text-slate-400">{props.placeholder ?? ""}</div>
}
ErrorBoundary={LexicalErrorBoundary}
/>
<ListPlugin />
<LinkPlugin />
<AutoLinkPlugin />
<MarkdownShortcutPlugin
transformers={
props.disableLists
? TRANSFORMERS.filter((value, index) => {
if (index !== 3 && index !== 4) return value;
})
: TRANSFORMERS
}
/>
{props.onEmptyChange ? <EditorContentChecker onEmptyChange={props.onEmptyChange} /> : null}
<div
className={cn("editor-inner scroll-bar", !editable && "bg-muted")}
style={{ height: props.height }}>
<RichTextPlugin
contentEditable={
<ContentEditable style={{ height: props.height }} className="editor-input" />
}
placeholder={
<div className="-mt-11 cursor-text p-3 text-sm text-slate-400">
{props.placeholder ?? ""}
</div>
}
ErrorBoundary={LexicalErrorBoundary}
/>
<ListPlugin />
<LinkPlugin />
<AutoLinkPlugin />
{props.localSurvey && props.questionId && props.selectedLanguageCode && (
<RecallPlugin
localSurvey={props.localSurvey}
questionId={props.questionId}
selectedLanguageCode={props.selectedLanguageCode}
recallItems={recallItems}
setRecallItems={setRecallItems}
fallbacks={fallbacks}
setFallbacks={setFallbacks}
onShowFallbackInput={() => setShowFallbackInput(true)}
setAddFallbackFunction={setAddFallbackFunction}
setShowRecallItemSelect={setShowRecallItemSelect}
showRecallItemSelect={showRecallItemSelect}
/>
)}
<LinkEditor open={showLinkEditor} setOpen={setShowLinkEditor} />
<MarkdownShortcutPlugin
transformers={
props.disableLists
? TRANSFORMERS.filter((value, index) => {
if (index !== 3 && index !== 4) return value;
})
: TRANSFORMERS
}
/>
</div>
</div>
</LexicalComposer>
</div>
{recallItems.length > 0 && (
<FallbackInput
filteredRecallItems={recallItems}
fallbacks={fallbacks}
setFallbacks={setFallbacks}
addFallback={addFallbackFunction || props.addFallback || (() => {})}
open={showFallbackInput}
setOpen={setShowFallbackInput}
/>
)}
</>
</div>
</LexicalComposer>
</div>
);
};
@@ -1,196 +0,0 @@
import "@testing-library/jest-dom/vitest";
import { cleanup, render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { afterEach, describe, expect, test, vi } from "vitest";
import { LinkEditor } from "./link-editor";
const createMockEditor = () => ({
dispatchCommand: vi.fn(),
getEditorState: vi.fn().mockReturnValue({
read: vi.fn((fn) => fn()),
}),
});
let mockEditor: any;
vi.mock("@lexical/react/LexicalComposerContext", () => ({
useLexicalComposerContext: vi.fn(() => {
mockEditor = createMockEditor();
return [mockEditor];
}),
}));
vi.mock("lexical", () => ({
$getSelection: vi.fn(() => ({
anchor: {
getNode: vi.fn(() => ({
getParent: vi.fn(() => null),
getTextContentSize: vi.fn(() => 10),
})),
offset: 0,
},
focus: {
getNode: vi.fn(() => ({
getParent: vi.fn(() => null),
getTextContentSize: vi.fn(() => 10),
})),
offset: 0,
},
isBackward: vi.fn(() => false),
})),
$isRangeSelection: vi.fn(() => true),
}));
vi.mock("@lexical/link", () => ({
$isLinkNode: vi.fn(() => false),
TOGGLE_LINK_COMMAND: "toggleLink",
}));
vi.mock("@tolgee/react", () => ({
useTranslate: () => ({
t: (key: string) => {
const translations: { [key: string]: string } = {
"common.add": "Add",
};
return translations[key] || key;
},
}),
}));
vi.mock("@/lib/utils/url", () => ({
isStringUrl: vi.fn((url: string) => {
try {
new URL(url);
return true;
} catch {
return false;
}
}),
}));
describe("LinkEditor", () => {
afterEach(() => {
cleanup();
vi.clearAllMocks();
});
const mockSetOpen = vi.fn();
test("renders link editor when open", () => {
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
expect(screen.getByPlaceholderText("https://example.com")).toBeInTheDocument();
expect(screen.getByRole("button", { name: "common.save" })).toBeInTheDocument();
});
test("does not render when closed", () => {
render(<LinkEditor editor={mockEditor as any} open={false} setOpen={mockSetOpen} />);
expect(screen.queryByPlaceholderText("https://example.com")).not.toBeInTheDocument();
});
test("initializes with https:// when no link is selected", () => {
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com") as HTMLInputElement;
expect(input.value).toBe("https://");
});
test("submits valid URL on form submit", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com");
await user.clear(input);
await user.type(input, "https://formbricks.com");
const submitButton = screen.getByRole("button", { name: "common.save" });
await user.click(submitButton);
expect(mockEditor.dispatchCommand).toHaveBeenCalledWith("toggleLink", {
url: "https://formbricks.com",
target: "_blank",
rel: "noopener noreferrer",
});
expect(mockSetOpen).toHaveBeenCalledWith(false);
});
test("submits on Enter key when URL is valid", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com");
await user.clear(input);
await user.type(input, "https://formbricks.com{Enter}");
expect(mockEditor.dispatchCommand).toHaveBeenCalledWith("toggleLink", {
url: "https://formbricks.com",
target: "_blank",
rel: "noopener noreferrer",
});
expect(mockSetOpen).toHaveBeenCalledWith(false);
});
test("closes on Escape key", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com");
await user.type(input, "{Escape}");
expect(mockSetOpen).toHaveBeenCalledWith(false);
expect(mockEditor.dispatchCommand).not.toHaveBeenCalled();
});
test("validates URL and shows error for invalid URL", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com") as HTMLInputElement;
await user.clear(input);
await user.type(input, "https://abc");
// Trigger validation by trying to submit
const submitButton = screen.getByRole("button", { name: "common.save" });
await user.click(submitButton);
const errorMessage = screen.getAllByText("environments.surveys.edit.please_enter_a_valid_url");
// Check that the custom validation message is set
expect(errorMessage).toBeVisible;
});
test("clears validation message when valid URL is entered", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com") as HTMLInputElement;
await user.clear(input);
await user.type(input, "https://abc");
// Now enter valid URL
await user.clear(input);
await user.type(input, "https://formbricks.com");
expect(input.validationMessage).toBe("");
});
test("updates link URL on input change", async () => {
const user = userEvent.setup();
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com") as HTMLInputElement;
await user.clear(input);
await user.type(input, "https://example.org");
expect(input.value).toBe("https://example.org");
});
test("requires input to have value before submission", () => {
render(<LinkEditor editor={mockEditor as any} open={true} setOpen={mockSetOpen} />);
const input = screen.getByPlaceholderText("https://example.com") as HTMLInputElement;
expect(input).toBeRequired();
expect(input.type).toBe("url");
});
});
@@ -1,166 +0,0 @@
"use client";
import { $isLinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
import { useTranslate } from "@tolgee/react";
import type { LexicalEditor, RangeSelection } from "lexical";
import { $getSelection, $isRangeSelection } from "lexical";
import { useEffect, useRef, useState } from "react";
import { isStringUrl } from "@/lib/utils/url";
import { Button } from "@/modules/ui/components/button";
import { Input } from "@/modules/ui/components/input";
import { Popover, PopoverContent, PopoverTrigger } from "@/modules/ui/components/popover";
const getSelectedNode = (selection: RangeSelection) => {
const anchor = selection.anchor;
const focus = selection.focus;
const anchorNode = selection.anchor.getNode();
const focusNode = selection.focus.getNode();
if (anchorNode === focusNode) {
return anchorNode;
}
const isBackward = selection.isBackward();
if (isBackward) {
return focus.offset === focusNode.getTextContentSize() ? anchorNode : focusNode;
} else {
return anchor.offset === anchorNode.getTextContentSize() ? focusNode : anchorNode;
}
};
const validateUrl = (url: string): boolean => {
// Use existing helper for basic URL validation
if (!isStringUrl(url)) {
return false;
}
try {
const urlObj = new URL(url);
// Ensure valid protocol (http or https)
if (urlObj.protocol !== "http:" && urlObj.protocol !== "https:") {
return false;
}
// Check for IPv6 address
const isIPv6 = urlObj.hostname.startsWith("[") && urlObj.hostname.endsWith("]");
// Check for IPv4 address
const isIPv4 = /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(urlObj.hostname);
// Ensure proper domain structure (has a dot), is localhost, or is an IP address
return urlObj.hostname.includes(".") || urlObj.hostname === "localhost" || isIPv6 || isIPv4;
} catch {
return false;
}
};
interface LinkEditorProps {
editor: LexicalEditor;
open: boolean;
setOpen: (open: boolean) => void;
}
const LinkEditorContent = ({ editor, open, setOpen }: LinkEditorProps) => {
const inputRef = useRef<HTMLInputElement | null>(null);
const [linkUrl, setLinkUrl] = useState("");
const [error, setError] = useState("");
const { t } = useTranslate();
useEffect(() => {
if (open) {
setError("");
editor.getEditorState().read(() => {
const selection = $getSelection();
if ($isRangeSelection(selection)) {
const node = getSelectedNode(selection);
const parent = node.getParent();
if ($isLinkNode(parent)) {
setLinkUrl(parent.getURL());
} else if ($isLinkNode(node)) {
setLinkUrl(node.getURL());
} else {
setLinkUrl("https://");
}
}
});
}
}, [open, editor]);
const linkAttributes = {
target: "_blank",
rel: "noopener noreferrer",
};
const handleSubmit = () => {
if (!validateUrl(linkUrl)) {
setError(t("environments.surveys.edit.please_enter_a_valid_url"));
return;
}
if (linkUrl) {
editor.dispatchCommand(TOGGLE_LINK_COMMAND, {
url: linkUrl,
...linkAttributes,
});
setOpen(false);
}
};
return (
<Popover open={open} onOpenChange={setOpen}>
<PopoverTrigger asChild>
<div className="z-10 h-0 w-full cursor-pointer" />
</PopoverTrigger>
<PopoverContent
className="w-auto border border-slate-300 bg-slate-50 p-3 text-xs shadow-lg"
align="start"
side="bottom"
sideOffset={4}>
<form
className="flex gap-2"
onSubmit={(e) => {
e.preventDefault();
if (inputRef.current?.checkValidity()) {
handleSubmit();
} else {
inputRef.current?.reportValidity();
}
}}>
<Input
type="url"
required
className="focus:border-brand-dark h-9 min-w-80 bg-white"
ref={inputRef}
value={linkUrl}
placeholder="https://example.com"
autoFocus
onInput={(event) => {
const value = event.currentTarget.value;
setLinkUrl(value);
if (error && validateUrl(value)) {
setError("");
}
}}
onKeyDown={(event) => {
if (event.key === "Enter") {
event.preventDefault();
// Trigger native validation
if (inputRef.current?.checkValidity()) {
handleSubmit();
} else {
inputRef.current?.reportValidity();
}
} else if (event.key === "Escape") {
event.preventDefault();
setOpen(false);
}
}}
/>
<Button type="submit" className="h-9">
{t("common.save")}
</Button>
</form>
{error && <p className="mt-1 text-sm text-red-500">{error}</p>}
</PopoverContent>
</Popover>
);
};
export const LinkEditor = ({ open, setOpen }: { open: boolean; setOpen: (open: boolean) => void }) => {
const [editor] = useLexicalComposerContext();
return <LinkEditorContent editor={editor} open={open} setOpen={setOpen} />;
};
@@ -1,511 +0,0 @@
import "@testing-library/jest-dom/vitest";
import { cleanup, render } from "@testing-library/react";
import { $applyNodeReplacement } from "lexical";
import { afterEach, describe, expect, test, vi } from "vitest";
import { TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { replaceRecallInfoWithUnderline } from "@/lib/utils/recall";
import { $createRecallNode, RecallNode, RecallPayload, SerializedRecallNode } from "./recall-node";
vi.mock("lexical", () => ({
$applyNodeReplacement: vi.fn((node) => node),
DecoratorNode: class DecoratorNode {
__key: string;
constructor(key?: string) {
this.__key = key || "test-key";
}
getWritable() {
return this;
}
},
}));
vi.mock("@/lib/utils/recall", () => ({
replaceRecallInfoWithUnderline: vi.fn((label: string) => {
return label.replace(/#recall:[^#]+#/g, "___");
}),
}));
describe("RecallNode", () => {
afterEach(() => {
cleanup();
vi.clearAllMocks();
});
const mockRecallItem: TSurveyRecallItem = {
id: "question123",
label: "What is your name?",
type: "question",
};
const mockPayload: RecallPayload = {
recallItem: mockRecallItem,
fallbackValue: "default value",
};
describe("RecallNode.getType", () => {
test("returns correct type", () => {
expect(RecallNode.getType()).toBe("recall");
});
});
describe("RecallNode.clone", () => {
test("creates a clone of the node with same properties", () => {
const node = new RecallNode(mockPayload);
const clonedNode = RecallNode.clone(node);
expect(clonedNode).toBeInstanceOf(RecallNode);
expect(clonedNode.getRecallItem()).toEqual(mockRecallItem);
expect(clonedNode.getFallbackValue()).toBe("default value");
});
});
describe("RecallNode.importJSON", () => {
test("creates node from serialized data", () => {
const serializedNode: SerializedRecallNode = {
recallItem: mockRecallItem,
fallbackValue: "imported value",
type: "recall",
version: 1,
};
const node = RecallNode.importJSON(serializedNode);
expect(node).toBeInstanceOf(RecallNode);
expect(node.getRecallItem()).toEqual(mockRecallItem);
expect(node.getFallbackValue()).toBe("imported value");
});
test("handles missing fallbackValue", () => {
const serializedNode: SerializedRecallNode = {
recallItem: mockRecallItem,
type: "recall",
version: 1,
};
const node = RecallNode.importJSON(serializedNode);
expect(node).toBeInstanceOf(RecallNode);
expect(node.getFallbackValue()).toBe("");
});
});
describe("RecallNode.exportJSON", () => {
test("exports node to JSON format", () => {
const node = new RecallNode(mockPayload);
const exported = node.exportJSON();
expect(exported).toEqual({
recallItem: mockRecallItem,
fallbackValue: "default value",
type: "recall",
version: 1,
});
});
});
describe("RecallNode.importDOM", () => {
test("returns correct DOM conversion map", () => {
const domMap = RecallNode.importDOM();
expect(domMap).not.toBeNull();
expect(domMap).toHaveProperty("span");
if (domMap?.span) {
expect(domMap.span).toBeDefined();
const testNode = document.createElement("span");
const spanConfig = domMap.span(testNode);
if (spanConfig) {
expect(spanConfig.priority).toBe(1);
expect(spanConfig.conversion).toBeDefined();
}
}
});
test("converts valid span element with recall data attributes", () => {
const domMap = RecallNode.importDOM();
if (domMap?.span) {
const spanElement = document.createElement("span");
spanElement.dataset.recallId = "q1";
spanElement.dataset.recallLabel = "Question One";
spanElement.dataset.recallType = "question";
spanElement.dataset.fallbackValue = "fallback text";
const spanConfig = domMap.span(spanElement);
if (spanConfig) {
const conversionFn = spanConfig.conversion;
const result = conversionFn(spanElement);
expect(result).not.toBeNull();
if (result && result.node instanceof RecallNode) {
expect(result.node).toBeInstanceOf(RecallNode);
expect(result.node.getRecallItem()).toEqual({
id: "q1",
label: "Question One",
type: "question",
});
expect(result.node.getFallbackValue()).toBe("fallback text");
}
}
}
});
test("handles span without data-recall-id attribute", () => {
const domMap = RecallNode.importDOM();
if (domMap?.span) {
const spanElement = document.createElement("span");
spanElement.dataset.recallLabel = "Question One";
spanElement.dataset.recallType = "question";
const spanConfig = domMap.span(spanElement);
if (spanConfig) {
const conversionFn = spanConfig.conversion;
const result = conversionFn(spanElement);
expect(result).toBeNull();
}
}
});
test("handles span with missing fallback-value attribute", () => {
const domMap = RecallNode.importDOM();
if (domMap?.span) {
const spanElement = document.createElement("span");
spanElement.dataset.recallId = "q1";
spanElement.dataset.recallLabel = "Question One";
spanElement.dataset.recallType = "question";
const spanConfig = domMap.span(spanElement);
if (spanConfig) {
const conversionFn = spanConfig.conversion;
const result = conversionFn(spanElement);
expect(result).not.toBeNull();
if (result && result.node instanceof RecallNode) {
expect(result.node.getFallbackValue()).toBe("");
}
}
}
});
test("returns null for span without required attributes", () => {
const domMap = RecallNode.importDOM();
if (domMap?.span) {
const spanElement = document.createElement("span");
spanElement.dataset.recallId = "q1";
const spanConfig = domMap.span(spanElement);
if (spanConfig) {
const conversionFn = spanConfig.conversion;
const result = conversionFn(spanElement);
expect(result).toBeNull();
}
}
});
});
describe("RecallNode.exportDOM", () => {
test("exports node to DOM element with correct attributes", () => {
const node = new RecallNode(mockPayload);
const { element } = node.exportDOM();
if (element && element instanceof HTMLElement) {
expect(element.tagName).toBe("SPAN");
expect(element.dataset.recallId).toBe("question123");
expect(element.dataset.recallLabel).toBe("What is your name?");
expect(element.dataset.recallType).toBe("question");
expect(element.dataset.fallbackValue).toBe("default value");
expect(element.className).toBe("recall-node");
expect(element.textContent).toBe("#recall:question123/fallback:default value#");
}
});
test("exports node with empty fallback value", () => {
const payload: RecallPayload = {
recallItem: mockRecallItem,
fallbackValue: "",
};
const node = new RecallNode(payload);
const { element } = node.exportDOM();
if (element && element instanceof HTMLElement) {
expect(element.dataset.fallbackValue).toBe("");
expect(element.textContent).toBe("#recall:question123/fallback:#");
}
});
});
describe("RecallNode constructor", () => {
test("creates node with provided payload", () => {
const node = new RecallNode(mockPayload);
expect(node.getRecallItem()).toEqual(mockRecallItem);
expect(node.getFallbackValue()).toBe("default value");
});
test("creates node with default values when no payload provided", () => {
const node = new RecallNode();
expect(node.getRecallItem()).toEqual({
id: "",
label: "",
type: "question",
});
expect(node.getFallbackValue()).toBe("");
});
test("creates node with missing fallbackValue in payload", () => {
const payload: RecallPayload = {
recallItem: mockRecallItem,
};
const node = new RecallNode(payload);
expect(node.getFallbackValue()).toBe("");
});
});
describe("RecallNode.createDOM", () => {
test("creates DOM element with correct classes", () => {
const node = new RecallNode(mockPayload);
const dom = node.createDOM();
expect(dom.tagName).toBe("SPAN");
expect(dom.className).toBe("recall-node-placeholder");
});
});
describe("RecallNode.updateDOM", () => {
test("always returns false", () => {
const node = new RecallNode(mockPayload);
expect(node.updateDOM()).toBe(false);
});
});
describe("RecallNode.getRecallItem", () => {
test("returns the recall item", () => {
const node = new RecallNode(mockPayload);
const recallItem = node.getRecallItem();
expect(recallItem).toEqual(mockRecallItem);
});
});
describe("RecallNode.getFallbackValue", () => {
test("returns the fallback value", () => {
const node = new RecallNode(mockPayload);
const fallbackValue = node.getFallbackValue();
expect(fallbackValue).toBe("default value");
});
});
describe("RecallNode.setFallbackValue", () => {
test("updates the fallback value", () => {
const node = new RecallNode(mockPayload);
node.setFallbackValue("new value");
expect(node.getFallbackValue()).toBe("new value");
});
test("can set empty fallback value", () => {
const node = new RecallNode(mockPayload);
node.setFallbackValue("");
expect(node.getFallbackValue()).toBe("");
});
});
describe("RecallNode.getTextContent", () => {
test("returns correct text content format", () => {
const node = new RecallNode(mockPayload);
const textContent = node.getTextContent();
expect(textContent).toBe("#recall:question123/fallback:default value#");
});
test("returns text content with empty fallback", () => {
const payload: RecallPayload = {
recallItem: mockRecallItem,
fallbackValue: "",
};
const node = new RecallNode(payload);
const textContent = node.getTextContent();
expect(textContent).toBe("#recall:question123/fallback:#");
});
});
describe("RecallNode.decorate", () => {
test("renders recall node with correct label", () => {
const node = new RecallNode(mockPayload);
const decorated = node.decorate();
const { container } = render(<>{decorated}</>);
const span = container.querySelector("span");
expect(span).toBeInTheDocument();
expect(span).toHaveClass("recall-node");
expect(span).toHaveClass("bg-slate-100");
expect(span?.textContent).toContain("@");
});
test("calls replaceRecallInfoWithUnderline with label", () => {
const node = new RecallNode(mockPayload);
node.decorate();
expect(vi.mocked(replaceRecallInfoWithUnderline)).toHaveBeenCalledWith("What is your name?");
});
test("handles label with nested recall patterns", () => {
vi.mocked(replaceRecallInfoWithUnderline).mockReturnValueOnce("Processed Label");
const payloadWithNestedRecall: RecallPayload = {
recallItem: {
id: "q1",
label: "What is your #recall:name/fallback:name# answer?",
type: "question",
},
fallbackValue: "default",
};
const node = new RecallNode(payloadWithNestedRecall);
const decorated = node.decorate();
const { container } = render(<>{decorated}</>);
expect(vi.mocked(replaceRecallInfoWithUnderline)).toHaveBeenCalledWith(
"What is your #recall:name/fallback:name# answer?"
);
expect(container.textContent).toContain("@Processed Label");
});
});
describe("RecallNode.isInline", () => {
test("returns true for inline configuration", () => {
const node = new RecallNode(mockPayload);
expect(node.isInline()).toBe(true);
});
});
describe("$createRecallNode", () => {
test("creates a new RecallNode instance", () => {
const node = $createRecallNode(mockPayload);
expect(node).toBeInstanceOf(RecallNode);
expect(node.getRecallItem()).toEqual(mockRecallItem);
expect(node.getFallbackValue()).toBe("default value");
});
test("applies node replacement", () => {
$createRecallNode(mockPayload);
expect($applyNodeReplacement).toHaveBeenCalled();
});
test("creates node with different recall types", () => {
const hiddenFieldPayload: RecallPayload = {
recallItem: {
id: "hf1",
label: "Hidden Field",
type: "hiddenField",
},
fallbackValue: "hidden value",
};
const node = $createRecallNode(hiddenFieldPayload);
expect(node.getRecallItem().type).toBe("hiddenField");
});
test("creates node with variable type", () => {
const variablePayload: RecallPayload = {
recallItem: {
id: "var1",
label: "Variable Name",
type: "variable",
},
fallbackValue: "variable value",
};
const node = $createRecallNode(variablePayload);
expect(node.getRecallItem().type).toBe("variable");
});
});
describe("RecallNode static config", () => {
test("has correct static configuration", () => {
expect(RecallNode.$config.type).toBe("recall");
expect(RecallNode.$config.inline).toBe(true);
});
});
describe("RecallNode edge cases", () => {
test("handles special characters in recall item label", () => {
const specialPayload: RecallPayload = {
recallItem: {
id: "q1",
label: "What's your <name> & (email)?",
type: "question",
},
fallbackValue: "default",
};
const node = new RecallNode(specialPayload);
const { element } = node.exportDOM();
if (element && element instanceof HTMLElement) {
expect(element.dataset.recallLabel).toBe("What's your <name> & (email)?");
}
});
test("handles special characters in fallback value", () => {
const specialPayload: RecallPayload = {
recallItem: mockRecallItem,
fallbackValue: "default & special <value>",
};
const node = new RecallNode(specialPayload);
const { element } = node.exportDOM();
if (element && element instanceof HTMLElement) {
expect(element.dataset.fallbackValue).toBe("default & special <value>");
}
});
test("handles long recall item labels", () => {
const longLabel = "A".repeat(1000);
const longPayload: RecallPayload = {
recallItem: {
id: "q1",
label: longLabel,
type: "question",
},
fallbackValue: "default",
};
const node = new RecallNode(longPayload);
expect(node.getRecallItem().label).toBe(longLabel);
});
test("handles unicode characters in labels", () => {
const unicodePayload: RecallPayload = {
recallItem: {
id: "q1",
label: "你好世界 🌍 مرحبا",
type: "question",
},
fallbackValue: "unicode value",
};
const node = new RecallNode(unicodePayload);
const decorated = node.decorate();
const { container } = render(<>{decorated}</>);
expect(container).toBeInTheDocument();
});
});
});
@@ -1,155 +0,0 @@
"use client";
import type { DOMConversionMap, DOMConversionOutput, DOMExportOutput, NodeKey, Spread } from "lexical";
import { $applyNodeReplacement, DecoratorNode } from "lexical";
import { ReactNode } from "react";
import { TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { replaceRecallInfoWithUnderline } from "@/lib/utils/recall";
export interface RecallPayload {
recallItem: TSurveyRecallItem;
fallbackValue?: string;
key?: NodeKey;
}
export interface SerializedRecallNode extends Spread<RecallPayload, { type: "recall"; version: 1 }> {}
const convertRecallElement = (domNode: Node): null | DOMConversionOutput => {
const node = domNode as HTMLElement;
if (node.dataset.recallId) {
const recallId = node.dataset.recallId;
const recallLabel = node.dataset.recallLabel;
const recallType = node.dataset.recallType;
const fallbackValue = node.dataset.fallbackValue || "";
if (recallId && recallLabel && recallType) {
const recallItem: TSurveyRecallItem = {
id: recallId,
label: recallLabel,
type: recallType as TSurveyRecallItem["type"],
};
const node = $createRecallNode({ recallItem, fallbackValue });
return { node };
}
}
return null;
};
export class RecallNode extends DecoratorNode<ReactNode> {
__recallItem: TSurveyRecallItem;
__fallbackValue: string;
static readonly $config = {
type: "recall",
inline: true,
} as const;
static getType(): string {
return RecallNode.$config.type;
}
static clone(node: RecallNode): RecallNode {
return new RecallNode(
{
recallItem: node.__recallItem,
fallbackValue: node.__fallbackValue,
},
node.__key
);
}
static importJSON(serializedNode: SerializedRecallNode): RecallNode {
const { recallItem, fallbackValue } = serializedNode;
return $createRecallNode({ recallItem, fallbackValue });
}
exportJSON(): SerializedRecallNode {
return {
recallItem: this.__recallItem,
fallbackValue: this.__fallbackValue,
type: "recall",
version: 1,
};
}
static importDOM(): DOMConversionMap | null {
return {
span: () => ({
conversion: convertRecallElement,
priority: 1,
}),
};
}
exportDOM(): DOMExportOutput {
const element = document.createElement("span");
element.dataset.recallId = this.__recallItem.id;
element.dataset.recallLabel = this.__recallItem.label;
element.dataset.recallType = this.__recallItem.type;
element.dataset.fallbackValue = this.__fallbackValue;
element.className = "recall-node";
element.textContent = `#recall:${this.__recallItem.id}/fallback:${this.__fallbackValue}#`;
return { element };
}
constructor(payload?: RecallPayload, key?: NodeKey) {
super(key);
const defaultPayload: RecallPayload = {
recallItem: { id: "", label: "", type: "question" },
fallbackValue: "",
};
const actualPayload = payload || defaultPayload;
this.__recallItem = actualPayload.recallItem;
this.__fallbackValue = actualPayload.fallbackValue || "";
}
createDOM(): HTMLElement {
const dom = document.createElement("span");
dom.className = "recall-node-placeholder";
// Don't set text content here - let decorate() handle it
return dom;
}
updateDOM(_prevNode: RecallNode): boolean {
// Return false - let decorate() handle all rendering
return false;
}
getRecallItem(): TSurveyRecallItem {
return this.__recallItem;
}
getFallbackValue(): string {
return this.__fallbackValue;
}
setFallbackValue(fallbackValue: string): void {
const writable = this.getWritable();
writable.__fallbackValue = fallbackValue;
}
getTextContent(): string {
return `#recall:${this.__recallItem.id}/fallback:${this.__fallbackValue}#`;
}
decorate(): ReactNode {
const displayLabel = replaceRecallInfoWithUnderline(this.__recallItem.label);
return (
<span
className="recall-node z-30 inline-flex h-fit justify-center whitespace-pre rounded-md bg-slate-100 text-sm text-slate-700"
aria-label={`Recall: ${displayLabel}`}>
@{displayLabel}
</span>
);
}
isInline(): boolean {
return RecallNode.$config.inline;
}
}
export const $createRecallNode = (payload: RecallPayload): RecallNode => {
return $applyNodeReplacement(new RecallNode(payload));
};
@@ -1,481 +0,0 @@
import "@testing-library/jest-dom/vitest";
import { cleanup, render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { afterEach, beforeEach, describe, expect, test, vi } from "vitest";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { getRecallItems } from "@/lib/utils/recall";
import { $createRecallNode } from "./recall-node";
import { RecallPlugin } from "./recall-plugin";
let mockEditor: any;
let mockEditorState: any;
let mockSelection: any;
let mockTextNode: any;
let mockRoot: any;
const createMockTextNode = (content: string) => ({
getTextContent: vi.fn(() => content),
insertBefore: vi.fn(),
insertAfter: vi.fn(),
remove: vi.fn(),
getChildren: vi.fn(() => []),
});
const createMockRecallNode = (recallItem: TSurveyRecallItem, fallbackValue: string) => ({
getRecallItem: vi.fn(() => recallItem),
getFallbackValue: vi.fn(() => fallbackValue),
setFallbackValue: vi.fn(),
insertBefore: vi.fn(),
insertAfter: vi.fn(),
getChildren: vi.fn(() => []),
});
const createMockEditor = () => ({
update: vi.fn((fn) => fn()),
registerUpdateListener: vi.fn(() => vi.fn()),
registerCommand: vi.fn(() => vi.fn()),
getEditorState: vi.fn(() => mockEditorState),
getRootElement: vi.fn(() => document.createElement("div")),
});
beforeEach(() => {
mockTextNode = createMockTextNode("Test text");
mockRoot = {
getTextContent: vi.fn(() => "Test text"),
getChildren: vi.fn(() => [mockTextNode]),
};
mockSelection = {
anchor: {
offset: 5,
getNode: vi.fn(() => mockTextNode),
},
focus: {
getNode: vi.fn(() => mockTextNode),
},
isCollapsed: vi.fn(() => true),
insertNodes: vi.fn(),
setTextNodeRange: vi.fn(),
};
mockEditorState = {
read: vi.fn((fn) => fn()),
};
mockEditor = createMockEditor();
});
vi.mock("@lexical/react/LexicalComposerContext", () => ({
useLexicalComposerContext: vi.fn(() => [mockEditor]),
}));
vi.mock("lexical", async () => {
const actual = await vi.importActual("lexical");
return {
...actual,
$getRoot: vi.fn(() => mockRoot),
$getSelection: vi.fn(() => mockSelection),
$isRangeSelection: vi.fn(() => true),
$isTextNode: vi.fn((node) => node && node.getTextContent !== undefined),
$isElementNode: vi.fn((node) => node && node.getChildren !== undefined),
$createTextNode: vi.fn((text) => createMockTextNode(text)),
COMMAND_PRIORITY_HIGH: 1,
KEY_DOWN_COMMAND: "keydown",
};
});
vi.mock("./recall-node", () => {
const RecallNodeMock = class {
__recallItem: TSurveyRecallItem;
__fallbackValue: string;
constructor({ recallItem, fallbackValue }: any) {
this.__recallItem = recallItem;
this.__fallbackValue = fallbackValue;
}
getRecallItem() {
return this.__recallItem;
}
getFallbackValue() {
return this.__fallbackValue;
}
setFallbackValue(value: string) {
this.__fallbackValue = value;
}
getChildren() {
return [];
}
};
return {
RecallNode: RecallNodeMock,
$createRecallNode: vi.fn(
({ recallItem, fallbackValue }) => new RecallNodeMock({ recallItem, fallbackValue })
),
};
});
vi.mock("@/lib/utils/recall", () => ({
getRecallItems: vi.fn((text: string) => {
if (text.includes("#recall:q1")) {
return [{ id: "q1", label: "Question 1", type: "question" }];
}
return [];
}),
getFallbackValues: vi.fn((text: string) => {
if (text.includes("#recall:q1/fallback:default#")) {
return { q1: "default" };
}
return {};
}),
}));
vi.mock("@/modules/survey/components/question-form-input/components/recall-item-select", () => ({
RecallItemSelect: ({ addRecallItem, setShowRecallItemSelect }: any) => (
<div data-testid="recall-item-select">
<button
data-testid="select-recall-item"
onClick={() => {
addRecallItem({ id: "q1", label: "Question 1", type: "question" });
}}>
Select Item
</button>
<button data-testid="close-recall-select" onClick={() => setShowRecallItemSelect(false)}>
Close
</button>
</div>
),
}));
vi.mock("@/modules/survey/components/question-form-input/components/fallback-input", () => ({
FallbackInput: ({ addFallback, setOpen, fallbacks, setFallbacks, filteredRecallItems }: any) => (
<div data-testid="fallback-input">
{filteredRecallItems?.map((recallItem: any) => {
if (!recallItem) return null;
return (
<input
key={recallItem.id}
data-testid="fallback-input-field"
value={fallbacks[recallItem.id] || ""}
onChange={(e) => setFallbacks({ ...fallbacks, [recallItem.id]: e.target.value })}
/>
);
})}
<button data-testid="add-fallback" onClick={addFallback}>
Add Fallback
</button>
<button data-testid="close-fallback" onClick={() => setOpen(false)}>
Close
</button>
</div>
),
}));
describe("RecallPlugin", () => {
const mockSurvey: TSurvey = {
id: "survey1",
questions: [
{
id: "q1",
headline: { en: "Question 1" },
type: "openText",
},
],
hiddenFields: { fieldIds: [] },
variables: [],
} as unknown as TSurvey;
const defaultProps = {
localSurvey: mockSurvey,
questionId: "q1",
selectedLanguageCode: "en",
recallItems: [],
setRecallItems: vi.fn(),
fallbacks: {},
setFallbacks: vi.fn(),
onShowFallbackInput: vi.fn(),
setAddFallbackFunction: vi.fn(),
setShowRecallItemSelect: vi.fn(),
showRecallItemSelect: false,
};
afterEach(() => {
cleanup();
vi.clearAllMocks();
});
describe("Component Rendering", () => {
test("renders without crashing", () => {
const { container } = render(<RecallPlugin {...defaultProps} />);
expect(container).toBeInTheDocument();
});
test("does not show RecallItemSelect by default", () => {
render(<RecallPlugin {...defaultProps} />);
expect(screen.queryByTestId("recall-item-select")).not.toBeInTheDocument();
});
test("does not show FallbackInput when showFallbackInput is false", () => {
render(<RecallPlugin {...defaultProps} />);
expect(screen.queryByTestId("fallback-input")).not.toBeInTheDocument();
});
test("renders RecallItemSelect when showRecallItemSelect is true", () => {
render(<RecallPlugin {...defaultProps} showRecallItemSelect={true} />);
// The RecallItemSelect component should be rendered
expect(screen.getByTestId("recall-item-select")).toBeInTheDocument();
});
test("does not show FallbackInput when recallItems is empty", () => {
render(<RecallPlugin {...defaultProps} onShowFallbackInput={() => {}} recallItems={[]} />);
expect(screen.queryByTestId("fallback-input")).not.toBeInTheDocument();
});
});
describe("Editor Registration", () => {
test("registers update listener on mount", () => {
render(<RecallPlugin {...defaultProps} />);
expect(mockEditor.registerUpdateListener).toHaveBeenCalled();
});
test("registers key down command on mount", () => {
render(<RecallPlugin {...defaultProps} />);
expect(mockEditor.registerCommand).toHaveBeenCalledWith("keydown", expect.any(Function), 1);
});
test("unregisters listeners on unmount", () => {
const removeUpdateListener = vi.fn();
const removeKeyListener = vi.fn();
mockEditor.registerUpdateListener.mockReturnValueOnce(removeUpdateListener);
mockEditor.registerCommand.mockReturnValueOnce(removeKeyListener);
const { unmount } = render(<RecallPlugin {...defaultProps} />);
unmount();
expect(removeUpdateListener).toHaveBeenCalled();
expect(removeKeyListener).toHaveBeenCalled();
});
});
describe("Initial Conversion", () => {
test("runs initial conversion on mount", () => {
render(<RecallPlugin {...defaultProps} />);
expect(mockEditor.update).toHaveBeenCalled();
});
test("initializes component correctly", () => {
render(<RecallPlugin {...defaultProps} />);
expect(mockEditor.registerUpdateListener).toHaveBeenCalled();
});
});
describe("Recall Item Addition", () => {
test("triggers recall item selection when @ key is pressed", async () => {
const setShowRecallItemSelect = vi.fn();
render(<RecallPlugin {...defaultProps} setShowRecallItemSelect={setShowRecallItemSelect} />);
// Trigger the @ key to show modal
const keyDownHandler = mockEditor.registerCommand.mock.calls[0][1];
mockTextNode = createMockTextNode("@");
mockSelection.anchor.getNode.mockReturnValue(mockTextNode);
mockSelection.anchor.offset = 1;
vi.useFakeTimers();
keyDownHandler({ key: "@" } as KeyboardEvent);
vi.advanceTimersByTime(20);
vi.useRealTimers();
// Verify that the recall item selection is triggered
expect(setShowRecallItemSelect).toHaveBeenCalledWith(true);
});
});
describe("Recall Item Selection", () => {
test("shows RecallItemSelect when showRecallItemSelect is true", () => {
render(<RecallPlugin {...defaultProps} showRecallItemSelect={true} />);
expect(screen.getByTestId("recall-item-select")).toBeInTheDocument();
});
});
describe("Editor Update Handling", () => {
test("handles editor updates with recall patterns", () => {
const setRecallItems = vi.fn();
mockRoot.getTextContent.mockReturnValue("Text with #recall:q1/fallback:default#");
render(<RecallPlugin {...defaultProps} setRecallItems={setRecallItems} />);
const updateHandler = mockEditor.registerUpdateListener.mock.calls[0][0];
updateHandler({ editorState: mockEditorState });
expect(vi.mocked(getRecallItems)).toHaveBeenCalled();
});
test("syncs state when no recall patterns present", () => {
mockRoot.getTextContent.mockReturnValue("Regular text without recall");
render(<RecallPlugin {...defaultProps} />);
const updateHandler = mockEditor.registerUpdateListener.mock.calls[0][0];
updateHandler({ editorState: mockEditorState });
expect(mockEditorState.read).toHaveBeenCalled();
});
});
describe("Text Conversion", () => {
test("converts recall patterns to RecallNodes", () => {
mockRoot.getTextContent.mockReturnValue("Text with #recall:q1/fallback:default#");
mockTextNode.getTextContent.mockReturnValue("Text with #recall:q1/fallback:default#");
render(<RecallPlugin {...defaultProps} />);
const updateHandler = mockEditor.registerUpdateListener.mock.calls[0][0];
updateHandler({ editorState: mockEditorState });
expect(mockEditor.update).toHaveBeenCalled();
});
});
describe("Click Outside Handling", () => {
test("closes recall item select when clicking outside", async () => {
const { rerender } = render(<RecallPlugin {...defaultProps} />);
// Trigger @ key to potentially show modal
const keyDownHandler = mockEditor.registerCommand.mock.calls[0][1];
mockTextNode = createMockTextNode("@");
mockSelection.anchor.getNode.mockReturnValue(mockTextNode);
mockSelection.anchor.offset = 1;
vi.useFakeTimers();
keyDownHandler({ key: "@" } as KeyboardEvent);
vi.advanceTimersByTime(20);
vi.useRealTimers();
// Simulate click outside
const clickEvent = new MouseEvent("mousedown", { bubbles: true });
document.dispatchEvent(clickEvent);
rerender(<RecallPlugin {...defaultProps} />);
});
});
describe("State Synchronization", () => {
test("syncs recall items from editor content", () => {
const setRecallItems = vi.fn();
const recallNode = createMockRecallNode({ id: "q1", label: "Question 1", type: "question" }, "default");
mockRoot.getChildren.mockReturnValue([recallNode]);
render(<RecallPlugin {...defaultProps} setRecallItems={setRecallItems} />);
const updateHandler = mockEditor.registerUpdateListener.mock.calls[0][0];
updateHandler({ editorState: mockEditorState });
});
});
describe("Fallback Value Updates", () => {
test("handles recall node creation", () => {
const recallItems: TSurveyRecallItem[] = [{ id: "q1", label: "Question 1", type: "question" }];
const recallNode = $createRecallNode({
recallItem: recallItems[0],
fallbackValue: "",
});
expect(recallNode).toBeDefined();
expect(recallNode.getRecallItem()).toEqual(recallItems[0]);
});
});
describe("Edge Cases", () => {
test("handles empty survey", () => {
const emptySurvey = {
...mockSurvey,
questions: [],
};
const { container } = render(<RecallPlugin {...defaultProps} localSurvey={emptySurvey} />);
expect(container).toBeInTheDocument();
});
test("handles missing hiddenFields", () => {
const surveyWithoutHiddenFields = {
...mockSurvey,
hiddenFields: undefined,
} as any;
const { container } = render(
<RecallPlugin {...defaultProps} localSurvey={surveyWithoutHiddenFields} />
);
expect(container).toBeInTheDocument();
});
test("handles keyboard events for non-@ keys", () => {
render(<RecallPlugin {...defaultProps} />);
const keyDownHandler = mockEditor.registerCommand.mock.calls[0][1];
const result = keyDownHandler({ key: "a" } as KeyboardEvent);
expect(result).toBe(false);
});
test("handles selection that is not a text node", () => {
render(<RecallPlugin {...defaultProps} />);
const keyDownHandler = mockEditor.registerCommand.mock.calls[0][1];
const elementNode = { getChildren: vi.fn(() => []) };
mockSelection.anchor.getNode.mockReturnValue(elementNode);
vi.useFakeTimers();
keyDownHandler({ key: "@" } as KeyboardEvent);
vi.advanceTimersByTime(20);
vi.useRealTimers();
});
test("handles nodes with children correctly", () => {
const childNode = createMockTextNode("child text");
const parentNode = {
getChildren: vi.fn(() => [childNode]),
getTextContent: vi.fn(() => "parent text"),
};
mockRoot.getChildren.mockReturnValue([parentNode]);
render(<RecallPlugin {...defaultProps} />);
expect(mockEditor.registerUpdateListener).toHaveBeenCalled();
});
test("handles errors during node traversal gracefully", () => {
const errorNode = {
getChildren: vi.fn(() => {
throw new Error("Test error");
}),
};
mockRoot.getChildren.mockReturnValue([errorNode]);
const { container } = render(<RecallPlugin {...defaultProps} />);
expect(container).toBeInTheDocument();
});
});
describe("Multiple Language Support", () => {
test("uses selected language code for recall items", () => {
mockRoot.getTextContent.mockReturnValue("Text with #recall:q1/fallback:default#");
render(<RecallPlugin {...defaultProps} selectedLanguageCode="es" />);
const updateHandler = mockEditor.registerUpdateListener.mock.calls[0][0];
updateHandler({ editorState: mockEditorState });
expect(vi.mocked(getRecallItems)).toHaveBeenCalledWith(expect.any(String), expect.any(Object), "es");
});
});
});
@@ -1,436 +0,0 @@
"use client";
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
import {
$createTextNode,
$getRoot,
$getSelection,
$isElementNode,
$isRangeSelection,
$isTextNode,
COMMAND_PRIORITY_HIGH,
EditorState,
KEY_DOWN_COMMAND,
LexicalNode,
TextNode,
} from "lexical";
import { useCallback, useEffect, useState } from "react";
import { logger } from "@formbricks/logger";
import { TSurvey, TSurveyRecallItem } from "@formbricks/types/surveys/types";
import { getFallbackValues, getRecallItems } from "@/lib/utils/recall";
import { RecallItemSelect } from "@/modules/survey/components/question-form-input/components/recall-item-select";
import { $createRecallNode, RecallNode } from "./recall-node";
interface RecallPluginProps {
localSurvey: TSurvey;
questionId: string;
selectedLanguageCode: string;
recallItems: TSurveyRecallItem[];
setRecallItems: (recallItems: TSurveyRecallItem[]) => void;
fallbacks: { [id: string]: string };
setFallbacks: (fallbacks: { [id: string]: string }) => void;
onShowFallbackInput: () => void;
setAddFallbackFunction: (fn: (() => void) | null) => void;
setShowRecallItemSelect: (show: boolean) => void;
showRecallItemSelect: boolean;
}
export const RecallPlugin = ({
localSurvey,
questionId,
selectedLanguageCode,
recallItems,
setRecallItems,
fallbacks,
setFallbacks,
onShowFallbackInput,
setAddFallbackFunction,
setShowRecallItemSelect,
showRecallItemSelect,
}: RecallPluginProps) => {
const [editor] = useLexicalComposerContext();
const [atSymbolPosition, setAtSymbolPosition] = useState<{ node: LexicalNode; offset: number } | null>(
null
);
// Helper function to collect all text nodes
const collectTextNodes = useCallback((root: LexicalNode): TextNode[] => {
const allTextNodes: TextNode[] = [];
const traverse = (node: LexicalNode) => {
try {
if ($isTextNode(node)) {
allTextNodes.push(node);
} else if ($isElementNode(node)) {
const children = node.getChildren();
for (const child of children) {
traverse(child);
}
}
} catch (error) {
logger.error("Error traversing node:", error);
}
};
traverse(root);
return allTextNodes;
}, []);
// Helper function to create nodes from text parts and matches
const createNodesFromText = useCallback(
(parts: string[], matches: string[]): LexicalNode[] => {
const newNodes: LexicalNode[] = [];
for (let i = 0; i < parts.length; i++) {
if (parts[i]) {
newNodes.push($createTextNode(parts[i]));
}
if (i < matches.length) {
const matchText = matches[i];
const items = getRecallItems(matchText, localSurvey, selectedLanguageCode);
const fallbackValues = getFallbackValues(matchText);
if (items.length > 0) {
const recallItem = items[0];
const fallbackValue = fallbackValues[recallItem.id] || "";
newNodes.push(
$createRecallNode({
recallItem,
fallbackValue,
})
);
}
}
}
return newNodes;
},
[localSurvey, selectedLanguageCode]
);
// Helper function to replace text node with new nodes
const replaceTextNode = useCallback((node: TextNode, newNodes: LexicalNode[]) => {
if (newNodes.length === 0) return;
try {
for (let index = 0; index < newNodes.length; index++) {
const newNode = newNodes[index];
if (index === 0) {
node.insertBefore(newNode);
} else {
newNodes[index - 1].insertAfter(newNode);
}
}
node.remove();
} catch (error) {
logger.error("Error replacing text node:", error);
}
}, []);
// Helper function to find all RecallNodes recursively
const findAllRecallNodes = useCallback((node: LexicalNode): RecallNode[] => {
const recallNodes: RecallNode[] = [];
if (node instanceof RecallNode) {
recallNodes.push(node);
}
// Only get children if this is an ElementNode
if ($isElementNode(node)) {
try {
const children = node.getChildren();
for (const child of children) {
const childRecallNodes = findAllRecallNodes(child);
recallNodes.push(...childRecallNodes);
}
} catch (error) {
logger.error("Error getting children from node:", error);
}
}
return recallNodes;
}, []);
// Convert raw recall text to RecallNodes
const convertTextToRecallNodes = useCallback(() => {
const root = $getRoot();
const allTextNodes = collectTextNodes(root);
const recallPattern = /#recall:[A-Za-z0-9_-]+\/fallback:[^#]*#/g;
for (const node of allTextNodes) {
const textContent = node.getTextContent();
const matches = textContent.match(recallPattern);
if (matches && matches.length > 0) {
const parts = textContent.split(recallPattern);
const newNodes = createNodesFromText(parts, matches);
replaceTextNode(node, newNodes);
}
}
}, [collectTextNodes, createNodesFromText, replaceTextNode]);
// Monitor editor content for recall patterns
const handleEditorUpdate = useCallback(
({ editorState }: { editorState: EditorState }) => {
editorState.read(() => {
const root = $getRoot();
const fullText = root.getTextContent();
// Find all RecallNodes in the editor
const allRecallNodes = findAllRecallNodes(root);
const currentRecallItems: TSurveyRecallItem[] = [];
const currentFallbacks: { [id: string]: string } = {};
// Extract recall items and fallbacks from existing RecallNodes
for (const recallNode of allRecallNodes) {
const recallItem = recallNode.getRecallItem();
const fallbackValue = recallNode.getFallbackValue();
currentRecallItems.push(recallItem);
currentFallbacks[recallItem.id] = fallbackValue;
}
// Check for recall patterns in full text (for raw text that needs conversion)
if (fullText.includes("#recall:")) {
const items = getRecallItems(fullText, localSurvey, selectedLanguageCode);
const fallbackValues = getFallbackValues(fullText);
// Merge with existing RecallNodes
const mergedItems = [...currentRecallItems];
const mergedFallbacks = { ...currentFallbacks };
for (const item of items) {
if (!mergedItems.some((existing) => existing.id === item.id)) {
mergedItems.push(item);
}
if (fallbackValues[item.id]) {
mergedFallbacks[item.id] = fallbackValues[item.id];
}
}
setRecallItems(mergedItems);
setFallbacks(mergedFallbacks);
// Convert any raw recall text to visual nodes
editor.update(() => {
convertTextToRecallNodes();
});
} else {
// No raw recall patterns, sync state with existing RecallNodes only
setRecallItems(currentRecallItems);
setFallbacks(currentFallbacks);
}
});
},
[localSurvey, selectedLanguageCode, editor, convertTextToRecallNodes, findAllRecallNodes]
);
// Handle @ key press for recall trigger
const handleKeyDown = useCallback(
(event: KeyboardEvent) => {
// Check if @ was pressed (Shift + 2 on most keyboards)
if (event.key === "@") {
// Small delay to let the character be inserted first
setTimeout(() => {
editor.getEditorState().read(() => {
const selection = $getSelection();
if ($isRangeSelection(selection)) {
const anchorOffset = selection.anchor.offset;
const anchorNode = selection.anchor.getNode();
// Check if the current node is a text node and contains @
if ($isTextNode(anchorNode)) {
const nodeText = anchorNode.getTextContent();
// Check if there's an @ at the current cursor position (just typed)
if (nodeText[anchorOffset - 1] === "@") {
// Store the position of the @ symbol
setAtSymbolPosition({
node: anchorNode,
offset: anchorOffset - 1,
});
setShowRecallItemSelect(true);
}
}
}
});
}, 10);
}
return false;
},
[editor]
);
// Close dropdown when clicking outside
useEffect(() => {
if (showRecallItemSelect) {
const handleClickOutside = (event: MouseEvent) => {
const target = event.target as HTMLElement;
if (!target.closest("[data-recall-dropdown]")) {
setShowRecallItemSelect(false);
setAtSymbolPosition(null); // Clear stored position when closing
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => document.removeEventListener("mousedown", handleClickOutside);
}
}, [showRecallItemSelect]);
// Clean up when dropdown closes
useEffect(() => {
if (!showRecallItemSelect && atSymbolPosition) {
// If dropdown was closed without selecting an item, clear the stored position
setAtSymbolPosition(null);
}
}, [showRecallItemSelect, atSymbolPosition]);
// Initial conversion of existing recall text and state sync on plugin load
useEffect(() => {
// Run initial conversion to handle any existing recall text
editor.update(() => {
convertTextToRecallNodes();
});
}, [editor, convertTextToRecallNodes]);
useEffect(() => {
const removeUpdateListener = editor.registerUpdateListener(handleEditorUpdate);
const removeKeyListener = editor.registerCommand(KEY_DOWN_COMMAND, handleKeyDown, COMMAND_PRIORITY_HIGH);
return () => {
removeUpdateListener();
removeKeyListener();
};
}, [editor, handleEditorUpdate, handleKeyDown]);
// Helper function to replace @ symbol with recall node using stored position
const replaceAtSymbolWithStoredPosition = useCallback(
(recallNode: RecallNode) => {
const selection = $getSelection();
if (!$isRangeSelection(selection) || !atSymbolPosition) return false;
selection.setTextNodeRange(
atSymbolPosition.node as TextNode,
atSymbolPosition.offset,
atSymbolPosition.node as TextNode,
atSymbolPosition.offset + 1
);
selection.insertNodes([recallNode]);
return true;
},
[atSymbolPosition]
);
// Helper function to replace @ symbol using current selection
const replaceAtSymbolWithCurrentSelection = useCallback((recallNode: RecallNode) => {
const selection = $getSelection();
if (!$isRangeSelection(selection)) return false;
const anchorOffset = selection.anchor.offset;
const anchorNode = selection.anchor.getNode();
if ($isTextNode(anchorNode)) {
const nodeText = anchorNode.getTextContent();
if (nodeText[anchorOffset - 1] === "@") {
selection.setTextNodeRange(anchorNode, anchorOffset - 1, anchorNode, anchorOffset);
selection.insertNodes([recallNode]);
return true;
}
}
// Fallback: insert at current position
selection.insertNodes([recallNode]);
return true;
}, []);
const addRecallItem = useCallback(
(recallItem: TSurveyRecallItem) => {
const handleRecallInsert = () => {
const recallNode = $createRecallNode({
recallItem,
fallbackValue: "",
});
const success =
atSymbolPosition && $isTextNode(atSymbolPosition.node)
? replaceAtSymbolWithStoredPosition(recallNode)
: replaceAtSymbolWithCurrentSelection(recallNode);
if (!success) {
// Ultimate fallback
const selection = $getSelection();
if ($isRangeSelection(selection)) {
selection.insertNodes([recallNode]);
}
}
};
editor.update(handleRecallInsert);
setAtSymbolPosition(null);
setShowRecallItemSelect(false);
// Immediately update recallItems state to include the new item
const newItems = [...recallItems];
if (!newItems.some((item) => item.id === recallItem.id)) {
newItems.push(recallItem);
}
setRecallItems(newItems);
// Show fallback input after state is updated
setTimeout(() => {
onShowFallbackInput();
}, 0);
},
[
editor,
atSymbolPosition,
replaceAtSymbolWithStoredPosition,
replaceAtSymbolWithCurrentSelection,
onShowFallbackInput,
recallItems,
]
);
const addFallback = useCallback(() => {
const handleFallbackUpdate = () => {
// Find all RecallNodes and update their fallback values
const root = $getRoot();
const allRecallNodes = findAllRecallNodes(root);
for (const recallNode of allRecallNodes) {
const recallItem = recallNode.getRecallItem();
const newFallbackValue = (fallbacks[recallItem.id]?.trim() || "").replaceAll(" ", "nbsp");
// Update the fallback value in the node
recallNode.setFallbackValue(newFallbackValue);
}
};
editor.update(handleFallbackUpdate);
}, [editor, fallbacks, findAllRecallNodes]);
// Expose addFallback function to parent
useEffect(() => {
setAddFallbackFunction(() => addFallback);
return () => setAddFallbackFunction(null);
}, [addFallback, setAddFallbackFunction]);
return (
<>
{/* Recall Item Select Modal */}
{showRecallItemSelect && (
<RecallItemSelect
localSurvey={localSurvey}
questionId={questionId}
addRecallItem={addRecallItem}
setShowRecallItemSelect={setShowRecallItemSelect}
recallItems={recallItems}
selectedLanguageCode={selectedLanguageCode}
hiddenFields={localSurvey.hiddenFields}
/>
)}
</>
);
};
@@ -75,7 +75,6 @@ vi.mock("@lexical/list", () => ({
INSERT_ORDERED_LIST_COMMAND: "insertOrderedList",
INSERT_UNORDERED_LIST_COMMAND: "insertUnorderedList",
REMOVE_LIST_COMMAND: "removeList",
// eslint-disable-next-line @typescript-eslint/no-extraneous-class
ListNode: class {},
}));
@@ -97,9 +96,9 @@ vi.mock("@lexical/utils", () => ({
mergeRegister: vi.fn((...args) => {
// Return a function that can be called during cleanup
return () => {
for (const fn of args) {
args.forEach((fn) => {
if (typeof fn === "function") fn();
}
});
};
}),
}));
@@ -150,8 +149,6 @@ vi.mock("lucide-react", () => ({
Link: () => <span data-testid="link-icon">Link</span>,
Underline: () => <span data-testid="underline-icon">Underline</span>,
ChevronDownIcon: () => <span data-testid="chevron-icon">ChevronDown</span>,
AtSign: () => <span data-testid="at-sign-icon">AtSign</span>,
PencilIcon: () => <span data-testid="pencil-icon">Pencil</span>,
}));
vi.mock("react-dom", () => ({
@@ -182,9 +179,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -194,7 +189,6 @@ describe("ToolbarPlugin", () => {
expect(screen.getByTestId("italic-icon")).toBeInTheDocument();
expect(screen.getByTestId("underline-icon")).toBeInTheDocument();
expect(screen.getByTestId("link-icon")).toBeInTheDocument();
expect(screen.getByTestId("at-sign-icon")).toBeInTheDocument();
});
test("does not render when editable is false", () => {
@@ -203,31 +197,26 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={false}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
expect(container.firstChild).toBeNull();
});
test("renders recall button when variables are provided", () => {
test("renders variables dropdown when variables are provided", async () => {
render(
<ToolbarPlugin
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
variables={["name", "email"]}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
// Verify recall functionality is available
expect(screen.getByTestId("at-sign-icon")).toBeInTheDocument();
// If variables should affect behavior, add assertions here
expect(screen.getByTestId("add-variables-dropdown")).toBeInTheDocument();
expect(screen.getByText("Variables: name, email")).toBeInTheDocument();
});
test("excludes toolbar items when specified", () => {
@@ -236,9 +225,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
excludedToolbarItems={["bold", "italic", "underline"]}
/>
);
@@ -256,9 +243,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
excludedToolbarItems={["blockType", "link"]}
/>
);
@@ -276,10 +261,8 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
excludedToolbarItems={["blockType", "bold", "italic", "underline", "link", "recall"]}
container={document.createElement("div")}
excludedToolbarItems={["blockType", "bold", "italic", "underline", "link"]}
/>
);
@@ -288,7 +271,6 @@ describe("ToolbarPlugin", () => {
expect(screen.queryByTestId("italic-icon")).not.toBeInTheDocument();
expect(screen.queryByTestId("underline-icon")).not.toBeInTheDocument();
expect(screen.queryByTestId("link-icon")).not.toBeInTheDocument();
expect(screen.queryByTestId("at-sign-icon")).not.toBeInTheDocument();
});
test("handles firstRender and updateTemplate props", () => {
@@ -299,9 +281,7 @@ describe("ToolbarPlugin", () => {
getText={() => "<p>Initial text</p>"}
setText={setText}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
firstRender={false}
setFirstRender={vi.fn()}
updateTemplate={true}
@@ -320,9 +300,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -341,9 +319,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -362,9 +338,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -377,15 +351,34 @@ describe("ToolbarPlugin", () => {
expect(mockEditor.dispatchCommand).toHaveBeenCalledWith("formatText", "underline");
});
test("dispatches link command on click", async () => {
render(
<ToolbarPlugin
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
container={document.createElement("div")}
/>
);
const linkIcon = screen.getByTestId("link-icon");
const linkButton = linkIcon.parentElement;
expect(linkButton).toBeInTheDocument();
expect(linkButton).not.toBeNull();
await userEvent.click(linkButton!);
expect(mockEditor.dispatchCommand).toHaveBeenCalledWith("toggleLink", {
url: "https://",
});
});
test("dispatches numbered list command on click", async () => {
render(
<ToolbarPlugin
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -404,9 +397,7 @@ describe("ToolbarPlugin", () => {
getText={() => "Sample text"}
setText={vi.fn()}
editable={true}
setShowRecallItemSelect={vi.fn()}
setShowLinkEditor={vi.fn()}
setShowFallbackInput={vi.fn()}
container={document.createElement("div")}
/>
);
@@ -1,7 +1,16 @@
"use client";
import { Button } from "@/modules/ui/components/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/modules/ui/components/dropdown-menu";
import { Input } from "@/modules/ui/components/input";
import { cn } from "@/modules/ui/lib/utils";
import { $generateHtmlFromNodes, $generateNodesFromDOM } from "@lexical/html";
import { $isLinkNode } from "@lexical/link";
import { $isLinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
import {
$isListNode,
INSERT_ORDERED_LIST_COMMAND,
@@ -11,31 +20,24 @@ import {
} from "@lexical/list";
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
import { $createHeadingNode, $isHeadingNode } from "@lexical/rich-text";
import { $isAtNodeEnd, $setBlocksType } from "@lexical/selection";
import { $isAtNodeEnd, $wrapNodes } from "@lexical/selection";
import { $getNearestNodeOfType, mergeRegister } from "@lexical/utils";
import { useTranslate } from "@tolgee/react";
import type { RangeSelection } from "lexical";
import type { BaseSelection, EditorState, LexicalEditor, NodeSelection, RangeSelection } from "lexical";
import {
$createParagraphNode,
$getRoot,
$getSelection,
$insertNodes,
$isRangeSelection,
COMMAND_PRIORITY_CRITICAL,
FORMAT_TEXT_COMMAND,
PASTE_COMMAND,
SELECTION_CHANGE_COMMAND,
} from "lexical";
import { AtSign, Bold, ChevronDownIcon, Italic, Link, PencilIcon, Underline } from "lucide-react";
import { Bold, ChevronDownIcon, Italic, Link, Underline } from "lucide-react";
import { useCallback, useEffect, useRef, useState } from "react";
import { Button } from "@/modules/ui/components/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/modules/ui/components/dropdown-menu";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/modules/ui/components/tooltip";
import { cn } from "@/modules/ui/lib/utils";
import { createPortal } from "react-dom";
import { AddVariablesDropdown } from "./add-variables-dropdown";
import type { TextEditorProps } from "./editor";
const LowPriority = 1;
@@ -54,6 +56,162 @@ const blockTypeToBlockName: BlockType = {
h2: "Small Heading",
};
const positionEditorElement = (editor: HTMLInputElement, rect: DOMRect | null) => {
if (rect === null) {
editor.style.opacity = "0";
editor.style.top = "-1000px";
editor.style.left = "-1000px";
} else {
editor.style.opacity = "1";
editor.style.top = `${rect.top + rect.height + window.pageYOffset + 10}px`;
editor.style.left = `${rect.left + window.pageXOffset - editor.offsetWidth / 2 + rect.width / 2}px`;
}
};
const FloatingLinkEditor = ({ editor }: { editor: LexicalEditor }) => {
const editorRef = useRef<HTMLInputElement>(null);
const mouseDownRef = useRef(false);
const inputRef = useRef<HTMLInputElement | null>(null);
const [linkUrl, setLinkUrl] = useState("");
const [isEditMode, setEditMode] = useState(false);
const [lastSelection, setLastSelection] = useState<RangeSelection | NodeSelection | BaseSelection | null>(
null
);
const updateLinkEditor = useCallback(() => {
const selection = $getSelection();
if ($isRangeSelection(selection)) {
const node = getSelectedNode(selection);
const parent = node.getParent();
if ($isLinkNode(parent)) {
setLinkUrl(parent.getURL());
} else if ($isLinkNode(node)) {
setLinkUrl(node.getURL());
} else {
setLinkUrl("");
}
}
const editorElem = editorRef.current;
const nativeSelection = window.getSelection();
const activeElement = document.activeElement;
if (editorElem === null) {
return;
}
const rootElement = editor.getRootElement();
if (
selection !== null &&
!nativeSelection?.isCollapsed &&
rootElement !== null &&
rootElement.contains(nativeSelection?.anchorNode || null)
) {
const domRange = nativeSelection?.getRangeAt(0);
let rect: DOMRect | undefined;
if (nativeSelection?.anchorNode === rootElement) {
let inner: Element = rootElement;
while (inner.firstElementChild != null) {
inner = inner.firstElementChild;
}
rect = inner.getBoundingClientRect();
} else {
rect = domRange?.getBoundingClientRect();
}
if (!mouseDownRef.current) {
positionEditorElement(editorElem, rect || null);
}
setLastSelection(selection);
} else if (!activeElement || activeElement.className !== "link-input") {
positionEditorElement(editorElem, null);
setLastSelection(null);
setEditMode(false);
setLinkUrl("");
}
return true;
}, [editor]);
useEffect(() => {
return mergeRegister(
editor.registerUpdateListener(({ editorState }: { editorState: EditorState }) => {
editorState.read(() => {
updateLinkEditor();
});
}),
editor.registerCommand(
SELECTION_CHANGE_COMMAND,
() => {
updateLinkEditor();
return true;
},
LowPriority
)
);
}, [editor, updateLinkEditor]);
useEffect(() => {
editor.getEditorState().read(() => {
updateLinkEditor();
});
}, [editor, updateLinkEditor]);
useEffect(() => {
if (isEditMode && inputRef.current) {
inputRef.current.focus();
}
}, [isEditMode]);
useEffect(() => {
setEditMode(true);
}, []);
const linkAttributes = {
target: "_blank",
rel: "noopener noreferrer",
};
const handleSubmit = () => {
if (lastSelection && linkUrl) {
editor.dispatchCommand(TOGGLE_LINK_COMMAND, {
url: linkUrl,
...linkAttributes,
});
}
setEditMode(false);
};
return (
<div ref={editorRef} className="link-editor">
{isEditMode && (
<div className="flex">
<Input
className="bg-white"
ref={inputRef}
value={linkUrl}
onChange={(event) => {
setLinkUrl(event.target.value);
}}
onKeyDown={(event) => {
if (event.key === "Enter") {
event.preventDefault();
handleSubmit();
} else if (event.key === "Escape") {
event.preventDefault();
setEditMode(false);
}
}}
/>
<Button className="py-2" onClick={handleSubmit}>
Add
</Button>
</div>
)}
</div>
);
};
const getSelectedNode = (selection: RangeSelection) => {
const anchor = selection.anchor;
const focus = selection.focus;
@@ -70,58 +228,15 @@ const getSelectedNode = (selection: RangeSelection) => {
}
};
const getButtonClassName = (active: boolean): string =>
active
? "bg-slate-100 text-slate-900 hover:bg-slate-200"
: "text-slate-600 hover:bg-slate-100 hover:text-slate-900";
interface ToolbarButtonProps {
icon: React.ComponentType<{ className?: string }>;
active: boolean;
onClick: () => void;
tooltipText: string;
disabled: boolean;
}
const ToolbarButton = ({ icon: Icon, active, onClick, tooltipText, disabled }: ToolbarButtonProps) => (
<TooltipProvider delayDuration={0}>
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="ghost"
size="icon"
type="button"
onClick={onClick}
disabled={disabled}
className={getButtonClassName(active)}>
<Icon />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>{tooltipText}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
);
export const ToolbarPlugin = (
props: TextEditorProps & {
setShowRecallItemSelect: (show: boolean) => void;
recallItemsCount?: number;
setShowFallbackInput: (show: boolean) => void;
setShowLinkEditor: (show: boolean) => void;
}
) => {
export const ToolbarPlugin = (props: TextEditorProps & { container: HTMLElement | null }) => {
const [editor] = useLexicalComposerContext();
const { t } = useTranslate();
const toolbarRef = useRef(null);
const [blockType, setBlockType] = useState("paragraph");
const [isLink, setIsLink] = useState(false);
const [isBold, setIsBold] = useState(false);
const [isItalic, setIsItalic] = useState(false);
const [isUnderline, setIsUnderline] = useState(false);
const [hasTextSelection, setHasTextSelection] = useState(false);
// save ref to setText to use it in event listeners safely
const setText = useRef<any>(props.setText);
@@ -136,7 +251,7 @@ export const ToolbarPlugin = (
const selection = $getSelection();
if ($isRangeSelection(selection)) {
$setBlocksType(selection, () => $createParagraphNode());
$wrapNodes(selection, () => $createParagraphNode());
}
});
}
@@ -148,7 +263,7 @@ export const ToolbarPlugin = (
const selection = $getSelection();
if ($isRangeSelection(selection)) {
$setBlocksType(selection, () => $createHeadingNode("h1"));
$wrapNodes(selection, () => $createHeadingNode("h1"));
}
});
}
@@ -160,7 +275,7 @@ export const ToolbarPlugin = (
const selection = $getSelection();
if ($isRangeSelection(selection)) {
$setBlocksType(selection, () => $createHeadingNode("h2"));
$wrapNodes(selection, () => $createHeadingNode("h2"));
}
});
}
@@ -205,7 +320,6 @@ export const ToolbarPlugin = (
const updateToolbar = useCallback(() => {
const selection = $getSelection();
if ($isRangeSelection(selection)) {
setHasTextSelection(!selection.isCollapsed());
const anchorNode = selection.anchor.getNode();
const element = anchorNode.getKey() === "root" ? anchorNode : anchorNode.getTopLevelElementOrThrow();
const elementKey = element.getKey();
@@ -233,6 +347,18 @@ export const ToolbarPlugin = (
}
}, [editor]);
const addVariable = (variable: string) => {
editor.update(() => {
const selection = $getSelection();
if ($isRangeSelection(selection)) {
editor.update(() => {
const formatedVariable = `{${variable.toUpperCase().replace(/ /g, "_")}}`;
selection?.insertRawText(formatedVariable);
});
}
});
};
useEffect(() => {
if (!props.firstRender) {
editor.update(() => {
@@ -244,8 +370,10 @@ export const ToolbarPlugin = (
const dom = parser.parseFromString(props.getText(), "text/html");
const nodes = $generateNodesFromDOM(editor, dom);
root.clear();
root.append(...nodes);
const paragraph = $createParagraphNode();
root.clear().append(paragraph);
paragraph.select();
$insertNodes(nodes);
});
}
});
@@ -261,11 +389,15 @@ export const ToolbarPlugin = (
const dom = parser.parseFromString(props.getText(), "text/html");
const nodes = $generateNodesFromDOM(editor, dom);
const root = $getRoot();
root.clear();
root.append(...nodes);
const paragraph = $createParagraphNode();
$getRoot().clear().append(paragraph);
editor.registerUpdateListener(({ editorState }) => {
paragraph.select();
$getRoot().select();
$insertNodes(nodes);
editor.registerUpdateListener(({ editorState, prevEditorState }) => {
editorState.read(() => {
const textInHtml = $generateHtmlFromNodes(editor)
.replace(/&lt;/g, "<")
@@ -273,6 +405,7 @@ export const ToolbarPlugin = (
.replace(/white-space:\s*pre-wrap;?/g, "");
setText.current(textInHtml);
});
if (!prevEditorState._selection) editor.blur();
});
});
}
@@ -298,19 +431,13 @@ export const ToolbarPlugin = (
const insertLink = useCallback(() => {
if (!isLink) {
// Check if there's text selected before opening link editor
editor.read(() => {
const selection = $getSelection();
if (!$isRangeSelection(selection) || selection.isCollapsed()) {
return; // Don't open link editor if no text is selected
}
props.setShowLinkEditor(true);
editor.dispatchCommand(TOGGLE_LINK_COMMAND, {
url: "https://",
});
} else {
// If we're already in a link, open the editor to edit it
props.setShowLinkEditor(true);
editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
}
}, [editor, isLink, props]);
}, [editor, isLink]);
useEffect(() => {
return editor.registerCommand(
@@ -340,50 +467,24 @@ export const ToolbarPlugin = (
icon: Bold,
onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "bold"),
active: isBold,
tooltipText: t("environments.surveys.edit.bold"),
disabled: false,
},
{
key: "italic",
icon: Italic,
onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "italic"),
active: isItalic,
tooltipText: t("environments.surveys.edit.italic"),
disabled: false,
},
{
key: "underline",
icon: Underline,
onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "underline"),
active: isUnderline,
tooltipText: t("environments.surveys.edit.underline"),
disabled: false,
},
{
key: "link",
icon: Link,
onClick: insertLink,
active: isLink,
tooltipText: isLink
? t("environments.surveys.edit.edit_link")
: t("environments.surveys.edit.insert_link"),
disabled: !isLink && !hasTextSelection,
},
{
key: "recall",
icon: AtSign,
onClick: () => props.setShowRecallItemSelect(true),
active: false,
tooltipText: t("environments.surveys.edit.recall_data"),
disabled: false,
},
{
key: "editRecall",
icon: PencilIcon,
onClick: () => props.setShowFallbackInput(true),
active: false,
tooltipText: t("environments.surveys.edit.edit_recall"),
disabled: !props.recallItemsCount || props.recallItemsCount === 0,
},
];
@@ -423,18 +524,31 @@ export const ToolbarPlugin = (
</DropdownMenu>
)}
{items.map(({ key, icon, onClick, active, tooltipText, disabled }) =>
{items.map(({ key, icon: Icon, onClick, active }) =>
!props.excludedToolbarItems?.includes(key) ? (
<ToolbarButton
<Button
key={key}
icon={icon}
active={active}
disabled={disabled}
variant="ghost"
type="button"
onClick={onClick}
tooltipText={tooltipText}
/>
className={active ? "bg-subtle active-button" : "inactive-button"}>
<Icon />
</Button>
) : null
)}
{isLink &&
!props.excludedToolbarItems?.includes("link") &&
createPortal(<FloatingLinkEditor editor={editor} />, props.container ?? document.body)}
{props.variables && (
<div className="ml-auto">
<AddVariablesDropdown
addVariable={addVariable}
isTextEditor={true}
variables={props.variables || []}
/>
</div>
)}
</div>
);
};
@@ -19,7 +19,7 @@
.editor-container {
border-radius: 6px;
position: relative;
line-height: 24px;
line-height: 20px;
font-weight: 400;
text-align: left;
border-color: #cbd5e1;
@@ -27,10 +27,6 @@
padding: 1px;
}
.editor-container:focus-within {
@apply border-brand-dark;
}
.editor-inner {
background: var(--cal-bg);
position: relative;
@@ -39,7 +35,7 @@
overflow: auto;
resize: vertical;
height: auto;
min-height: var(--editor-min-height, 40px);
min-height: 100px;
max-height: 150px;
}
@@ -349,4 +345,4 @@ i.link {
.inactive-button {
color: #777;
}
}
@@ -1,16 +1,16 @@
"use client";
import { cn } from "@/lib/cn";
import { FileUploadError, handleFileUpload } from "@/modules/storage/file-upload";
import { LoadingSpinner } from "@/modules/ui/components/loading-spinner";
import { OptionsSwitch } from "@/modules/ui/components/options-switch";
import { showStorageNotConfiguredToast } from "@/modules/ui/components/storage-not-configured-toast/lib/utils";
import { useTranslate } from "@tolgee/react";
import { FileIcon, XIcon } from "lucide-react";
import Image from "next/image";
import { useEffect, useState } from "react";
import toast from "react-hot-toast";
import { TAllowedFileExtension } from "@formbricks/types/storage";
import { cn } from "@/lib/cn";
import { FileUploadError, handleFileUpload } from "@/modules/storage/file-upload";
import { LoadingSpinner } from "@/modules/ui/components/loading-spinner";
import { OptionsSwitch } from "@/modules/ui/components/options-switch";
import { showStorageNotConfiguredToast } from "@/modules/ui/components/storage-not-configured-toast/lib/utils";
import { Uploader } from "./components/uploader";
import { VideoSettings } from "./components/video-settings";
import { getAllowedFiles } from "./lib/utils";
@@ -51,7 +51,7 @@ describe("File Input Utils", () => {
expect(result).toHaveLength(1);
expect(result[0].name).toBe("test.txt");
expect(toast.error).toHaveBeenCalledWith(expect.stringContaining("Unsupported file type."));
expect(toast.error).toHaveBeenCalledWith(expect.stringContaining("Unsupported file types: test.doc"));
});
test("should filter out files exceeding size limit", async () => {
@@ -64,7 +64,7 @@ describe("File Input Utils", () => {
expect(result).toHaveLength(1);
expect(result[0].name).toBe("small.txt");
expect(toast.error).toHaveBeenCalledWith(expect.stringContaining("File exceeds 5 MB size limit."));
expect(toast.error).toHaveBeenCalledWith(expect.stringContaining("Files exceeding size limit (5 MB)"));
});
test("should convert HEIC files to JPEG", async () => {
@@ -63,21 +63,10 @@ export const getAllowedFiles = async (
let toastMessage = "";
if (sizeExceedFiles.length > 0) {
if (sizeExceedFiles.length === 1) {
toastMessage += `File exceeds ${maxSizeInMB} MB size limit.`;
} else {
toastMessage += `${sizeExceedFiles.length} files exceed ${maxSizeInMB} MB size limit.`;
}
toastMessage += `Files exceeding size limit (${maxSizeInMB} MB): ${sizeExceedFiles.join(", ")}. `;
}
if (unsupportedExtensionFiles.length > 0) {
if (toastMessage) {
toastMessage += " ";
}
if (unsupportedExtensionFiles.length === 1) {
toastMessage += `Unsupported file type.`;
} else {
toastMessage += `${unsupportedExtensionFiles.length} files have unsupported types.`;
}
toastMessage += `Unsupported file types: ${unsupportedExtensionFiles.join(", ")}.`;
}
if (toastMessage) {
toast.error(toastMessage);
-6
View File
@@ -28,12 +28,6 @@ const nextConfig = {
experimental: {},
transpilePackages: ["@formbricks/database"],
images: {
// Optimize image processing to reduce CPU time and prevent timeouts
deviceSizes: [640, 750, 828, 1080, 1200, 1920], // Removed 3840 to avoid processing huge images
imageSizes: [16, 32, 48, 64, 96, 128, 256, 384], // Standard sizes for smaller images
formats: ["image/webp"], // WebP is faster to process and smaller than JPEG/PNG
minimumCacheTTL: 60, // Cache optimized images for at least 60 seconds
dangerouslyAllowSVG: true, // Allow SVG images
remotePatterns: [
{
protocol: "https",
+11 -11
View File
@@ -38,13 +38,13 @@
"@hookform/resolvers": "5.0.1",
"@intercom/messenger-js-sdk": "0.0.14",
"@json2csv/node": "7.0.6",
"@lexical/code": "0.36.2",
"@lexical/link": "0.36.2",
"@lexical/list": "0.36.2",
"@lexical/markdown": "0.36.2",
"@lexical/react": "0.36.2",
"@lexical/rich-text": "0.36.2",
"@lexical/table": "0.36.2",
"@lexical/code": "0.31.0",
"@lexical/link": "0.31.0",
"@lexical/list": "0.31.0",
"@lexical/markdown": "0.31.0",
"@lexical/react": "0.31.0",
"@lexical/rich-text": "0.31.0",
"@lexical/table": "0.31.0",
"@opentelemetry/exporter-prometheus": "0.203.0",
"@opentelemetry/host-metrics": "0.36.0",
"@opentelemetry/instrumentation": "0.203.0",
@@ -96,7 +96,7 @@
"https-proxy-agent": "7.0.6",
"jiti": "2.4.2",
"jsonwebtoken": "9.0.2",
"lexical": "0.36.2",
"lexical": "0.31.0",
"lodash": "4.17.21",
"lru-cache": "11.1.0",
"lucide-react": "0.507.0",
@@ -106,7 +106,7 @@
"next-auth": "4.24.11",
"next-safe-action": "7.10.8",
"node-fetch": "3.3.2",
"nodemailer": "7.0.9",
"nodemailer": "7.0.2",
"otplib": "12.0.1",
"papaparse": "5.5.2",
"posthog-js": "1.240.0",
@@ -148,7 +148,7 @@
"@types/lodash": "4.17.16",
"@types/markdown-it": "14.1.2",
"@types/mime-types": "2.1.4",
"@types/nodemailer": "7.0.2",
"@types/nodemailer": "6.4.17",
"@types/papaparse": "5.3.15",
"@types/qrcode": "1.5.5",
"@types/testing-library__react": "10.2.0",
@@ -157,7 +157,7 @@
"autoprefixer": "10.4.21",
"cross-env": "10.0.0",
"dotenv": "16.5.0",
"esbuild": "0.25.10",
"esbuild": "0.25.4",
"postcss": "8.5.3",
"resize-observer-polyfill": "1.5.1",
"ts-node": "10.9.2",
+3 -9
View File
@@ -145,7 +145,7 @@ install_formbricks() {
acme:
email: $email_address
storage: acme.json
caServer: "https://acme-v02.api.letsencrypt.org/directory"
caServer: "https://acme-v01.api.letsencrypt.org/directory"
tlsChallenge: {}"
else
certResolver=""
@@ -157,14 +157,8 @@ entryPoints:
web:
address: ":80"
$http_redirection
transport:
respondingTimeouts:
readTimeout: 60s
websecure:
address: ":443"
transport:
respondingTimeouts:
readTimeout: 60s
http:
tls:
$certResolver
@@ -496,7 +490,7 @@ EOF
if [[ $insert_traefik == "y" ]]; then
cat >> "$services_snippet_file" << EOF
traefik:
image: "traefik:v2.11.29"
image: "traefik:v2.7"
restart: always
container_name: "traefik"
depends_on:
@@ -525,7 +519,7 @@ EOF
cat > "$services_snippet_file" << EOF
traefik:
image: "traefik:v2.11.29"
image: "traefik:v2.7"
restart: always
container_name: "traefik"
depends_on:
+1 -1
View File
@@ -5675,7 +5675,7 @@
},
"/api/v1/management/storage": {
"post": {
"description": "API endpoint for uploading public files. Uploaded files are public and accessible by anyone. This endpoint requires authentication and enforces a hard limit of 5 MB for all uploads. It accepts a JSON body with fileName, fileType, environmentId, and optionally allowedFileExtensions to restrict file types. On success, it returns a signed URL for uploading the file to S3.",
"description": "API endpoint for uploading public files. Uploaded files are public and accessible by anyone. This endpoint requires authentication. It accepts a JSON body with fileName, fileType, environmentId, and optionally allowedFileExtensions to restrict file types. On success, it returns a signed URL for uploading the file to S3.",
"parameters": [
{
"example": "{{apiKey}}",
@@ -22,7 +22,7 @@ Email branding is a white-label feature that allows you to customize the email t
![Email Customization Settings](/images/xm-and-surveys/core-features/email-customization/email-customization-card.webp)
3. Upload a logo of your company. Logos must be 5 MB or less.
3. Upload a logo of your company.
4. Click on the **Save** button.
![Updated Logo](/images/xm-and-surveys/core-features/email-customization/updated-logo.webp)
@@ -49,7 +49,7 @@ In the left side bar, you find the `Configuration` page. On this page you find t
- **Color**: Pick any color for the background
- **Animation**: Add dynamic animations to enhance user experience..
- **Upload**: Use a custom uploaded image for a personalized touch. Images must be 5 MB or less.
- **Upload**: Use a custom uploaded image for a personalized touch
- Image: Choose from Unsplash's extensive gallery. Note that these images will have a link and mention of the author & Unsplash on the bottom right to give them the credit for their awesome work!
- **Background Overlay**: Adjust the background's opacity
@@ -63,7 +63,7 @@ Customize your survey with your brand's logo.
![Choose a link survey template](/images/xm-and-surveys/core-features/styling-theme/step-four.webp)
2. Upload your logo. Logos must be 5 MB or less.
2. Upload your logo
![Choose a link survey template](/images/xm-and-surveys/core-features/styling-theme/step-five.webp)
@@ -16,7 +16,7 @@ Click the icon on the right side of the question to add an image or video:
![Access Question settings](/images/xm-and-surveys/surveys/general-features/add-image-or-video-question/add-image-or-video-to-question.webp)
Upload an image by clicking the upload icon or dragging the file. Images must be 5 MB or less:
Upload an image by clicking the upload icon or dragging the file:
![Overview of adding image to question](/images/xm-and-surveys/surveys/general-features/add-image-or-video-question/add-image-or-video-to-question-image.webp)
@@ -40,7 +40,7 @@ Provide an optional description with further instructions.
### Images
Images can be uploaded via click or drag and drop. At least two images are required. Each image must be 5 MB or less.
Images can be uploaded via click or drag and drop. At least two images are required.
### Allow Multi Select
@@ -65,20 +65,6 @@ formbricks.setAttributes({
to 150 attributes per environment.
</Note>
### Setting User Language
Use the `setLanguage` function to set the user's preferred language for surveys. This allows you to display surveys in the user's language when multi-language surveys are enabled. You can pass either the ISO language code (e.g., "de", "fr", "es") or the language alias you configured in your project settings.
```javascript Setting User Language
formbricks.setLanguage("de"); // ISO identifier or Alias set when creating language
```
<Note>
If a user has a language assigned, a survey has multi-language activated and it is missing a translation in
the language of the user, the survey will not be displayed. Learn more about [Multi-language Surveys](/docs/xm-and-surveys/surveys/general-features/multi-language-surveys).
</Note>
### Logging Out Users
When a user logs out of your webpage, also log them out of Formbricks to prevent activity from being linked to the wrong user. Use the logout function:
+1 -5
View File
@@ -78,11 +78,7 @@
"next-auth@4.24.11": "patches/next-auth@4.24.11.patch"
},
"overrides": {
"axios": ">=1.12.2",
"tar-fs": "2.1.4"
},
"comments": {
"overrides": "Security fixes for transitive dependencies. Remove when upstream packages update: axios (CVE-2025-58754) - awaiting @boxyhq/saml-jackson update | tar-fs (Dependabot #205) - awaiting upstream dependency updates"
"tar-fs": ">=2.1.4"
}
}
}
+2 -2
View File
@@ -81,14 +81,14 @@ describe("CacheService", () => {
expect(result.error.code).toBe(ErrorCode.CacheCorruptionError);
}
expect(logger.warn).toHaveBeenCalledWith(
"Corrupted cache data detected, treating as cache miss",
expect.objectContaining({
key,
parseError: expect.objectContaining({
name: "SyntaxError",
message: expect.stringContaining("JSON") as string,
}) as Error,
}),
"Corrupted cache data detected, treating as cache miss"
})
);
});
+4 -7
View File
@@ -67,13 +67,10 @@ export class CacheService {
return ok(JSON.parse(value) as T);
} catch (parseError) {
// JSON parse failure indicates corrupted cache data - treat as cache miss
logger.warn(
{
key,
parseError,
},
"Corrupted cache data detected, treating as cache miss"
);
logger.warn("Corrupted cache data detected, treating as cache miss", {
key,
parseError,
});
return err({
code: ErrorCode.CacheCorruptionError,
});
+2 -2
View File
@@ -36,8 +36,8 @@
"author": "Formbricks <hola@formbricks.com>",
"dependencies": {
"zod": "3.24.4",
"pino": "10.0.0",
"pino-pretty": "13.1.1"
"pino": "9.6.0",
"pino-pretty": "13.0.0"
},
"devDependencies": {
"vite": "6.3.6",
+2 -14
View File
@@ -1,7 +1,7 @@
import { type TResponseData, type TResponseVariables } from "@formbricks/types/responses";
import { type TSurveyQuestion, TSurveyQuestionTypeEnum } from "@formbricks/types/surveys/types";
import { formatDateWithOrdinal, isValidDateString } from "@/lib/date-time";
import { getLocalizedValue } from "@/lib/i18n";
import { type TResponseData, type TResponseVariables } from "@formbricks/types/responses";
import { type TSurveyQuestion } from "@formbricks/types/surveys/types";
// Extracts the ID of recall question from a string containing the "recall" pattern.
const extractId = (text: string): string | null => {
@@ -93,17 +93,5 @@ export const parseRecallInformation = (
variables
);
}
if (
(question.type === TSurveyQuestionTypeEnum.CTA || question.type === TSurveyQuestionTypeEnum.Consent) &&
question.html &&
question.html[languageCode].includes("recall:") &&
modifiedQuestion.html
) {
modifiedQuestion.html[languageCode] = replaceRecallInfo(
getLocalizedValue(modifiedQuestion.html, languageCode),
responseData,
variables
);
}
return modifiedQuestion;
};
+1 -1
View File
@@ -1373,7 +1373,7 @@ export const ZSurvey = z
return false;
})
.map((q) => q.id),
...(survey.hiddenFields.fieldIds ?? []),
...(survey.hiddenFields.enabled ? (survey.hiddenFields.fieldIds ?? []) : []),
];
if (validOptions.findIndex((option) => option === followUp.action.properties.to) === -1) {
+388 -1518
View File
File diff suppressed because it is too large Load Diff