Skip to content

Commit 9e11b3d

Browse files
committed
appdir
1 parent 848923b commit 9e11b3d

File tree

199 files changed

+2273
-6547
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

199 files changed

+2273
-6547
lines changed

.npmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
legacy-peer-deps=true

README.md

-25
This file was deleted.
+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function AnotherPage(props) {
2+
return (
3+
<>
4+
<p>hello from newroot/dashboard/another</p>
5+
</>
6+
)
7+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { experimental_use as use } from 'react'
2+
3+
function getData({ params }) {
4+
return {
5+
now: Date.now(),
6+
params,
7+
}
8+
}
9+
10+
export default function Page(props) {
11+
const data = use(getData(props))
12+
13+
return (
14+
<>
15+
<p>/dashboard/project/[projectId]</p>
16+
<p id="props">{JSON.stringify(data)}</p>
17+
</>
18+
)
19+
}

app/(newroot)/layout.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { experimental_use as use } from 'react'
2+
3+
async function getData() {
4+
return {
5+
world: 'world',
6+
}
7+
}
8+
9+
export default function Root({ children }) {
10+
const { world } = use(getData())
11+
12+
return (
13+
<html className="this-is-another-document-html">
14+
<head>
15+
<title>{`hello ${world}`}</title>
16+
</head>
17+
<body className="this-is-another-document-body">{children}</body>
18+
</html>
19+
)
20+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function ChangelogPage(props) {
2+
return (
3+
<>
4+
<p>hello from app/dashboard/changelog</p>
5+
</>
6+
)
7+
}
+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function HelloPage(props) {
2+
return (
3+
<>
4+
<p>hello from app/dashboard/rootonly/hello</p>
5+
</>
6+
)
7+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
// components under catch-all should not throw errors
2+
export default () => <p id="widget">widget</p>

app/catch-all/[...slug]/page.js

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import Widget from './components/widget'
2+
3+
export default function Page({ params }) {
4+
return (
5+
<>
6+
<h1 id="text" data-params={params.slug.join('/') ?? ''}>
7+
hello from /catch-all/{params.slug.join('/')}
8+
</h1>
9+
<Widget />
10+
</>
11+
)
12+
}

app/client-component-route/page.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
'client'
2+
3+
import { useState, useEffect } from 'react'
4+
5+
import style from './style.module.css'
6+
import './style.css'
7+
8+
export default function ClientComponentRoute() {
9+
const [count, setCount] = useState(0)
10+
useEffect(() => {
11+
setCount(1)
12+
}, [count])
13+
return (
14+
<>
15+
<p className={style.red}>
16+
hello from app/client-component-route. <b>count: {count}</b>
17+
</p>
18+
</>
19+
)
20+
}

app/client-component-route/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
b {
2+
color: blue;
3+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.red {
2+
color: red;
3+
}

app/client-nested/layout.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
'client'
2+
3+
import { useState, useEffect } from 'react'
4+
5+
import styles from './style.module.css'
6+
import './style.css'
7+
8+
export default function ClientNestedLayout({ children }) {
9+
const [count, setCount] = useState(0)
10+
useEffect(() => {
11+
setCount(1)
12+
}, [])
13+
return (
14+
<>
15+
<h1 className={styles.red}>Client Nested. Count: {count}</h1>
16+
<button onClick={() => setCount(count + 1)}>{count}</button>
17+
{children}
18+
</>
19+
)
20+
}

app/client-nested/page.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function ClientPage() {
2+
return (
3+
<>
4+
<p>hello from app/client-nested</p>
5+
</>
6+
)
7+
}

app/client-nested/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
button {
2+
color: red;
3+
}

app/client-nested/style.module.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.red {
2+
color: red;
3+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
'client'
2+
3+
// export function getServerSideProps() { { props: {} } }
4+
5+
export default function Page() {
6+
return 'client-gssp'
7+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
'client'
2+
3+
// export function getStaticProps() { return { props: {} }}
4+
5+
export default function Page() {
6+
return 'client-gsp'
7+
}

app/css/css-client/client-foo.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.foo {
2+
color: blue;
3+
}

app/css/css-client/client-layout.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
body {
2+
background: cyan;
3+
}

app/css/css-client/client-page.css

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
h1 {
2+
color: red !important;
3+
}
4+
h1::after {
5+
content: ' (from css-client!!!!)';
6+
}

app/css/css-client/foo.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import './client-foo.css'
2+
3+
export default function Foo() {
4+
return <b className="foo">foo</b>
5+
}

app/css/css-client/layout.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
'client'
2+
3+
import './client-layout.css'
4+
5+
import Foo from './foo'
6+
7+
export default function ServerLayout({ children }) {
8+
return (
9+
<>
10+
{children}
11+
<Foo />
12+
</>
13+
)
14+
}

app/css/css-client/page.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
'client'
2+
3+
import './client-page.css'
4+
5+
export default function Page() {
6+
return <h1>Page!!!</h1>
7+
}

app/css/css-nested/layout.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
'client'
2+
3+
import './style.css'
4+
import styles from './style.module.css'
5+
6+
export default function ClientLayout({ children }) {
7+
return (
8+
<>
9+
<div className={styles['client-css']}>Client Layout: CSS Modules</div>
10+
<div className="client-css">Client Layout: Global CSS</div>
11+
{children}
12+
</>
13+
)
14+
}

app/css/css-nested/page.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
'client'
2+
3+
export default function Page() {
4+
return null
5+
}

app/css/css-nested/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.client-css {
2+
color: green;
3+
}

app/css/css-nested/style.module.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.client-css {
2+
color: green;
3+
}

app/css/css-page/layout.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import './style2.css'
2+
3+
export default function ServerLayout({ children }) {
4+
return <>{children}</>
5+
}

app/css/css-page/page.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import './style.css'
2+
import styles from './style.module.css'
3+
4+
export default function Page() {
5+
return (
6+
<>
7+
<h1>Page</h1>
8+
<div id="cssm" className={styles.mod}>
9+
CSSM
10+
</div>
11+
</>
12+
)
13+
}

app/css/css-page/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
h1 {
2+
color: red;
3+
}

app/css/css-page/style.module.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.mod {
2+
color: blue;
3+
}

app/css/css-page/style2.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
body {
2+
background: #ccc;
3+
}

app/css/foo.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import './style.module.css'

app/css/layout.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import './style.css'
2+
import './css-page/style.css'
3+
import styles from './style.module.css'
4+
5+
export default function ServerLayout({ children }) {
6+
return (
7+
<>
8+
<div id="server-cssm" className={styles['server-css'] || 'undefined'}>
9+
Server Layout: CSS Modules
10+
</div>
11+
<div className="server-css">Server Layout: Global CSS</div>
12+
{children}
13+
</>
14+
)
15+
}

app/css/style.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.server-css {
2+
color: blue;
3+
}

app/css/style.module.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.server-css {
2+
color: green;
3+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function DeploymentsBreakdownPage(props) {
2+
return (
3+
<>
4+
<p>hello from app/dashboard/(custom)/deployments/breakdown</p>
5+
</>
6+
)
7+
}

app/dashboard/(custom)/layout.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export default function CustomDashboardRootLayout({ children }) {
2+
return (
3+
<>
4+
<h2>Custom dashboard</h2>
5+
{children}
6+
</>
7+
)
8+
}

app/dashboard/client-comp-client.jsx

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
'client'
2+
3+
import styles from './client-comp.module.css'
4+
5+
import { useEffect, useState } from 'react'
6+
7+
export default function ClientComp() {
8+
const [state, setState] = useState({})
9+
useEffect(() => {
10+
setState({ test: 'HELLOOOO' })
11+
}, [])
12+
return (
13+
<>
14+
<p className={styles.client}>Hello</p>
15+
{state.test}
16+
</>
17+
)
18+
}

app/dashboard/client-comp.module.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.client {
2+
color: #2e5aea;
3+
}
+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { experimental_use as use } from 'react'
2+
3+
async function getData({ params }) {
4+
return {
5+
id: params.id,
6+
}
7+
}
8+
9+
export default function DeploymentsPage(props) {
10+
const data = use(getData(props))
11+
12+
return (
13+
<>
14+
<p>hello from app/dashboard/deployments/[id]. ID is: {data.id}</p>
15+
</>
16+
)
17+
}
+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function DeploymentsInfoPage(props) {
2+
return (
3+
<>
4+
<p>hello from app/dashboard/deployments/info</p>
5+
</>
6+
)
7+
}

0 commit comments

Comments
 (0)