jprdonnelly/blitz
1
0
Fork 0
mirror of synced 2025-12-19 18:11:23 -05:00
Code Issues Projects Releases Wiki Activity

Add Persistent layout to new app template with <Layout> and getLayout() (#897)

Browse Source 
Co-authored-by: Brandon Bayer <b@bayer.ws> (minor)
This commit is contained in:
Dwight Watson
2020-08-19 07:58:40 +10:00
committed by GitHub
parent 5f68bda686
commit 18beb6fb1d
10 changed files with 60 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
MEETING_NOTES.md
View File

@@ -1,21 +1,19 @@
# 2020-08-17 Blitz Contributor Call # 2020-08-17 Blitz Contributor Call
- Attending: Brandon Bayer, Adam Markon, Kellen Mace, Myron Davis, Dwight Watson - Attending: Brandon Bayer, Adam Markon, Kellen Mace, Myron Davis, Dwight Watson
- Brandon: - Brandon:
- Auth out, set up by default in canary release - Auth out, set up by default in canary release
- Need to work on a potential CSRF bug - Need to work on a potential CSRF bug
- Next major release will include auth by default and allow you to choose your form library - Next major release will include auth by default and allow you to choose your form library
- Next auth features are email confirmation - Next auth features are email confirmation
- After that, logging and plugins are next - After that, logging and plugins are next
- Adam: - Adam:
- Overhauled the recipe infrastructure. Now using jscodeshift instead of recast - Overhauled the recipe infrastructure. Now using jscodeshift instead of recast
- Added support for conditional JSX in templates - Added support for conditional JSX in templates
- Going to work on custom templates next - Going to work on custom templates next
- Dwight - Dwight
- Has been opening issues for problems - Has been opening issues for problems
- Made a few PRs for some issues - Made a few PRs for some issues
# 2020-07-07 Blitz Contributor Call # 2020-07-07 Blitz Contributor Call

1
README.md
View File

@@ -332,6 +332,7 @@ Thanks to these wonderful people ([emoji key](https://allcontributors.org/docs/e
<!-- markdownlint-enable --> <!-- markdownlint-enable -->
<!-- prettier-ignore-end --> <!-- prettier-ignore-end -->
<!-- ALL-CONTRIBUTORS-LIST:END --> <!-- ALL-CONTRIBUTORS-LIST:END -->
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

16
packages/core/src/index.ts
View File

@@ -1,3 +1,6 @@
import {NextPage, NextComponentType} from "next"
import {AppProps as NextAppProps} from "next/app"
export * from "./use-query" export * from "./use-query"
export * from "./use-paginated-query" export * from "./use-paginated-query"
export * from "./use-params" export * from "./use-params"
@@ -22,13 +25,10 @@ export {
GetServerSideProps, GetServerSideProps,
InferGetStaticPropsType, InferGetStaticPropsType,
InferGetServerSidePropsType, InferGetServerSidePropsType,
NextPage as BlitzPage,
NextApiRequest as BlitzApiRequest, NextApiRequest as BlitzApiRequest,
NextApiResponse as BlitzApiResponse, NextApiResponse as BlitzApiResponse,
} from "next" } from "next"
export {AppProps} from "next/app"
export {default as Head} from "next/head" export {default as Head} from "next/head"
export {default as Link} from "next/link" export {default as Link} from "next/link"
@@ -49,4 +49,14 @@ export {default as dynamic} from "next/dynamic"
export {default as ErrorComponent} from "next/error" export {default as ErrorComponent} from "next/error"
export type BlitzComponentType = NextComponentType
export interface AppProps extends NextAppProps {
Component: BlitzComponentType & {
getLayout?: (component: JSX.Element) => JSX.Element
}
}
export type BlitzPage<P = {}, IP = P> = NextPage<P, IP> & {
getLayout?: (component: JSX.Element) => JSX.Element
}
export {isLocalhost} from "./utils/index" export {isLocalhost} from "./utils/index"

14
packages/generator/templates/app/app/layouts/Layout.tsx Normal file
View File

@@ -0,0 +1,14 @@
import { Head } from "blitz"
const Layout = ({ title, children }) => (
<>
<Head>
<title>{title || "__name__"}</title>
<link rel="icon" href="/favicon.ico" />
</Head>
{children}
</>
)
export default Layout

4
packages/generator/templates/app/app/pages/_app.tsx
View File

@@ -4,6 +4,8 @@ import { queryCache } from "react-query"
import LoginForm from "app/auth/components/LoginForm" import LoginForm from "app/auth/components/LoginForm"
export default function App({ Component, pageProps }: AppProps) { export default function App({ Component, pageProps }: AppProps) {
const getLayout = Component.getLayout || ((page) => page)
return ( return (
<ErrorBoundary <ErrorBoundary
FallbackComponent={RootErrorFallback} FallbackComponent={RootErrorFallback}
@@ -13,7 +15,7 @@ export default function App({ Component, pageProps }: AppProps) {
queryCache.resetErrorBoundaries() queryCache.resetErrorBoundaries()
}} }}
> >
<Component {...pageProps} /> {getLayout(<Component {...pageProps} />)}
</ErrorBoundary> </ErrorBoundary>
) )
} }

