Update Examples for Fast Refresh (#13068)
This commit is contained in:
Joe Haddad
GitHub
parent
86160a5190
commit
dbad9db68c
254 changed files with 2338 additions and 1888 deletions
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"root": true,
|
||||
"parser": "babel-eslint",
|
||||
"plugins": ["react", "react-hooks", "jest"],
|
||||
"plugins": ["react", "react-hooks", "jest", "import"],
|
||||
"env": {
|
||||
"browser": true,
|
||||
"commonjs": true,
|
||||
|
|
@ -91,6 +91,26 @@
|
|||
"packages/create-next-app/templates/**/*"
|
||||
],
|
||||
"rules": { "react/react-in-jsx-scope": "off" }
|
||||
},
|
||||
{
|
||||
"files": ["examples/**/*"],
|
||||
"rules": {
|
||||
"import/no-anonymous-default-export": [
|
||||
"error",
|
||||
{
|
||||
// React components:
|
||||
"allowArrowFunction": false,
|
||||
"allowAnonymousClass": false,
|
||||
"allowAnonymousFunction": false,
|
||||
|
||||
// Non-React stuff:
|
||||
"allowArray": true,
|
||||
"allowCallExpression": true,
|
||||
"allowLiteral": true,
|
||||
"allowObject": true
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"rules": {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@ import Head from 'next/head'
|
|||
|
||||
export const config = { amp: true }
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>Example AMP Story in Next.js</title>
|
||||
|
|
@ -120,4 +121,5 @@ export default () => (
|
|||
/>
|
||||
</amp-story>
|
||||
</>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>About us</div>
|
||||
export default function About() {
|
||||
return <div>About us</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>This is the contact page.</div>
|
||||
export default function Contact() {
|
||||
return <div>This is the contact page.</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<div>
|
||||
This is a static page goto{' '}
|
||||
<Link href="/">
|
||||
|
|
@ -8,4 +9,5 @@ export default () => (
|
|||
</Link>{' '}
|
||||
page.
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<div>
|
||||
This is a static page goto{' '}
|
||||
<Link href="/">
|
||||
|
|
@ -8,4 +9,5 @@ export default () => (
|
|||
</Link>{' '}
|
||||
page.
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default (req, res) => {
|
||||
export default function userHandler(req, res) {
|
||||
const {
|
||||
query: { id, name },
|
||||
method,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
// Fake users data
|
||||
const users = [{ id: 1 }, { id: 2 }, { id: 3 }]
|
||||
|
||||
export default (req, res) => {
|
||||
export default function handler(req, res) {
|
||||
// Get data from your database
|
||||
res.status(200).json(users)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
import Link from 'next/link'
|
||||
|
||||
export default ({ person }) => (
|
||||
export default function Person({ person }) {
|
||||
return (
|
||||
<li>
|
||||
<Link href="/person/[id]" as={`/person/${person.id}`}>
|
||||
<a>{person.name}</a>
|
||||
</Link>
|
||||
</li>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { people } from '../../../data'
|
||||
|
||||
export default ({ query: { id } }, res) => {
|
||||
export default function personHandler({ query: { id } }, res) {
|
||||
const filtered = people.filter((p) => p.id === id)
|
||||
|
||||
// User with id exists
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { people } from '../../../data'
|
||||
|
||||
export default (req, res) => {
|
||||
export default function handler(req, res) {
|
||||
res.status(200).json(people)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="hello">
|
||||
<p>Hello World</p>
|
||||
<style jsx>{`
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>About us</div>
|
||||
export default function About() {
|
||||
return <div>About us</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>About 2</div>
|
||||
export default function About2() {
|
||||
return <div>About 2</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>Hello Day</div>
|
||||
export default function Day() {
|
||||
return <div>Hello Day</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
import Link from 'next/link'
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
Hello World.{' '}
|
||||
<Link href="/about">
|
||||
<a>About</a>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import { format } from 'date-fns'
|
||||
|
||||
export default ({ dateString }) => (
|
||||
export default function Date({ dateString }) {
|
||||
return (
|
||||
<time dateTime={dateString}>
|
||||
{format(new Date(dateString), 'LLLL d, yyyy')}
|
||||
</time>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default async (_, res) => {
|
||||
export default async function exit(_, res) {
|
||||
// Exit the current user from "Preview Mode". This function accepts no args.
|
||||
res.clearPreviewData()
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { getPreviewPostBySlug } from '../../lib/api'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function preview(req, res) {
|
||||
const { secret, slug } = req.query
|
||||
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default async (_, res) => {
|
||||
export default async function exit(_, res) {
|
||||
// Exit the current user from "Preview Mode". This function accepts no args.
|
||||
res.clearPreviewData()
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { getPreviewPostBySlug } from '../../lib/api'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function preview(req, res) {
|
||||
// Check the secret and next parameters
|
||||
// This secret should only be known to this API route and the CMS
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default async (_, res) => {
|
||||
export default async function exit(_, res) {
|
||||
// Exit the current user from "Preview Mode". This function accepts no args.
|
||||
res.clearPreviewData()
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ function linkResolver(doc) {
|
|||
return `/${doc.uid}`
|
||||
}
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function preview(req, res) {
|
||||
const ref = req.query.token
|
||||
|
||||
// Check the token parameter against the Prismic SDK
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default async (_, res) => {
|
||||
export default async function exit(_, res) {
|
||||
// Exit the current user from "Preview Mode". This function accepts no args.
|
||||
res.clearPreviewData()
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { getPreviewPostBySlug } from '../../lib/api'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function preview(req, res) {
|
||||
// Check the secret and next parameters
|
||||
// This secret should only be known to this API route and the CMS
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default async (_, res) => {
|
||||
export default async function exit(_, res) {
|
||||
// Exit the current user from "Preview Mode". This function accepts no args.
|
||||
res.clearPreviewData()
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { getPreviewPostBySlug } from '../../lib/api'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function preview(req, res) {
|
||||
// Check the secret and next parameters
|
||||
// This secret should only be known to this API route and the CMS
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1 +1,3 @@
|
|||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/a" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>a</div>
|
||||
export default function A() {
|
||||
return <div>a</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>b</div>
|
||||
export default function B() {
|
||||
return <div>b</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/b" as="/a">
|
||||
|
|
@ -14,4 +15,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import Link from 'next/link'
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<div>
|
||||
<div>About us</div>
|
||||
<div>
|
||||
|
|
@ -9,4 +10,5 @@ export default () => (
|
|||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
import Link from 'next/link'
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
Hello World.{' '}
|
||||
<Link href="/about" as={process.env.BACKEND_URL + '/about'}>
|
||||
<a>About</a>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import Head from 'next/head'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>This page has a title 🤔</title>
|
||||
|
|
@ -10,4 +11,5 @@ export default () => (
|
|||
|
||||
<h1>This page has a title 🤔</h1>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,11 @@
|
|||
import Link from 'next/link'
|
||||
import Head from 'next/head'
|
||||
|
||||
export default ({ children, title = 'This is the default title' }) => (
|
||||
export default function Layout({
|
||||
children,
|
||||
title = 'This is the default title',
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<Head>
|
||||
<title>{title}</title>
|
||||
|
|
@ -28,4 +32,5 @@ export default ({ children, title = 'This is the default title' }) => (
|
|||
|
||||
<footer>{'I`m here to stay'}</footer>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import Layout from '../components/layout'
|
||||
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<Layout title="About us">
|
||||
<div>About us</div>
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import Layout from '../components/layout'
|
||||
|
||||
export default () => (
|
||||
export default function Contact() {
|
||||
return (
|
||||
<Layout title="Contact us">
|
||||
<div>Contact</div>
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import Layout from '../components/layout'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<Layout>
|
||||
<div>Hello World.</div>
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
export default ({ children }) => (
|
||||
export default function Paragraph({ children }) {
|
||||
return (
|
||||
<p>
|
||||
{children}
|
||||
<style jsx>{`
|
||||
|
|
@ -8,4 +9,5 @@ export default ({ children }) => (
|
|||
}
|
||||
`}</style>
|
||||
</p>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
export default ({ title, children }) => (
|
||||
export default function Post({ title, children }) {
|
||||
return (
|
||||
<div className="main">
|
||||
<h1>{title}</h1>
|
||||
{children}
|
||||
|
|
@ -16,4 +17,5 @@ export default ({ title, children }) => (
|
|||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import P from '../components/paragraph'
|
||||
import Post from '../components/post'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="main">
|
||||
<Post title="My first blog post">
|
||||
<P>Hello there</P>
|
||||
|
|
@ -42,4 +43,5 @@ export default () => (
|
|||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => (
|
||||
export default function Loading() {
|
||||
return (
|
||||
<div>
|
||||
<h3>Loading...</h3>
|
||||
<style jsx>{`
|
||||
|
|
@ -12,4 +13,5 @@ export default () => (
|
|||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react'
|
||||
|
||||
export default function (props) {
|
||||
export default function Post(props) {
|
||||
return (
|
||||
<div>
|
||||
<h1>My {props.id} blog post</h1>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/blog?id=first" as="/blog/first">
|
||||
|
|
@ -18,4 +19,5 @@ export default () => (
|
|||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react'
|
||||
import Cat from '../svgs/cat.svg'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="container">
|
||||
<marquee>SVG Cat!</marquee>
|
||||
<Cat />
|
||||
|
|
@ -12,4 +13,5 @@ export default () => (
|
|||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import React from 'react'
|
||||
|
||||
export default () => <div>About us</div>
|
||||
export default function About() {
|
||||
return <div>About us</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
import React from 'react'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
Hello World.{' '}
|
||||
<Link href="/about">
|
||||
<a>About</a>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
import { useRouter } from 'next/router'
|
||||
|
||||
export default () => (
|
||||
export default function Header() {
|
||||
return (
|
||||
<div>
|
||||
<Link href="/">Home</Link>
|
||||
<Link href="/about">About</Link>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
const Link = ({ children, href }) => {
|
||||
const router = useRouter()
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
import Header from '../components/header'
|
||||
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<div>
|
||||
<Header />
|
||||
<p>This is the about page.</p>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
import Header from '../components/header'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
<Header />
|
||||
<p>HOME PAGE is here!</p>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
export default () => (
|
||||
export default function Header() {
|
||||
return (
|
||||
<header>
|
||||
<h1>Hello world!</h1>
|
||||
</header>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
import Header from 'components/header.js'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div>
|
||||
<Header />
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ HitComponent.propTypes = {
|
|||
hit: PropTypes.object,
|
||||
}
|
||||
|
||||
export default class extends React.Component {
|
||||
export default class App extends React.Component {
|
||||
static propTypes = {
|
||||
searchState: PropTypes.object,
|
||||
resultsState: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ const updateAfter = 700
|
|||
const searchStateToUrl = (searchState) =>
|
||||
searchState ? `${window.location.pathname}?${qs.stringify(searchState)}` : ''
|
||||
|
||||
export default class extends React.Component {
|
||||
export default class Home extends React.Component {
|
||||
static propTypes = {
|
||||
resultsState: PropTypes.object,
|
||||
searchState: PropTypes.object,
|
||||
|
|
|
|||
|
|
@ -11,7 +11,8 @@ import {
|
|||
const FormItem = Form.Item
|
||||
const Option = Select.Option
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div style={{ marginTop: 100 }}>
|
||||
<Form layout="horizontal">
|
||||
<FormItem
|
||||
|
|
@ -30,15 +31,27 @@ export default () => (
|
|||
<a href="#">Link</a>
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Switch" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Switch"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Switch defaultChecked name="switch" />
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Slider" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Slider"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Slider defaultValue={70} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Select" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Select"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Select
|
||||
size="large"
|
||||
defaultValue="lucy"
|
||||
|
|
@ -71,4 +84,5 @@ export default () => (
|
|||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,10 +2,12 @@ import Layout from '../components/Layout'
|
|||
import { Button } from 'antd-mobile'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function About() {
|
||||
return (
|
||||
<Layout title="About">
|
||||
<Link href="/">
|
||||
<Button>Go to Index</Button>
|
||||
</Link>
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,10 +2,12 @@ import Layout from '../components/Layout'
|
|||
import { Button } from 'antd-mobile'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<Layout title="Index">
|
||||
<Link href="/about">
|
||||
<Button>Go to About</Button>
|
||||
</Link>
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,8 @@ const menuItemRender = (options: MenuDataItem, element: React.ReactNode) => (
|
|||
</Link>
|
||||
)
|
||||
|
||||
export default ({ children }) => (
|
||||
export default function Main({ children }) {
|
||||
return (
|
||||
<ProLayout
|
||||
style={{ minHeight: '100vh' }}
|
||||
route={ROUTES}
|
||||
|
|
@ -65,4 +66,5 @@ export default ({ children }) => (
|
|||
>
|
||||
{children}
|
||||
</ProLayout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import MainLayout from '../layouts/main'
|
||||
|
||||
export default () => <MainLayout>Example page</MainLayout>
|
||||
export default function Example() {
|
||||
return <MainLayout>Example page</MainLayout>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,8 @@ import MainLayout from '../layouts/main'
|
|||
const FormItem = Form.Item
|
||||
const Option = Select.Option
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<MainLayout>
|
||||
<Form layout="horizontal">
|
||||
<FormItem
|
||||
|
|
@ -32,15 +33,27 @@ export default () => (
|
|||
<a href="#">Link</a>
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Switch" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Switch"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Switch defaultChecked />
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Slider" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Slider"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Slider defaultValue={70} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem label="Select" labelCol={{ span: 8 }} wrapperCol={{ span: 8 }}>
|
||||
<FormItem
|
||||
label="Select"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 8 }}
|
||||
>
|
||||
<Select size="large" defaultValue="lucy" style={{ width: 192 }}>
|
||||
<Option value="jack">jack</Option>
|
||||
<Option value="lucy">lucy</Option>
|
||||
|
|
@ -68,4 +81,5 @@ export default () => (
|
|||
</FormItem>
|
||||
</Form>
|
||||
</MainLayout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
import MainLayout from '../layouts/main'
|
||||
|
||||
export default () => <MainLayout>Welcome!</MainLayout>
|
||||
export default function Welcome() {
|
||||
return <MainLayout>Welcome!</MainLayout>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,8 @@ const content = {
|
|||
marginTop: '100px',
|
||||
}
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div style={content}>
|
||||
<div className="text-center mb-5">
|
||||
<Link href="#">
|
||||
|
|
@ -86,7 +87,10 @@ export default () => (
|
|||
>
|
||||
<DatePicker name="startDate" />
|
||||
</FormItem>
|
||||
<FormItem style={{ marginTop: 48 }} wrapperCol={{ span: 8, offset: 8 }}>
|
||||
<FormItem
|
||||
style={{ marginTop: 48 }}
|
||||
wrapperCol={{ span: 8, offset: 8 }}
|
||||
>
|
||||
<Button size="large" type="primary" htmlType="submit">
|
||||
OK
|
||||
</Button>
|
||||
|
|
@ -97,4 +101,5 @@ export default () => (
|
|||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,11 +8,13 @@ if (typeof window !== 'undefined') {
|
|||
StyleSheet.rehydrate(window.__NEXT_DATA__.ids)
|
||||
}
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className={css(styles.root)}>
|
||||
<h1 className={css(styles.title)}>My page</h1>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
root: {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
export default ({ children }) => (
|
||||
export default function App({ children }) {
|
||||
return (
|
||||
<main>
|
||||
{children}
|
||||
<style jsx global>{`
|
||||
|
|
@ -42,4 +43,5 @@ export default ({ children }) => (
|
|||
}
|
||||
`}</style>
|
||||
</main>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
export default ({ message }) => (
|
||||
export default function ErrorMessage({ message }) {
|
||||
return (
|
||||
<aside>
|
||||
{message}
|
||||
<style jsx>{`
|
||||
|
|
@ -10,4 +11,5 @@ export default ({ message }) => (
|
|||
}
|
||||
`}</style>
|
||||
</aside>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,8 +2,10 @@ import React from 'react'
|
|||
|
||||
const Layout = ({ children }) => <div className="layout">{children}</div>
|
||||
|
||||
export default ({ Component, pageProps }) => (
|
||||
export default function App({ Component, pageProps }) {
|
||||
return (
|
||||
<Layout>
|
||||
<Component {...pageProps} />
|
||||
</Layout>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
export default () => {
|
||||
export default function Home() {
|
||||
return <div>test</div>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react'
|
||||
import Button, { ButtonGroup } from '@atlaskit/button'
|
||||
|
||||
export default () => {
|
||||
export default function ButtonComponent() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Button style={{ margin: 10 }}>Button</Button>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react'
|
||||
import { Checkbox } from '@atlaskit/checkbox'
|
||||
|
||||
export default () => {
|
||||
export default function CheckboxComponent() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Checkbox
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import {
|
|||
} from '@atlaskit/datetime-picker'
|
||||
import { Label } from '@atlaskit/field-base'
|
||||
|
||||
export default () => {
|
||||
export default function DateTimePickerComponent() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Label label="TimePicker - timeFormat (h:mm a)" />
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import DropdownMenu, {
|
|||
} from '@atlaskit/dropdown-menu'
|
||||
import { Label } from '@atlaskit/field-base'
|
||||
|
||||
export default () => {
|
||||
export default function DropdownMenuComponent() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Label label="DropdownMenu" />
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import CheckboxComponent from '../components/CheckboxComponent'
|
|||
import DateTimePickerComponent from '../components/DateTimePickerComponent'
|
||||
import DropdownMenuComponent from '../components/DropdownMenuComponent'
|
||||
|
||||
export default () => {
|
||||
export default function Home() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<ButtonComponent />
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default (props) => {
|
||||
export default function Clock(props) {
|
||||
return (
|
||||
<div className={props.light ? 'light' : ''}>
|
||||
{format(new Date(props.lastUpdate))}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
const SECOND = 1000
|
||||
let timer = null
|
||||
|
||||
export default (context) => {
|
||||
export default function provider(context) {
|
||||
context.clock = {
|
||||
start(signalPath) {
|
||||
const signal = context.controller.getSignal(signalPath)
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { query as q } from 'faunadb'
|
||||
import { serverClient, serializeFaunaCookie } from '../../utils/fauna-auth'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function login(req, res) {
|
||||
const { email, password } = await req.body
|
||||
|
||||
try {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import { query as q } from 'faunadb'
|
|||
import cookie from 'cookie'
|
||||
import { faunaClient, FAUNA_SECRET_COOKIE } from '../../utils/fauna-auth'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function logout(req, res) {
|
||||
const cookies = cookie.parse(req.headers.cookie ?? '')
|
||||
const faunaSecret = cookies[FAUNA_SECRET_COOKIE]
|
||||
if (!faunaSecret) {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ export const profileApi = async (faunaSecret) => {
|
|||
return ref.id
|
||||
}
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function profile(req, res) {
|
||||
const cookies = cookie.parse(req.headers.cookie ?? '')
|
||||
const faunaSecret = cookies[FAUNA_SECRET_COOKIE]
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { query as q } from 'faunadb'
|
||||
import { serverClient, serializeFaunaCookie } from '../../utils/fauna-auth'
|
||||
|
||||
export default async (req, res) => {
|
||||
export default async function signuo(req, res) {
|
||||
const { email, password } = await req.body
|
||||
|
||||
try {
|
||||
|
|
|
|||
|
|
@ -9,11 +9,13 @@ if (typeof window !== 'undefined') {
|
|||
cxs.rehydrate(serverCss)
|
||||
}
|
||||
|
||||
export default () => (
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className={cx.root}>
|
||||
<h1 className={cx.title}>My page</h1>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
const cx = {
|
||||
root: cxs({
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export default () => {
|
||||
export default function Home() {
|
||||
return (
|
||||
<>
|
||||
<h1>Hello World!</h1>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue