Skip to content

Commit a653270

Browse files
heisoheiso
committed
🚧 Tryinng urql
1 parent 7d7923b commit a653270

File tree

17 files changed

+610
-605
lines changed

17 files changed

+610
-605
lines changed

‎api/src/__tests__/account.spec.ts‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,14 @@ import { getArgs } from '../core/__tests__/graphql'
99
import { prisma } from '../core/__tests__/prisma'
1010

1111
gql`
12+
fragment Account on Account {
13+
id
14+
email
15+
}
16+
1217
query Account {
1318
account {
14-
id
15-
email
19+
...Account
1620
}
1721
}
1822
@@ -21,7 +25,9 @@ gql`
2125
}
2226
2327
mutation login($email: String!, $password: String!) {
24-
login(email: $email, password: $password)
28+
login(email: $email, password: $password) {
29+
...Account
30+
}
2531
}
2632
2733
mutation logout {

‎api/src/account.schema.ts‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export const typeDefs = gql`
2020
2121
extend type Mutation {
2222
signup(email: String!, password: String!): Boolean! @isPublic
23-
login(email: String!, password: String!): Boolean! @isPublic
23+
login(email: String!, password: String!): Account @isPublic
2424
logout: Boolean!
2525
}
2626
`
@@ -70,10 +70,7 @@ export const resolvers: Resolvers = {
7070
throw new Error(ErrorCode.BAD_USER_INPUT)
7171
}
7272

73-
const user = await prisma.user.findFirst({
74-
where: { email },
75-
select: { hashedPassword: true, id: true },
76-
})
73+
const user = await prisma.user.findFirst({ where: { email } })
7774

7875
if (!user || !user.hashedPassword) {
7976
fakePasswordTest()
@@ -84,7 +81,7 @@ export const resolvers: Resolvers = {
8481
}
8582

8683
await auth.login(user)
87-
return true
84+
return user
8885
}
8986
},
9087

‎api/src/app.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const app = new Koa<DefaultState, Context>()
1818
export const graphqlOptions = {
1919
definitions: [root, todo, account],
2020
transformers: [authenticationSchemaTransformer],
21-
isSafelistEnabled: true,
21+
isSafelistEnabled: false,
2222
safelists: [safelist],
2323
}
2424

‎api/src/core/graphql.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ async function processSafelist(ctx: Context, { safelists = [], lazyLoadSafelist
6565
const safelist = ctx.request.body?.extensions?.safelist
6666

6767
if (!safelist || !safelist.hash || !safelist.version) {
68+
ctx.status = 403
6869
throw new Error(ErrorCode.FORBIDDEN)
6970
}
7071

@@ -79,6 +80,7 @@ async function processSafelist(ctx: Context, { safelists = [], lazyLoadSafelist
7980

8081
const query = safelistsByVersion[version]?.[hash]
8182
if (!query) {
83+
ctx.status = 403
8284
throw new Error(ErrorCode.FORBIDDEN)
8385
}
8486

‎api/src/core/telemetry.ts‎

Lines changed: 17 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -166,11 +166,13 @@ export class Telemetry {
166166

167167
export function telemetryMiddleware(options: Options): Middleware<DefaultState, Context> {
168168
return async function telemetryMiddleware(ctx, next) {
169-
ctx.onerror = (err) => {
170-
if (err) {
171-
log.error(err)
172-
}
173-
}
169+
// const initialOnError = ctx.onerror
170+
// ctx.onerror = (err) => {
171+
// ctx.onerror
172+
// if (err) {
173+
// log.error(err)
174+
// }
175+
// }
174176

175177
const start = Date.now()
176178
const telemetry = new Telemetry()
@@ -193,13 +195,17 @@ export function telemetryMiddleware(options: Options): Middleware<DefaultState,
193195
ctx.body = { service: options.serviceName, status: 'running', version: options.version }
194196
}
195197

196-
await next().finally(() => {
197-
const duration = Date.now() - start
198+
await next()
199+
.catch((err) => {
200+
log.error(err)
201+
})
202+
.finally(() => {
203+
const duration = Date.now() - start
198204

199-
telemetry.setMeta('status', ctx.response.status)
200-
telemetry.setMeta('duration', duration)
205+
telemetry.setMeta('status', ctx.response.status)
206+
telemetry.setMeta('duration', duration)
201207

202-
log.info(`${ctx.path}${operationName ? ` ${operationName}` : ''} -> ${duration}ms`)
203-
})
208+
log.info(`${ctx.path}${operationName ? ` ${operationName}` : ''} -> ${duration}ms`)
209+
})
204210
}
205211
}

‎app/codegen.yml‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,19 @@ generates:
99
plugins:
1010
- typescript
1111
- typescript-operations
12-
- typescript-react-apollo
13-
- named-operations-object
14-
- typescript-apollo-client-helpers
12+
- typescript-urql
13+
- typescript-urql-graphcache
1514
config:
1615
identifierName: ListAllOperations
1716
scalars:
1817
Date: 'string'
19-
reactApolloVersion: 3
2018
exportFragmentSpreadSubTypes: true
2119
namingConvention:
2220
enumValues: keep
2321

24-
src/generated/fragments.json:
22+
src/generated/schema.json:
2523
plugins:
26-
- fragment-matcher
24+
- urql-introspection
2725

2826
src/generated/safelist.json:
2927
plugins:

‎app/package.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,17 @@
1212
},
1313
"dependencies": {
1414
"@apollo/client": "^3.5.6",
15+
"@graphql-codegen/typescript-urql-graphcache": "^2.2.3",
16+
"@graphql-codegen/urql-introspection": "^2.1.1",
1517
"@types/node": "^17.0.4",
1618
"@types/react": "^17.0.38",
1719
"@types/react-dom": "^17.0.11",
20+
"@urql/exchange-graphcache": "^4.3.6",
1821
"graphql": "^16.2.0",
1922
"react": "^17.0.2",
2023
"react-dom": "^17.0.2",
2124
"typescript": "^4.5.4",
25+
"urql": "^2.0.6",
2226
"web-vitals": "^2.1.2"
2327
},
2428
"devDependencies": {
@@ -29,7 +33,9 @@
2933
"@graphql-codegen/typescript-apollo-client-helpers": "^2.1.8",
3034
"@graphql-codegen/typescript-operations": "^2.2.1",
3135
"@graphql-codegen/typescript-react-apollo": "^3.2.2",
36+
"@graphql-codegen/typescript-urql": "^3.4.2",
3237
"@graphql-example/graphql-codegen-operations-safelist": "file:../packages/graphql-codegen-operations-safelist",
38+
"@urql/devtools": "^2.0.3",
3339
"graphql": "^16.1.0",
3440
"react-scripts": "5.0.0"
3541
},

‎app/src/App.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React from 'react'
22
import { Auth } from './components/Auth'
33
import { TodoInput } from './components/TodoInput'
44
import { TodoList } from './components/TodoList'
5-
import { ToggleMock } from './components/ToggleMock'
65

76
function App() {
87
return (
@@ -17,7 +16,7 @@ function App() {
1716
</div>
1817
</Auth>
1918
</main>
20-
<ToggleMock />
19+
{/* <ToggleMock /> */}
2120
</div>
2221
)
2322
}

‎app/src/components/Auth.tsx‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,17 @@
1-
import { gql } from '@apollo/client'
21
import React from 'react'
2+
import { gql } from 'urql'
33
import { useAccountQuery } from '../generated/graphql'
44
import { Login } from './Login'
55

66
gql`
7+
fragment AccountForAuth on Account {
8+
id
9+
email
10+
}
11+
712
query Account {
813
account {
9-
id
10-
email
14+
...AccountForAuth
1115
}
1216
}
1317
`
@@ -17,9 +21,9 @@ type AuthProps = {
1721
}
1822

1923
export function Auth({ children }: AuthProps) {
20-
const { data, loading, called } = useAccountQuery()
24+
const [{ data, fetching }] = useAccountQuery()
2125

22-
if (loading || !called) {
26+
if (fetching) {
2327
return null
2428
} else if (data?.account) {
2529
return children

‎app/src/components/Login.tsx‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,31 @@
1-
import { gql } from '@apollo/client'
21
import React, { useState } from 'react'
2+
import { gql } from 'urql'
33
import { useLoginMutation } from '../generated/graphql'
44

55
gql`
66
mutation Login($email: String!, $password: String!) {
7-
login(email: $email, password: $password)
7+
login(email: $email, password: $password) {
8+
...AccountForAuth
9+
}
810
}
911
`
1012

1113
export function Login() {
1214
const [email, setEmail] = useState('')
1315
const [password, setPassword] = useState('')
14-
const [login, loginMutation] = useLoginMutation()
16+
const [loginResult, login] = useLoginMutation()
1517

1618
return (
1719
<form
1820
onSubmit={async (event) => {
1921
event.preventDefault()
20-
if (!loginMutation.loading) {
21-
const { data } = await login({ variables: { email, password } })
22+
if (!loginResult.fetching) {
23+
const { data } = await login({ email, password })
2224
if (data?.login) {
23-
await loginMutation.client.resetStore()
25+
/**
26+
* @todo reset local store
27+
*/
28+
// await loginResult.
2429
}
2530
}
2631
}}

0 commit comments

Comments
 (0)