14
packages/generator/templates/app/app/pages/index.tsx
View File

@@ -1,4 +1,5 @@
import { Head, Link, useSession } from "blitz" import Layout from "app/layouts/layout"
import { Link, useSession } from "blitz"
import logout from "app/auth/mutations/logout" import logout from "app/auth/mutations/logout"
/* /*
@@ -6,16 +7,11 @@ import logout from "app/auth/mutations/logout"
* You can delete everything in here and start from scratch if you like. * You can delete everything in here and start from scratch if you like.
*/ */
export default function Home() { const Home = () => {
const session = useSession() const session = useSession()
return ( return (
<div className="container"> <div className="container">
<Head>
<title>__name__</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<main> <main>
<div className="logo"> <div className="logo">
<img src="/logo.png" alt="blitz.js" /> <img src="/logo.png" alt="blitz.js" />
@@ -249,3 +245,7 @@ export default function Home() {
</div> </div>
) )
} }
Home.getLayout = (page) => <Layout title="Home">{page}</Layout>
export default Home

3
packages/generator/templates/page/__modelIdParam__.tsx
View File

@@ -1,4 +1,5 @@
import React, {Suspense} from "react" import React, {Suspense} from "react"
import Layout from "app/layouts/Layout"
import {Head, Link, useRouter, useQuery, useParam, BlitzPage} from "blitz" import {Head, Link, useRouter, useQuery, useParam, BlitzPage} from "blitz"
import get__ModelName__ from "app/__modelNamesPath__/queries/get__ModelName__" import get__ModelName__ from "app/__modelNamesPath__/queries/get__ModelName__"
import delete__ModelName__ from "app/__modelNamesPath__/mutations/delete__ModelName__" import delete__ModelName__ from "app/__modelNamesPath__/mutations/delete__ModelName__"
@@ -90,4 +91,6 @@ const Show__ModelName__Page: BlitzPage = () => {
) )
} }
Show__ModelName__Page.getLayout = (page) => <Layout title={"__ModelName__"}>{page}</Layout>
export default Show__ModelName__Page export default Show__ModelName__Page

3
packages/generator/templates/page/__modelIdParam__/edit.tsx
View File

@@ -1,4 +1,5 @@
import React, {Suspense} from "react" import React, {Suspense} from "react"
import Layout from "app/layouts/Layout"
import {Head, Link, useRouter, useQuery, useParam, BlitzPage} from "blitz" import {Head, Link, useRouter, useQuery, useParam, BlitzPage} from "blitz"
import get__ModelName__ from "app/__modelNamesPath__/queries/get__ModelName__" import get__ModelName__ from "app/__modelNamesPath__/queries/get__ModelName__"
import update__ModelName__ from "app/__modelNamesPath__/mutations/update__ModelName__" import update__ModelName__ from "app/__modelNamesPath__/mutations/update__ModelName__"
@@ -81,4 +82,6 @@ const Edit__ModelName__Page: BlitzPage = () => {
) )
} }
Edit__ModelName__Page.getLayout = (page) => <Layout title={"Edit __ModelName__"}>{page}</Layout>
export default Edit__ModelName__Page export default Edit__ModelName__Page

3
packages/generator/templates/page/index.tsx
View File

@@ -1,4 +1,5 @@
import React, {Suspense} from "react" import React, {Suspense} from "react"
import Layout from "app/layouts/Layout"
if (process.env.parentModel) { if (process.env.parentModel) {
import {Head, Link, useQuery, useParam, BlitzPage} from "blitz" import {Head, Link, useQuery, useParam, BlitzPage} from "blitz"
} else { } else {
@@ -86,4 +87,6 @@ const __ModelNames__Page: BlitzPage = () => {
) )
} }
__ModelNames__Page.getLayout = (page) => <Layout title={"__ModelNames__"}>{page}</Layout>
export default __ModelNames__Page export default __ModelNames__Page

3
packages/generator/templates/page/new.tsx
View File

@@ -1,4 +1,5 @@
import React from "react" import React from "react"
import Layout from "app/layouts/Layout"
if (process.env.parentModel) { if (process.env.parentModel) {
import {Head, Link, useRouter, useParam, BlitzPage} from "blitz" import {Head, Link, useRouter, useParam, BlitzPage} from "blitz"
} else { } else {
@@ -66,4 +67,6 @@ const New__ModelName__Page: BlitzPage = () => {
) )
} }
New__ModelName__Page.getLayout = (page) => <Layout title={"Create New __ModelName__"}>{page}</Layout>
export default New__ModelName__Page export default New__ModelName__Page