diff --git a/packages/app-store/ee/routing-forms/components/FormActions.tsx b/packages/app-store/ee/routing-forms/components/FormActions.tsx index 9628090465..d43ef22334 100644 --- a/packages/app-store/ee/routing-forms/components/FormActions.tsx +++ b/packages/app-store/ee/routing-forms/components/FormActions.tsx @@ -62,12 +62,14 @@ function NewFormDialog({ appUrl }: { appUrl: string }) { const mutation = trpc.useMutation("viewer.app_routing_forms.formMutation", { onSuccess: (_data, variables) => { - utils.invalidateQueries("viewer.app_routing_forms.forms"); router.push(`${appUrl}/form-edit/${variables.id}`); }, onError: () => { showToast(`Something went wrong`, "error"); }, + onSettled: () => { + utils.invalidateQueries("viewer.app_routing_forms.forms"); + }, }); const hookForm = useForm<{ @@ -163,6 +165,15 @@ function Dialogs({ const utils = trpc.useContext(); const router = useRouter(); const deleteMutation = trpc.useMutation("viewer.app_routing_forms.deleteForm", { + onMutate: async ({ id: formId }) => { + await utils.cancelQuery(["viewer.app_routing_forms.forms"]); + const previousValue = utils.getQueryData(["viewer.app_routing_forms.forms"]); + if (previousValue) { + const filtered = previousValue.filter(({ id }) => id !== formId); + utils.setQueryData(["viewer.app_routing_forms.forms"], filtered); + } + return { previousValue }; + }, onSuccess: () => { showToast("Form deleted", "success"); setDeleteDialogOpen(false); @@ -172,7 +183,10 @@ function Dialogs({ utils.invalidateQueries(["viewer.app_routing_forms.forms"]); setDeleteDialogOpen(false); }, - onError: () => { + onError: (err, newTodo, context) => { + if (context?.previousValue) { + utils.setQueryData(["viewer.app_routing_forms.forms"], context.previousValue); + } showToast("Something went wrong", "error"); }, }); diff --git a/packages/app-store/ee/routing-forms/pages/forms/[...appPages].tsx b/packages/app-store/ee/routing-forms/pages/forms/[...appPages].tsx index 0d2604125e..eddb353867 100644 --- a/packages/app-store/ee/routing-forms/pages/forms/[...appPages].tsx +++ b/packages/app-store/ee/routing-forms/pages/forms/[...appPages].tsx @@ -1,6 +1,9 @@ // TODO: i18n +import { serverSideTranslations } from "next-i18next/serverSideTranslations"; + import useApp from "@calcom/lib/hooks/useApp"; import { useLocale } from "@calcom/lib/hooks/useLocale"; +import { trpc } from "@calcom/trpc/react"; import { AppGetServerSidePropsContext, AppPrisma, AppUser } from "@calcom/types/AppGetServerSideProps"; import { Icon } from "@calcom/ui/Icon"; import { ButtonGroup, DropdownMenuSeparator, Tooltip } from "@calcom/ui/v2"; @@ -15,10 +18,12 @@ import { FormAction, FormActionsDropdown, FormActionsProvider } from "../../comp import { getSerializableForm } from "../../lib/getSerializableForm"; export default function RoutingForms({ - forms, + forms: forms_, appUrl, }: inferSSRProps & { appUrl: string }) { const { t } = useLocale(); + const { data: forms } = trpc.useQuery(["viewer.app_routing_forms.forms"], { initialData: forms_ }); + const { data: typeformApp } = useApp("typeform"); function NewFormButton() { @@ -33,7 +38,7 @@ export default function RoutingForms({
- {!forms.length ? ( + {!forms?.length ? ( } /> ) : null} - {forms.length ? ( + {forms?.length ? (
{forms.map((form, index) => { @@ -201,6 +206,7 @@ export const getServerSideProps = async function getServerSideProps( return { props: { + ...(await serverSideTranslations(context.locale ?? "", ["common"])), forms: serializableForms, }, }; diff --git a/packages/app-store/ee/routing-forms/trpc-router.ts b/packages/app-store/ee/routing-forms/trpc-router.ts index 52c619e058..e62bef22ca 100644 --- a/packages/app-store/ee/routing-forms/trpc-router.ts +++ b/packages/app-store/ee/routing-forms/trpc-router.ts @@ -7,6 +7,7 @@ import { sendGenericWebhookPayload } from "@calcom/lib/webhooks/sendPayload"; import { TRPCError } from "@calcom/trpc/server"; import { createProtectedRouter, createRouter } from "@calcom/trpc/server/createRouter"; +import { getSerializableForm } from "./lib/getSerializableForm"; import { isAllowed } from "./lib/isAllowed"; import { zodFields, zodRoutes } from "./zod"; @@ -144,14 +145,24 @@ const app_RoutingForms = createRouter() createProtectedRouter() .query("forms", { async resolve({ ctx: { user, prisma } }) { - return await prisma.app_RoutingForms_Form.findMany({ + const forms = await prisma.app_RoutingForms_Form.findMany({ where: { userId: user.id, }, orderBy: { - createdAt: "asc", + createdAt: "desc", + }, + include: { + _count: { + select: { + responses: true, + }, + }, }, }); + + const serializableForms = forms.map((form) => getSerializableForm(form)); + return serializableForms; }, }) .query("formQuery", { diff --git a/packages/prisma/seed-app-store.config.json b/packages/prisma/seed-app-store.config.json index f24948a5f8..4600aae16f 100644 --- a/packages/prisma/seed-app-store.config.json +++ b/packages/prisma/seed-app-store.config.json @@ -55,7 +55,7 @@ "type": "raycast_other" }, { - "dirName": "n8n", + "dirName": "n8n", "categories": ["automation"], "slug": "n8n", "type": "n8n_automation"