From 142c1bd35be81434f75b3e44ea4041ea749eed7a Mon Sep 17 00:00:00 2001 From: Matti Nannt Date: Thu, 10 Aug 2023 13:14:17 +0200 Subject: [PATCH 1/3] Fix saved changes are not visible in Survey Editor (#674) --- .../surveys/[surveyId]/edit/SurveyEditor.tsx | 6 ++---- .../surveys/[surveyId]/edit/SurveyMenuBar.tsx | 3 ++- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyEditor.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyEditor.tsx index 1777c2ff04..c994d0f6eb 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyEditor.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyEditor.tsx @@ -29,11 +29,9 @@ export default function SurveyEditor({ environmentId, surveyId }: SurveyEditorPr useEffect(() => { if (survey) { - if (!localSurvey) { - setLocalSurvey(survey); - } + setLocalSurvey(survey); - if (!activeQuestionId && survey.questions.length > 0) { + if (survey.questions.length > 0) { setActiveQuestionId(survey.questions[0].id); } } diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyMenuBar.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyMenuBar.tsx index 8b924f8a32..91cf2b16fe 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyMenuBar.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/SurveyMenuBar.tsx @@ -65,7 +65,8 @@ export default function SurveyMenuBar({ // write a function which updates the local survey status const updateLocalSurveyStatus = (status: Survey["status"]) => { - const updatedSurvey = { ...localSurvey, status }; + const updatedSurvey = JSON.parse(JSON.stringify(localSurvey)); + updatedSurvey.status = status; setLocalSurvey(updatedSurvey); }; From 9cdf446f65c3b4f80687eb172b989c8f32098881 Mon Sep 17 00:00:00 2001 From: Matti Nannt Date: Thu, 10 Aug 2023 16:22:10 +0200 Subject: [PATCH 2/3] Remove lodash dependency from formbricks-js (#677) * Remove lodash dependency from formbricks-js * add array utils file --- .../[surveyId]/QuestionFilterComboBox.tsx | 3 +-- .../preview/MultipleChoiceMultiQuestion.tsx | 10 ++++----- apps/web/lib/surveys/surveys.ts | 21 +++++++++---------- .../MultipleChoiceMultiQuestion.tsx | 4 ++-- packages/lib/utils/array.ts | 3 +++ 5 files changed, 21 insertions(+), 20 deletions(-) create mode 100644 packages/lib/utils/array.ts diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/QuestionFilterComboBox.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/QuestionFilterComboBox.tsx index 8c10ec1fce..c9d11dbb87 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/QuestionFilterComboBox.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/QuestionFilterComboBox.tsx @@ -14,7 +14,6 @@ import { import useClickOutside from "@formbricks/lib/useClickOutside"; import { ChevronDown, ChevronUp, X } from "lucide-react"; import { QuestionType } from "@formbricks/types/questions"; -import { isArray } from "lodash"; import clsx from "clsx"; type QuestionFilterComboBoxProps = { @@ -150,7 +149,7 @@ const QuestionFilterComboBox = ({ !isMultiple ? onChangeFilterComboBoxValue(o) : onChangeFilterComboBoxValue( - isArray(filterComboBoxValue) ? [...filterComboBoxValue, o] : [o] + Array.isArray(filterComboBoxValue) ? [...filterComboBoxValue, o] : [o] ); !isMultiple && setOpen(false); }} diff --git a/apps/web/components/preview/MultipleChoiceMultiQuestion.tsx b/apps/web/components/preview/MultipleChoiceMultiQuestion.tsx index 1285043a77..916b3be189 100644 --- a/apps/web/components/preview/MultipleChoiceMultiQuestion.tsx +++ b/apps/web/components/preview/MultipleChoiceMultiQuestion.tsx @@ -1,14 +1,14 @@ -import { Input } from "@formbricks/ui"; +import { BackButton } from "@/components/preview/BackButton"; import SubmitButton from "@/components/preview/SubmitButton"; import { shuffleArray } from "@/lib/utils"; import { cn } from "@formbricks/lib/cn"; +import { symmetricDifference } from "@formbricks/lib/utils/array"; +import { Response } from "@formbricks/types/js"; import type { Choice, MultipleChoiceMultiQuestion } from "@formbricks/types/questions"; +import { Input } from "@formbricks/ui"; import { useEffect, useState } from "react"; import Headline from "./Headline"; import Subheader from "./Subheader"; -import _ from "lodash"; -import { Response } from "@formbricks/types/js"; -import { BackButton } from "@/components/preview/BackButton"; interface MultipleChoiceMultiProps { question: MultipleChoiceMultiQuestion; @@ -80,7 +80,7 @@ export default function MultipleChoiceMultiQuestion({ [question.id]: selectedChoices, }; - if (_.xor(selectedChoices, storedResponseValue).length === 0) { + if (storedResponseValue && symmetricDifference(selectedChoices, storedResponseValue).length === 0) { goToNextQuestion(data); return; } diff --git a/apps/web/lib/surveys/surveys.ts b/apps/web/lib/surveys/surveys.ts index b04bf024b0..fa21a2d564 100644 --- a/apps/web/lib/surveys/surveys.ts +++ b/apps/web/lib/surveys/surveys.ts @@ -1,20 +1,19 @@ -import useSWR from "swr"; -import { fetcher } from "@formbricks/lib/fetcher"; -import { TSurvey } from "@formbricks/types/v1/surveys"; -import { TResponse } from "@formbricks/types/v1/responses"; +import { + DateRange, + SelectedFilterValue, +} from "@/app/(app)/environments/[environmentId]/ResponseFilterContext"; import { OptionsType, QuestionOptions, } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/QuestionsComboBox"; import { QuestionFilterOptions } from "@/app/(app)/environments/[environmentId]/surveys/[surveyId]/ResponseFilter"; +import { fetcher } from "@formbricks/lib/fetcher"; import { QuestionType } from "@formbricks/types/questions"; +import { TResponse } from "@formbricks/types/v1/responses"; +import { TSurvey } from "@formbricks/types/v1/surveys"; import { TTag } from "@formbricks/types/v1/tags"; -import { - DateRange, - SelectedFilterValue, -} from "@/app/(app)/environments/[environmentId]/ResponseFilterContext"; -import { isArray } from "lodash"; import { isWithinInterval } from "date-fns"; +import useSWR from "swr"; export const useSurveys = (environmentId: string) => { const { data, error, mutate, isLoading } = useSWR(`/api/v1/environments/${environmentId}/surveys`, fetcher); @@ -404,7 +403,7 @@ export const getFilterResponses = ( if (question) { const responseValue = response.data[question.id]; const filterValue = filter?.filterType?.filterComboBoxValue; - if (isArray(responseValue) && isArray(filterValue) && filterValue.length > 0) { + if (Array.isArray(responseValue) && Array.isArray(filterValue) && filterValue.length > 0) { //@ts-ignore const updatedResponseValue = question?.choices ? //@ts-ignore @@ -435,7 +434,7 @@ export const getFilterResponses = ( const filterValue = filter?.filterType?.filterComboBoxValue; if ( filter?.filterType?.filterValue === "Includes either" && - isArray(filterValue) && + Array.isArray(filterValue) && filterValue.length > 0 && typeof responseValue === "string" ) { diff --git a/packages/js/src/components/MultipleChoiceMultiQuestion.tsx b/packages/js/src/components/MultipleChoiceMultiQuestion.tsx index 8913a72c2b..348ec17526 100644 --- a/packages/js/src/components/MultipleChoiceMultiQuestion.tsx +++ b/packages/js/src/components/MultipleChoiceMultiQuestion.tsx @@ -6,8 +6,8 @@ import { cn, shuffleArray } from "../lib/utils"; import Headline from "./Headline"; import Subheader from "./Subheader"; import SubmitButton from "./SubmitButton"; -import _ from "lodash"; import { BackButton } from "./BackButton"; +import { symmetricDifference } from "../../../lib/utils/array"; interface MultipleChoiceMultiProps { question: TSurveyMultipleChoiceMultiQuestion; @@ -91,7 +91,7 @@ export default function MultipleChoiceMultiQuestion({ [question.id]: selectedChoices, }; - if (_.xor(selectedChoices, storedResponseValue).length === 0) { + if (symmetricDifference(selectedChoices, storedResponseValue).length === 0) { goToNextQuestion(data); return; } diff --git a/packages/lib/utils/array.ts b/packages/lib/utils/array.ts new file mode 100644 index 0000000000..f1be591094 --- /dev/null +++ b/packages/lib/utils/array.ts @@ -0,0 +1,3 @@ +export function symmetricDifference(arr1: T[], arr2: T[]): T[] { + return arr1.filter((x) => !arr2.includes(x)).concat(arr2.filter((x) => !arr1.includes(x))); +} From 179f92077bbba6c21830d92b463c247bef64b62a Mon Sep 17 00:00:00 2001 From: Matti Nannt Date: Thu, 10 Aug 2023 17:25:40 +0200 Subject: [PATCH 3/3] Apply prettier formatting (#678) --- .../settings/profile/EditAvatar.tsx | 2 +- .../settings/profile/EditName.tsx | 5 ++- .../components/shared/EmptySpaceFiller.tsx | 2 +- apps/web/components/shared/GoBackButton.tsx | 2 +- .../MultipleChoiceSingleQuestion.tsx | 2 +- packages/ui/index.tsx | 31 ++++++++++++++----- 6 files changed, 30 insertions(+), 14 deletions(-) diff --git a/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditAvatar.tsx b/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditAvatar.tsx index cfe31eade3..71cd2f305c 100644 --- a/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditAvatar.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditAvatar.tsx @@ -5,7 +5,7 @@ import { Button, ProfileAvatar } from "@formbricks/ui"; import Image from "next/image"; import { Session } from "next-auth"; -export function EditAvatar({ session }:{session: Session | null}) { +export function EditAvatar({ session }: { session: Session | null }) { return (
{session?.user?.image ? ( diff --git a/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditName.tsx b/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditName.tsx index 2db1dc360c..97e8e5f45a 100644 --- a/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditName.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/settings/profile/EditName.tsx @@ -7,18 +7,17 @@ import { profileEditAction } from "./actions"; import { TProfile } from "@formbricks/types/v1/profile"; export function EditName({ profile }: { profile: TProfile }) { - const { register, handleSubmit, formState: { isSubmitting }, - } = useForm<{name:string}>() + } = useForm<{ name: string }>(); return ( <>
{ + onSubmit={handleSubmit(async (data) => { try { await profileEditAction(profile.id, data); toast.success("Your name was updated successfully."); diff --git a/apps/web/components/shared/EmptySpaceFiller.tsx b/apps/web/components/shared/EmptySpaceFiller.tsx index b2b362f736..72f48e53f3 100644 --- a/apps/web/components/shared/EmptySpaceFiller.tsx +++ b/apps/web/components/shared/EmptySpaceFiller.tsx @@ -30,7 +30,7 @@ const EmptySpaceFiller: React.FC = ({
-
+
{!environment.widgetSetupCompleted && !noWidgetRequired && (