Unpublished product's page redirects to notFound

Author: rajat1saxena

apps/web/app/(with-contexts)/(with-layout)/p/[id]/page.tsx

@@ -4,6 +4,7 @@ import ClientSidePage from "./client-side-page";
 import { headers } from "next/headers";
 import type { Metadata, ResolvingMetadata } from "next";
 import { Media } from "@courselit/common-models";
+import { notFound } from "next/navigation";
 
 type Props = {
     params: {
@@ -26,7 +27,13 @@ export async function generateMetadata(
         };
     }
 
-    const title = page.title || page.pageData?.title || page.name;
+    if (!page) {
+        return {
+            title: "Page not found",
+        };
+    }
+
+    const title = page?.title || page.pageData?.title || page.name;
     const socialImage: Media | undefined =
         page.socialImage ||
         (page.pageData?.featuredImage as Media) ||
@@ -76,6 +83,10 @@ export default async function Page({ params }: Props) {
         return null;
     }
 
+    if (!page) {
+        return notFound();
+    }
+
     return (
         <ClientSidePage
             page={page}

apps/web/app/(with-contexts)/dashboard/(sidebar)/product/[id]/page.tsx

@@ -193,10 +193,14 @@ export default function DashboardPage() {
                             </DropdownMenuTrigger>
                             <DropdownMenuContent align="end">
                                 <DropdownMenuItem asChild>
-                                    <Link href={`/p/${product?.pageId}`}>
+                                    <a
+                                        href={`/p/${encodeURIComponent(product?.pageId!)}`}
+                                        target="_blank"
+                                        rel="noopener noreferrer"
+                                    >
                                         <Eye className="mr-2 h-4 w-4" />
                                         {VIEW_PAGE_MENU_ITEM}
-                                    </Link>
+                                    </a>
                                 </DropdownMenuItem>
                                 <DropdownMenuSeparator />
                                 <DropdownMenuItem asChild>

apps/web/ui-lib/utils.ts

@@ -86,7 +86,7 @@ type FrontEndPage = Pick<
 export const getPage = async (
     backend: string,
     id?: string,
-): Promise<FrontEndPage> => {
+): Promise<FrontEndPage | null> => {
     const query = id
         ? `
     query {
@@ -133,7 +133,7 @@ export const getPage = async (
     } catch (e: any) {
         console.log("getPage", e.message); // eslint-disable-line no-console
     }
-    return undefined as unknown as Page;
+    return null;
 };
 
 export const getSiteInfo = async (