refactor: add graphcache codegen and update types

This commit is contained in:
Andrew Bastin
2021-10-15 18:00:18 +05:30
parent 02d5f0fdf3
commit 39de34f083
7 changed files with 107 additions and 39 deletions

View File

@@ -9,6 +9,7 @@ generates:
- typescript
- typescript-operations
- typed-document-node
- typescript-urql-graphcache
helpers/backend/backend-schema.json:
plugins:

View File

@@ -102,13 +102,13 @@ const client = createClient({
*/
export type GQLError<T extends string> =
| {
type: "network_error"
error: Error
}
type: "network_error"
error: Error
}
| {
type: "gql_error"
error: T
}
type: "gql_error"
error: T
}
const DEFAULT_QUERY_OPTIONS = {
noPolling: false,
@@ -124,10 +124,10 @@ type UseQueryLoading = {
type UseQueryLoaded<
QueryFailType extends string = "",
QueryReturnType = any
> = {
loading: false
data: E.Either<GQLError<QueryFailType>, QueryReturnType>
}
> = {
loading: false
data: E.Either<GQLError<QueryFailType>, QueryReturnType>
}
type UseQueryReturn<QueryFailType extends string = "", QueryReturnType = any> =
| UseQueryLoading
@@ -218,9 +218,9 @@ export function useGQLQuery<
data: data!,
}) as
| {
loading: false
data: DataType
}
loading: false
data: DataType
}
| { loading: true }
}
@@ -259,7 +259,7 @@ export const runMutation = <
type: "gql_error",
error: gqlErr,
},
// The right case (it was a GraphQL Error)
// The right case (it was a network error)
(networkErr) =>
<GQLError<DocErrors>>{
type: "network_error",

View File

@@ -1,6 +1,6 @@
import { OptimisticMutationConfig } from "@urql/exchange-graphcache"
import { GraphCacheOptimisticUpdaters } from "../graphql"
export const optimisticDefs: OptimisticMutationConfig = {
export const optimisticDefs: GraphCacheOptimisticUpdaters = {
deleteTeam: () => true,
leaveTeam: () => true,
renameTeam: ({ teamID, newName }) => ({
@@ -9,5 +9,4 @@ export const optimisticDefs: OptimisticMutationConfig = {
name: newName,
}),
removeTeamMember: () => true,
// TODO: updateTeamMemberRole
}

View File

@@ -1,14 +1,14 @@
import { ResolverConfig } from "@urql/exchange-graphcache"
import { GraphCacheResolvers } from "../graphql"
export const resolversDef: ResolverConfig = {
export const resolversDef: GraphCacheResolvers = {
Query: {
team: (_parent, { teamID }, _cache, _info) => ({
__typename: "Team",
id: teamID as any,
id: teamID,
}),
user: (_parent, { uid }, _cache, _info) => ({
__typename: "User",
uid: uid as any,
uid: uid,
}),
},
}

View File

@@ -1,17 +1,18 @@
import { UpdatesConfig } from "@urql/exchange-graphcache"
import { MyTeamsDocument } from "../graphql"
import { GraphCacheUpdaters, MyTeamsDocument } from "../graphql"
export const updatesDef: Partial<UpdatesConfig> = {
export const updatesDef: GraphCacheUpdaters = {
Mutation: {
deleteTeam: (_r, { teamID }, cache, _info) => {
cache.updateQuery(
{
query: MyTeamsDocument,
},
(data: any) => {
data.myTeams = (data as any).myTeams.filter(
(x: any) => x.id !== teamID
)
(data) => {
if (data) {
data.myTeams = data.myTeams.filter(
(x) => x.id !== teamID
)
}
return data
}
@@ -19,7 +20,7 @@ export const updatesDef: Partial<UpdatesConfig> = {
cache.invalidate({
__typename: "Team",
id: teamID as any,
id: teamID
})
},
leaveTeam: (_r, { teamID }, cache, _info) => {
@@ -27,10 +28,12 @@ export const updatesDef: Partial<UpdatesConfig> = {
{
query: MyTeamsDocument,
},
(data: any) => {
data.myTeams = (data as any).myTeams.filter(
(x: any) => x.id !== teamID
)
(data) => {
if (data) {
data.myTeams = data.myTeams.filter(
(x) => x.id !== teamID
)
}
return data
}
@@ -38,7 +41,7 @@ export const updatesDef: Partial<UpdatesConfig> = {
cache.invalidate({
__typename: "Team",
id: teamID as any,
id: teamID
})
},
createTeam: (result, _args, cache, _info) => {
@@ -46,8 +49,8 @@ export const updatesDef: Partial<UpdatesConfig> = {
{
query: MyTeamsDocument,
},
(data: any) => {
data.myTeams.push(result.createTeam)
(data) => {
if (data) data.myTeams.push(result.createTeam as any)
return data
}
)
@@ -57,7 +60,7 @@ export const updatesDef: Partial<UpdatesConfig> = {
cache.resolve(
{
__typename: "Team",
id: teamID as string,
id: teamID,
},
"members"
) as string[]
@@ -68,7 +71,7 @@ export const updatesDef: Partial<UpdatesConfig> = {
.map(([key]) => key)
cache.link(
{ __typename: "Team", id: teamID as string },
{ __typename: "Team", id: teamID },
"members",
newMembers
)

View File

@@ -80,7 +80,7 @@
"yargs-parser": "^20.2.9"
},
"devDependencies": {
"@babel/core": "^7.15.8",
"@babel/core": "^7.15.8",
"@babel/preset-env": "^7.15.8",
"@commitlint/cli": "^13.2.1",
"@commitlint/config-conventional": "^13.2.0",
@@ -89,6 +89,7 @@
"@graphql-codegen/typed-document-node": "^2.1.4",
"@graphql-codegen/typescript": "2.2.2",
"@graphql-codegen/typescript-operations": "^2.1.6",
"@graphql-codegen/typescript-urql-graphcache": "^2.1.6",
"@graphql-codegen/urql-introspection": "^2.1.0",
"@graphql-typed-document-node/core": "^3.1.0",
"@nuxt/types": "^2.15.8",