From 4a3289d394cd63e55b392b43eaf33b65be9d9ecb Mon Sep 17 00:00:00 2001 From: Shubham Palriwala Date: Fri, 15 Sep 2023 20:17:33 +0530 Subject: [PATCH] chore: rewrite survey not found page to new nextjs standards (#807) * feat: nextjs custom 404 page notFound * type survey type properly and return unused inactive screen states --------- Co-authored-by: Matthias Nannt --- .../surveys/[surveyId]/SummaryHeader.tsx | 1 - apps/web/app/s/[surveyId]/SurveyInactive.tsx | 13 ++++----- apps/web/app/s/[surveyId]/not-found.tsx | 27 +++++++++++++++++++ apps/web/app/s/[surveyId]/page.tsx | 5 ++-- .../migration.sql | 16 +++++++++++ packages/database/schema.prisma | 1 - packages/types/surveys.ts | 4 +-- packages/types/v1/surveys.ts | 2 +- 8 files changed, 54 insertions(+), 15 deletions(-) create mode 100644 apps/web/app/s/[surveyId]/not-found.tsx create mode 100644 packages/database/migrations/20230915143725_remove_survey_status_archived/migration.sql diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/SummaryHeader.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/SummaryHeader.tsx index 223bc16866..6a6e629909 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/SummaryHeader.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/SummaryHeader.tsx @@ -99,7 +99,6 @@ const SummaryHeader = ({ surveyId, environmentId, survey, surveyBaseUrl }: Summa {survey.status === "inProgress" && "In-progress"} {survey.status === "paused" && "Paused"} {survey.status === "completed" && "Completed"} - {survey.status === "archived" && "Archived"} diff --git a/apps/web/app/s/[surveyId]/SurveyInactive.tsx b/apps/web/app/s/[surveyId]/SurveyInactive.tsx index 9a3a8ef830..1796b10665 100644 --- a/apps/web/app/s/[surveyId]/SurveyInactive.tsx +++ b/apps/web/app/s/[surveyId]/SurveyInactive.tsx @@ -1,26 +1,23 @@ -import React from "react"; -import { CheckCircleIcon, PauseCircleIcon, QuestionMarkCircleIcon } from "@heroicons/react/24/solid"; -import footerLogo from "./footerlogo.svg"; +import { TSurveyClosedMessage } from "@formbricks/types/v1/surveys"; +import { Button } from "@formbricks/ui"; +import { CheckCircleIcon, PauseCircleIcon } from "@heroicons/react/24/solid"; import Image from "next/image"; import Link from "next/link"; -import { Button } from "@formbricks/ui"; -import { TSurveyClosedMessage } from "@formbricks/types/v1/surveys"; +import footerLogo from "./footerlogo.svg"; const SurveyInactive = ({ status, surveyClosedMessage, }: { - status: string; + status: "paused" | "completed"; surveyClosedMessage?: TSurveyClosedMessage | null; }) => { const icons = { - "not found": , paused: , completed: , }; const descriptions = { - "not found": "There is not survey with this ID.", paused: "This free & open-source survey is temporarily paused.", completed: "This free & open-source survey has been closed.", }; diff --git a/apps/web/app/s/[surveyId]/not-found.tsx b/apps/web/app/s/[surveyId]/not-found.tsx new file mode 100644 index 0000000000..1ba1493d17 --- /dev/null +++ b/apps/web/app/s/[surveyId]/not-found.tsx @@ -0,0 +1,27 @@ +import React from "react"; +import { QuestionMarkCircleIcon } from "@heroicons/react/24/solid"; +import footerLogo from "./footerlogo.svg"; +import Image from "next/image"; +import { Button } from "@formbricks/ui"; +import Link from "next/link"; + +export default function NotFound() { + return ( +
+
+
+ , +

Survey not found.

+

There is not survey with this ID.

+ +
+
+ + Brand logo + +
+
+ ); +} diff --git a/apps/web/app/s/[surveyId]/page.tsx b/apps/web/app/s/[surveyId]/page.tsx index 90ca90b507..5a427d9936 100644 --- a/apps/web/app/s/[surveyId]/page.tsx +++ b/apps/web/app/s/[surveyId]/page.tsx @@ -8,12 +8,13 @@ import { getProductByEnvironmentId } from "@formbricks/lib/services/product"; import { getSurvey } from "@formbricks/lib/services/survey"; import { getEmailVerificationStatus } from "./helpers"; import { checkValidity } from "@/app/s/[surveyId]/prefilling"; +import { notFound } from "next/navigation"; export default async function LinkSurveyPage({ params, searchParams }) { const survey = await getSurvey(params.surveyId); - if (!survey || survey.type !== "link") { - return ; + if (!survey || survey.type !== "link" || survey.status === "draft") { + notFound(); } // question pre filling: Check if the first question is prefilled and if it is valid diff --git a/packages/database/migrations/20230915143725_remove_survey_status_archived/migration.sql b/packages/database/migrations/20230915143725_remove_survey_status_archived/migration.sql new file mode 100644 index 0000000000..edb52055d7 --- /dev/null +++ b/packages/database/migrations/20230915143725_remove_survey_status_archived/migration.sql @@ -0,0 +1,16 @@ +/* + Warnings: + + - The values [archived] on the enum `SurveyStatus` will be removed. If these variants are still used in the database, this will fail. + +*/ +-- AlterEnum +BEGIN; +CREATE TYPE "SurveyStatus_new" AS ENUM ('draft', 'inProgress', 'paused', 'completed'); +ALTER TABLE "Survey" ALTER COLUMN "status" DROP DEFAULT; +ALTER TABLE "Survey" ALTER COLUMN "status" TYPE "SurveyStatus_new" USING ("status"::text::"SurveyStatus_new"); +ALTER TYPE "SurveyStatus" RENAME TO "SurveyStatus_old"; +ALTER TYPE "SurveyStatus_new" RENAME TO "SurveyStatus"; +DROP TYPE "SurveyStatus_old"; +ALTER TABLE "Survey" ALTER COLUMN "status" SET DEFAULT 'draft'; +COMMIT; diff --git a/packages/database/schema.prisma b/packages/database/schema.prisma index 058474c8ee..3b9e7fc834 100644 --- a/packages/database/schema.prisma +++ b/packages/database/schema.prisma @@ -152,7 +152,6 @@ enum SurveyStatus { inProgress paused completed - archived } enum DisplayStatus { diff --git a/packages/types/surveys.ts b/packages/types/surveys.ts index 871d2fc2eb..10913f00d5 100644 --- a/packages/types/surveys.ts +++ b/packages/types/surveys.ts @@ -24,7 +24,7 @@ export interface Survey { redirectUrl: string | null; type: "web" | "email" | "link" | "mobile"; environmentId: string; - status: "draft" | "inProgress" | "archived" | "paused" | "completed"; + status: "draft" | "inProgress" | "paused" | "completed"; recontactDays: number | null; questions: Question[]; thankYouCard: ThankYouCard; @@ -56,6 +56,6 @@ export interface SurveyNotificationData { responseCompletedLength: number; latestResponse: any; questions: Question[]; - status: "draft" | "inProgress" | "archived" | "paused" | "completed"; + status: "draft" | "inProgress" | "paused" | "completed"; name: String; } diff --git a/packages/types/v1/surveys.ts b/packages/types/v1/surveys.ts index 10cdd85117..45f77da366 100644 --- a/packages/types/v1/surveys.ts +++ b/packages/types/v1/surveys.ts @@ -240,7 +240,7 @@ export const ZSurvey = z.object({ name: z.string(), type: z.enum(["web", "email", "link", "mobile"]), environmentId: z.string(), - status: z.enum(["draft", "inProgress", "archived", "paused", "completed"]), + status: z.enum(["draft", "inProgress", "paused", "completed"]), attributeFilters: z.array(ZSurveyAttributeFilter), displayOption: z.enum(["displayOnce", "displayMultiple", "respondMultiple"]), autoClose: z.union([z.number(), z.null()]),