Fix Page.authenticate not working for layout components (#3547)

Co-authored-by: Aleksandra <[email protected]>
blitz-js · Jul 18, 2022 · 1c80909 · 1c80909
1 parent 54a66a9
commit 1c80909
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 8 deletions.
diff --git a/.changeset/soft-adults-smell.md b/.changeset/soft-adults-smell.md
@@ -0,0 +1,5 @@
+---
+"@blitzjs/auth": patch
+---
+
+Fix `Page.authenticate` not working for layout components
diff --git a/apps/toolkit-app/app/core/layouts/Layout.tsx b/apps/toolkit-app/app/core/layouts/Layout.tsx
@@ -1,7 +1,11 @@
+import React from "react"
 import Head from "next/head"
-import React, { FC } from "react"
+import { BlitzLayout } from "@blitzjs/next"
 
-const Layout: FC<{ title?: string; children?: React.ReactNode }> = ({ title, children }) => {
+const Layout: BlitzLayout<{ title?: string; children?: React.ReactNode }> = ({
+  title,
+  children,
+}) => {
   return (
     <>
       <Head>

diff --git a/packages/blitz-auth/src/client/index.tsx b/packages/blitz-auth/src/client/index.tsx
@@ -216,8 +216,8 @@ export function getAuthValues<TProps = any>(
 ) {
   if (!Page) return {}
 
-  let authenticate = "authenticate" in Page && Page.authenticate
-  let redirectAuthenticatedTo = "redirectAuthenticatedTo" in Page && Page.redirectAuthenticatedTo
+  let authenticate = (Page as BlitzPage)?.authenticate
+  let redirectAuthenticatedTo = (Page as BlitzPage)?.redirectAuthenticatedTo
 
   if (authenticate === undefined && redirectAuthenticatedTo === undefined) {
     const layout = "getLayout" in Page && Page.getLayout?.(<Page {...props} />)

diff --git a/packages/blitz-next/src/index-browser.tsx b/packages/blitz-next/src/index-browser.tsx
@@ -6,7 +6,7 @@ import type {
   Simplify,
 } from "blitz"
 import Head from "next/head"
-import React from "react"
+import React, {ReactNode} from "react"
 import {QueryClient, QueryClientProvider} from "react-query"
 import {Hydrate, HydrateOptions} from "react-query/hydration"
 import {withSuperJSONPage} from "./superjson"
@@ -80,7 +80,7 @@ export type BlitzPage<P = {}> = React.ComponentType<P> & {
   suppressFirstRenderFlicker?: boolean
   redirectAuthenticatedTo?: RedirectAuthenticatedTo | RedirectAuthenticatedToFn
 }
-export type BlitzLayout<P = {}> = React.ComponentType<P> & {
+export type BlitzLayout<P = {}> = React.ComponentType<P & {children: ReactNode}> & {
   authenticate?: boolean | {redirectTo?: string | RouteUrlObject}
   redirectAuthenticatedTo?: RedirectAuthenticatedTo | RedirectAuthenticatedToFn
 }

diff --git a/packages/generator/templates/app/app/core/layouts/Layout.tsx b/packages/generator/templates/app/app/core/layouts/Layout.tsx
@@ -1,7 +1,8 @@
 import Head from "next/head"
-import React, { FC } from "react"
+import React, {FC} from "react"
+import {BlitzLayout} from "@blitzjs/next"
 
-const Layout: FC<{ title?: string; children?: React.ReactNode }> = ({ title, children }) => {
+const Layout: BlitzLayout<{title?: string; children?: React.ReactNode}> = ({title, children}) => {
   return (
     <>
       <Head>