diff --git a/packages/hoppscotch-app/gql-codegen.yml b/packages/hoppscotch-app/gql-codegen.yml index 238c50e00..85995baef 100644 --- a/packages/hoppscotch-app/gql-codegen.yml +++ b/packages/hoppscotch-app/gql-codegen.yml @@ -9,6 +9,7 @@ generates: - typescript - typescript-operations - typed-document-node + - typescript-urql-graphcache helpers/backend/backend-schema.json: plugins: diff --git a/packages/hoppscotch-app/helpers/backend/GQLClient.ts b/packages/hoppscotch-app/helpers/backend/GQLClient.ts index 1f4eb1a9e..e45645ded 100644 --- a/packages/hoppscotch-app/helpers/backend/GQLClient.ts +++ b/packages/hoppscotch-app/helpers/backend/GQLClient.ts @@ -102,13 +102,13 @@ const client = createClient({ */ export type GQLError = | { - 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, QueryReturnType> -} + > = { + loading: false + data: E.Either, QueryReturnType> + } type UseQueryReturn = | 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) => >{ type: "network_error", diff --git a/packages/hoppscotch-app/helpers/backend/caching/optimistic.ts b/packages/hoppscotch-app/helpers/backend/caching/optimistic.ts index 4f06fb063..a9704ebba 100644 --- a/packages/hoppscotch-app/helpers/backend/caching/optimistic.ts +++ b/packages/hoppscotch-app/helpers/backend/caching/optimistic.ts @@ -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 } diff --git a/packages/hoppscotch-app/helpers/backend/caching/resolvers.ts b/packages/hoppscotch-app/helpers/backend/caching/resolvers.ts index 5927fdd52..144de9447 100644 --- a/packages/hoppscotch-app/helpers/backend/caching/resolvers.ts +++ b/packages/hoppscotch-app/helpers/backend/caching/resolvers.ts @@ -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, }), }, } diff --git a/packages/hoppscotch-app/helpers/backend/caching/updates.ts b/packages/hoppscotch-app/helpers/backend/caching/updates.ts index aecb3926d..8170c31ee 100644 --- a/packages/hoppscotch-app/helpers/backend/caching/updates.ts +++ b/packages/hoppscotch-app/helpers/backend/caching/updates.ts @@ -1,17 +1,18 @@ -import { UpdatesConfig } from "@urql/exchange-graphcache" -import { MyTeamsDocument } from "../graphql" +import { GraphCacheUpdaters, MyTeamsDocument } from "../graphql" -export const updatesDef: Partial = { +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 = { cache.invalidate({ __typename: "Team", - id: teamID as any, + id: teamID }) }, leaveTeam: (_r, { teamID }, cache, _info) => { @@ -27,10 +28,12 @@ export const updatesDef: Partial = { { 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 = { cache.invalidate({ __typename: "Team", - id: teamID as any, + id: teamID }) }, createTeam: (result, _args, cache, _info) => { @@ -46,8 +49,8 @@ export const updatesDef: Partial = { { 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 = { cache.resolve( { __typename: "Team", - id: teamID as string, + id: teamID, }, "members" ) as string[] @@ -68,7 +71,7 @@ export const updatesDef: Partial = { .map(([key]) => key) cache.link( - { __typename: "Team", id: teamID as string }, + { __typename: "Team", id: teamID }, "members", newMembers ) diff --git a/packages/hoppscotch-app/package.json b/packages/hoppscotch-app/package.json index 2fd5425c8..f9928cc70 100644 --- a/packages/hoppscotch-app/package.json +++ b/packages/hoppscotch-app/package.json @@ -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", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8614cf072..3e0903020 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -27,6 +27,7 @@ importers: '@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 '@hoppscotch/js-sandbox': workspace:^1.0.0 @@ -177,6 +178,7 @@ importers: '@graphql-codegen/typed-document-node': 2.1.4_graphql@15.6.1 '@graphql-codegen/typescript': 2.2.2_graphql@15.6.1 '@graphql-codegen/typescript-operations': 2.1.6_graphql@15.6.1 + '@graphql-codegen/typescript-urql-graphcache': 2.1.6_40426d2202828b1968a1d5d1a08b3434 '@graphql-codegen/urql-introspection': 2.1.0_graphql@15.6.1 '@graphql-typed-document-node/core': 3.1.0_graphql@15.6.1 '@nuxt/types': 2.15.8_sass@1.42.1 @@ -2406,6 +2408,20 @@ packages: tslib: 2.3.1 dev: true + /@graphql-codegen/plugin-helpers/2.2.0_graphql@15.6.1: + resolution: {integrity: sha512-7t3LFd6DHUWPh0f7qY7wde2r4KCsU8WDcTxQ0QuHuokTqZYnRk+UH3xNDUiyb+1LGTBUqIaKxLwQXh8EDyZK7A==} + peerDependencies: + graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 + dependencies: + '@graphql-tools/utils': 8.3.0_graphql@15.6.1 + change-case-all: 1.0.14 + common-tags: 1.8.0 + graphql: 15.6.1 + import-from: 4.0.0 + lodash: 4.17.21 + tslib: 2.3.1 + dev: true + /@graphql-codegen/typed-document-node/2.1.4_graphql@15.6.1: resolution: {integrity: sha512-TP8jbppssZLBL7HgV/AQg2yVL6FP5qNjWpo+S45n0FNutFQvtSUrCe5Ji6+xFUHDoRBbeWIXeQPJPjURjlIbfA==} peerDependencies: @@ -2436,6 +2452,25 @@ packages: - supports-color dev: true + /@graphql-codegen/typescript-urql-graphcache/2.1.6_40426d2202828b1968a1d5d1a08b3434: + resolution: {integrity: sha512-PlLIOnEWg2ItMztfBkJpvFs9HJzk0yYvc1AwzrVnff82eLLjFZsnxRUTMHSICCU9oFGdvAElHqxyO4fSdvaurg==} + peerDependencies: + '@urql/exchange-graphcache': ^4.1.1 + graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 + graphql-tag: ^2.0.0 + dependencies: + '@graphql-codegen/plugin-helpers': 2.2.0_graphql@15.6.1 + '@graphql-codegen/visitor-plugin-common': 2.4.0_graphql@15.6.1 + '@urql/exchange-graphcache': 4.3.5_graphql@15.6.1 + auto-bind: 4.0.0 + change-case-all: 1.0.14 + graphql: 15.6.1 + graphql-tag: 2.12.5_graphql@15.6.1 + tslib: 2.3.1 + transitivePeerDependencies: + - supports-color + dev: true + /@graphql-codegen/typescript/2.2.2_graphql@15.6.1: resolution: {integrity: sha512-prcB4nNi2iQzZRLla6N6kEPmnE2WU1zz5+sEBcZcqphjWERqQ3zwdSKsuLorE/XxMp500p6BQ96cVo+bFkmVtA==} peerDependencies: @@ -2481,6 +2516,26 @@ packages: - supports-color dev: true + /@graphql-codegen/visitor-plugin-common/2.4.0_graphql@15.6.1: + resolution: {integrity: sha512-wcUqpbvhLlOwsriyI+ZTuE0Fx7AIIbcL80+KjgNGrMjLZJLTyMJGpYwc87I876EPIcyC35+LO15nwy2cR2tbxQ==} + peerDependencies: + graphql: ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 + dependencies: + '@graphql-codegen/plugin-helpers': 2.2.0_graphql@15.6.1 + '@graphql-tools/optimize': 1.1.0_graphql@15.6.1 + '@graphql-tools/relay-operation-optimizer': 6.4.0_graphql@15.6.1 + '@graphql-tools/utils': 8.3.0_graphql@15.6.1 + auto-bind: 4.0.0 + change-case-all: 1.0.14 + dependency-graph: 0.11.0 + graphql: 15.6.1 + graphql-tag: 2.12.5_graphql@15.6.1 + parse-filepath: 1.0.2 + tslib: 2.3.1 + transitivePeerDependencies: + - supports-color + dev: true + /@graphql-tools/apollo-engine-loader/7.1.0_graphql@15.6.1: resolution: {integrity: sha512-JKK34xQiB1l2sBfi8G5c1HZZkleQbwOlLAkySycKTrU+VMzu5lEjhzYwowIbLLjTthjUHQkRFANHkxvB42t5SQ==} peerDependencies: @@ -3066,6 +3121,15 @@ packages: graphql: 15.6.1 tslib: 2.3.1 + /@graphql-tools/utils/8.3.0_graphql@15.6.1: + resolution: {integrity: sha512-ksE0RxS0AFllo6KIJjvQsRgcUAzoyZUgUrDbCngv4SaQwyX9YxTfddTLN4uQmbiZB9h25fPp/Xgeyaa3ARCzgg==} + peerDependencies: + graphql: ^14.0.0 || ^15.0.0 || ^16.0.0 + dependencies: + graphql: 15.6.1 + tslib: 2.3.1 + dev: true + /@graphql-tools/wrap/6.2.4_graphql@15.6.1: resolution: {integrity: sha512-cyQgpybolF9DjL2QNOvTS1WDCT/epgYoiA8/8b3nwv5xmMBQ6/6nYnZwityCZ7njb7MMyk7HBEDNNlP9qNJDcA==} peerDependencies: