Skip to content

Commit 902e392

Browse files
RoshanjosseyRoshanjossey
committed
update nextjs to 13, relay to main and switch to app directory structure
1 parent 7f3bf30 commit 902e392

24 files changed

+841
-681
lines changed

‎.babelrc

Lines changed: 0 additions & 4 deletions
This file was deleted.

‎app/Home.tsx

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
'use client'
2+
3+
import { Suspense } from 'react'
4+
import { SerializablePreloadedQuery } from '../src/relay/loadSerializableQuery'
5+
import MainViewQueryNode, {
6+
HomeQuery,
7+
} from '../__generated__/HomeQuery.graphql'
8+
import { getCurrentEnvironment } from '../src/relay/environment'
9+
import {
10+
RelayEnvironmentProvider,
11+
graphql,
12+
PreloadedQuery,
13+
usePreloadedQuery,
14+
Environment,
15+
} from 'react-relay'
16+
import useSerializablePreloadedQuery from '../src/relay/useSerializablePreloadedQuery'
17+
import Card from '../src/components/Card'
18+
import Layout from '../src/components/Layout'
19+
import Login from '../src/components/Login'
20+
import Feed from '../src/components/feed/Feed'
21+
import UserDetails from '../src/components/UserDetails/UserDetails'
22+
23+
const HomePage = (props: {
24+
preloadedQuery: SerializablePreloadedQuery<
25+
typeof MainViewQueryNode,
26+
HomeQuery
27+
>
28+
cookies: string
29+
}) => {
30+
const environment = getCurrentEnvironment(props.cookies)
31+
const queryRef = useSerializablePreloadedQuery(
32+
environment,
33+
props.preloadedQuery
34+
)
35+
36+
return (
37+
<RelayEnvironmentProvider environment={environment as Environment}>
38+
<Suspense fallback="Loading...">
39+
<MainView queryRef={queryRef} />
40+
</Suspense>
41+
</RelayEnvironmentProvider>
42+
)
43+
}
44+
45+
const RootQuery = graphql`
46+
query HomeQuery {
47+
viewer {
48+
handle
49+
...UserDetails_user
50+
...RelevantIssues
51+
...IssuesFromLastRepo
52+
...IssuesFromRecentRepos
53+
}
54+
...FeedsQuery
55+
}
56+
`
57+
58+
function MainView(props: { queryRef: PreloadedQuery<HomeQuery> }) {
59+
const data = usePreloadedQuery(RootQuery, props.queryRef)
60+
61+
let leftSidebar = <Login />
62+
if (data.viewer) {
63+
leftSidebar = (
64+
<Card>
65+
<UserDetails user={data.viewer} />
66+
</Card>
67+
)
68+
}
69+
70+
return (
71+
<Layout sidebarContentLeft={leftSidebar}>
72+
<>
73+
<Feed root={data} />
74+
</>
75+
</Layout>
76+
)
77+
}
78+
79+
export default HomePage

‎app/head.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default function Head() {
2+
return (
3+
<>
4+
<title></title>
5+
<meta content="width=device-width, initial-scale=1" name="viewport" />
6+
<link rel="icon" href="/favicon.ico" />
7+
</>
8+
)
9+
}

‎app/layout.tsx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
export default function RootLayout({
2+
children,
3+
}: {
4+
children: React.ReactNode
5+
}) {
6+
return (
7+
<html>
8+
<head />
9+
<body>{children}</body>
10+
</html>
11+
)
12+
}

‎app/page.tsx

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import { headers } from 'next/headers'
2+
import loadSerializableQuery from 'src/relay/loadSerializableQuery'
3+
import MainViewQueryNode, {
4+
HomeQuery,
5+
} from '../__generated__/HomeQuery.graphql'
6+
import HomePage from './Home'
7+
8+
const Page = async () => {
9+
// console.log('cookies', cookies())
10+
// const requestCookie = cookies().getAll()
11+
const requestCookie = headers().get('cookie')
12+
console.log('request cookie', headers().get('cookie'))
13+
const preloadedQuery = await loadSerializableQuery<
14+
typeof MainViewQueryNode,
15+
HomeQuery
16+
>(MainViewQueryNode.params, {}, requestCookie ?? '')
17+
18+
return (
19+
<div>
20+
<HomePage preloadedQuery={preloadedQuery} cookies={requestCookie ?? ''} />
21+
</div>
22+
)
23+
}
24+
25+
export default Page
26+
27+
export const revalidate = 0

‎next.config.js

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,16 @@ const nextConfig = {
77
// }
88

99
// return config;
10-
// },
10+
// }, reactStrictMode: true,
11+
swcMinify: true,
12+
compiler: {
13+
relay: {
14+
src: './',
15+
language: 'typescript',
16+
artifactDirectory: '__generated__',
17+
},
18+
},
19+
experimental: { appDir: true },
1120
async rewrites() {
1221
return [
1322
{

‎package.json

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -31,20 +31,18 @@
3131
"install": "^0.13.0",
3232
"md5": "^2.3.0",
3333
"multiparty": "^4.2.3",
34-
"next": "^12.1.6",
34+
"next": "^13.1.1",
3535
"node-fetch": "^3.2.10",
3636
"react": "^18.2.0",
3737
"react-dom": "^18.2.0",
3838
"react-error-boundary": "^3.1.4",
39-
"react-relay": "^13.0.2",
39+
"react-relay": "^0.0.0-main-83ae9735",
4040
"react-virtuoso": "^2.18.0",
41-
"relay-nextjs": "^0.6.0",
42-
"relay-runtime": "^13.0.2",
41+
"relay-runtime": "^0.0.0-main-83ae9735",
4342
"simple-oauth2": "^4.3.0",
4443
"string-strip-html": "^9.1.12"
4544
},
4645
"devDependencies": {
47-
"@babel/core": "^7.18.6",
4846
"@storybook/addon-actions": "^6.5.9",
4947
"@storybook/addon-essentials": "^6.5.9",
5048
"@storybook/addon-interactions": "^6.5.9",
@@ -60,16 +58,14 @@
6058
"@types/multiparty": "^0.0.33",
6159
"@types/node": "17.0.15",
6260
"@types/react": "17.0.39",
63-
"@types/react-relay": "^13.0.1",
64-
"@types/relay-runtime": "^13.0.1",
61+
"@types/react-relay": "^14.1.2",
62+
"@types/relay-runtime": "14.1.4",
6563
"@types/simple-oauth2": "^4.1.1",
6664
"@typescript-eslint/eslint-plugin": "^5.28.0",
6765
"@typescript-eslint/parser": "^5.28.0",
6866
"autoprefixer": "^10.4.2",
69-
"babel-loader": "^8.2.5",
70-
"babel-plugin-relay": "^13.0.2",
7167
"eslint": "^8.18.0",
72-
"eslint-config-next": "12.0.10",
68+
"eslint-config-next": "^13.1.1",
7369
"eslint-config-prettier": "^8.5.0",
7470
"eslint-import-resolver-typescript": "^2.7.1",
7571
"eslint-plugin-prettier": "^4.0.0",
@@ -80,9 +76,7 @@
8076
"lint-staged": "^13.0.2",
8177
"postcss": "^8.4.6",
8278
"prettier": "^2.7.1",
83-
"relay-compiler": "^13.0.2",
84-
"relay-compiler-language-typescript": "^15.0.1",
85-
"relay-config": "^12.0.1",
79+
"relay-compiler": "^0.0.0-main-83ae9735",
8680
"relay-test-utils": "^14.0.0",
8781
"storybook-css-modules-preset": "^1.1.1",
8882
"tailwind-scrollbar": "^2.0.1",

‎relay.config.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎relay.config.json

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"root": ".",
3+
"sources": {
4+
"src": "my_app",
5+
"app": "my_app"
6+
},
7+
"projects": {
8+
"my_app": {
9+
"language": "typescript",
10+
"schema": "schema.graphql",
11+
"output": "__generated__",
12+
"useImportTypeSyntax": true,
13+
"featureFlags": {
14+
"relay_resolver_model_syntax_enabled": true,
15+
"use_named_imports_for_relay_resolvers": true,
16+
"enable_relay_resolver_transform": true,
17+
"relay_resolver_enable_terse_syntax": true
18+
},
19+
"eagerEsModules": true
20+
}
21+
}
22+
}

‎schema/schema.graphql renamed to ‎schema.graphql

File renamed without changes.

0 commit comments

Comments
 (0)