diff --git a/apps/web/src/app/app/(dashboard)/[workspaceSlug]/status-pages/edit/page.tsx b/apps/web/src/app/app/(dashboard)/[workspaceSlug]/status-pages/edit/page.tsx index 975835bd8c..bb44a9967b 100644 --- a/apps/web/src/app/app/(dashboard)/[workspaceSlug]/status-pages/edit/page.tsx +++ b/apps/web/src/app/app/(dashboard)/[workspaceSlug]/status-pages/edit/page.tsx @@ -82,8 +82,10 @@ export default async function EditPage({ {page && isProPlan ? ( monitor.id, + ), }} // to be improved /> ) : ( diff --git a/apps/web/src/app/status-page/[domain]/layout.tsx b/apps/web/src/app/status-page/[domain]/layout.tsx index f88b1a0177..104c158030 100644 --- a/apps/web/src/app/status-page/[domain]/layout.tsx +++ b/apps/web/src/app/status-page/[domain]/layout.tsx @@ -1,11 +1,21 @@ +import { notFound } from "next/navigation"; + import { Shell } from "@/components/dashboard/shell"; +import { api } from "@/trpc/server"; import NavigationLink from "./_components/navigation-link"; -export default function StatusPageLayout({ - children, -}: { +type Props = { + params: { domain: string }; children: React.ReactNode; -}) { +}; + +export default async function StatusPageLayout({ params, children }: Props) { + if (!params.domain) return notFound(); + const page = await api.page.getPageBySlug.query({ slug: params.domain }); + if (!page) { + return notFound(); + } + return (
@@ -19,19 +29,21 @@ export default function StatusPageLayout({ {children} - + {!page.removeBranding && ( + + )}
); } diff --git a/apps/web/src/components/forms/custom-domain-form.tsx b/apps/web/src/components/forms/custom-domain-form.tsx index 23c2506a02..f9f0d02409 100644 --- a/apps/web/src/components/forms/custom-domain-form.tsx +++ b/apps/web/src/components/forms/custom-domain-form.tsx @@ -9,6 +9,7 @@ import type * as z from "zod"; import { insertPageSchemaWithMonitors } from "@openstatus/db/src/schema"; import { Button } from "@/components/ui/button"; +import { Checkbox } from "@/components/ui/checkbox"; import { Form, FormControl, @@ -26,17 +27,23 @@ import DomainStatusIcon from "../domains/domain-status-icon"; import { LoadingAnimation } from "../loading-animation"; import { InputWithAddons } from "../ui/input-with-addons"; -const customDomain = insertPageSchemaWithMonitors.pick({ - customDomain: true, - id: true, -}); - -type Schema = z.infer; +type Schema = z.infer; export function CustomDomainForm({ defaultValues }: { defaultValues: Schema }) { const form = useForm({ - resolver: zodResolver(customDomain), - defaultValues, + resolver: zodResolver(insertPageSchemaWithMonitors), + defaultValues: { + id: defaultValues?.id || 0, + workspaceId: defaultValues?.workspaceId || 0, + title: defaultValues?.title || "", + description: defaultValues?.description || "", + icon: defaultValues?.icon || "", + slug: defaultValues?.slug || "", + customDomain: defaultValues?.customDomain || "", + removeBranding: defaultValues?.removeBranding || false, + monitors: defaultValues?.monitors ?? [], + workspaceSlug: "", + }, }); const router = useRouter(); const [isPending, startTransition] = useTransition(); @@ -45,8 +52,14 @@ export function CustomDomainForm({ defaultValues }: { defaultValues: Schema }) { const { status } = domainStatus || {}; async function onSubmit(data: Schema) { + const shouldUpdateBranding = + Boolean(defaultValues?.removeBranding) !== data.removeBranding; + startTransition(async () => { try { + if (shouldUpdateBranding) { + await api.page.updatePage.mutate(data); + } if (defaultValues.id) { await api.page.addCustomDomain.mutate({ customDomain: data.customDomain, @@ -114,6 +127,24 @@ export function CustomDomainForm({ defaultValues }: { defaultValues: Schema }) { )} /> + ( + + + field.onChange(Boolean(value))} + /> + + +
+ Remove branding +
+
+ )} + />