Skip to content

Commit d00e58e

Browse files
dthyressonTobbe
dthyresson
and
Tobbe
committed
feat(scaffold/cell): Adds TypedDocument Support to Cell and Scaffold Generators (redwoodjs#9693)
Co-authored-by: Tobbe Lundberg <tobbe@tlundberg.com>
1 parent f6638e4 commit d00e58e

File tree

30 files changed

+495
-161
lines changed

30 files changed

+495
-161
lines changed

‎__fixtures__/test-project/web/src/components/AuthorCell/AuthorCell.tsx

+9-2
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
import type { FindAuthorQuery, FindAuthorQueryVariables } from 'types/graphql'
22

3-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
3+
import type {
4+
CellSuccessProps,
5+
CellFailureProps,
6+
TypedDocumentNode,
7+
} from '@redwoodjs/web'
48

59
import Author from 'src/components/Author'
610

7-
export const QUERY = gql`
11+
export const QUERY: TypedDocumentNode<
12+
FindAuthorQuery,
13+
FindAuthorQueryVariables
14+
> = gql`
815
query FindAuthorQuery($id: Int!) {
916
author: user(id: $id) {
1017
email

‎__fixtures__/test-project/web/src/components/BlogPostCell/BlogPostCell.tsx

+9-2
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,18 @@ import type {
33
FindBlogPostQueryVariables,
44
} from 'types/graphql'
55

6-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
6+
import type {
7+
CellSuccessProps,
8+
CellFailureProps,
9+
TypedDocumentNode,
10+
} from '@redwoodjs/web'
711

812
import BlogPost from 'src/components/BlogPost'
913

10-
export const QUERY = gql`
14+
export const QUERY: TypedDocumentNode<
15+
FindBlogPostQuery,
16+
FindBlogPostQueryVariables
17+
> = gql`
1118
query FindBlogPostQuery($id: Int!) {
1219
blogPost: post(id: $id) {
1320
id

‎__fixtures__/test-project/web/src/components/BlogPostsCell/BlogPostsCell.tsx

+10-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
1-
import type { BlogPostsQuery } from 'types/graphql'
1+
import type { BlogPostsQuery, BlogPostsQueryVariables } from 'types/graphql'
22

3-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
3+
import type {
4+
CellSuccessProps,
5+
CellFailureProps,
6+
TypedDocumentNode,
7+
} from '@redwoodjs/web'
48

59
import BlogPost from 'src/components/BlogPost'
610

7-
export const QUERY = gql`
11+
export const QUERY: TypedDocumentNode<
12+
BlogPostsQuery,
13+
BlogPostsQueryVariables
14+
> = gql`
815
query BlogPostsQuery {
916
blogPosts: posts {
1017
id

‎__fixtures__/test-project/web/src/components/Contact/Contact/Contact.tsx

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
11
import type {
2+
DeleteContactMutation,
23
DeleteContactMutationVariables,
34
FindContactById,
45
} from 'types/graphql'
56

67
import { Link, routes, navigate } from '@redwoodjs/router'
78
import { useMutation } from '@redwoodjs/web'
9+
import type { TypedDocumentNode } from '@redwoodjs/web'
810
import { toast } from '@redwoodjs/web/toast'
911

1012
import { timeTag } from 'src/lib/formatters'
1113

12-
const DELETE_CONTACT_MUTATION = gql`
14+
const DELETE_CONTACT_MUTATION: TypedDocumentNode<
15+
DeleteContactMutation,
16+
DeleteContactMutationVariables
17+
> = gql`
1318
mutation DeleteContactMutation($id: Int!) {
1419
deleteContact(id: $id) {
1520
id

‎__fixtures__/test-project/web/src/components/Contact/ContactCell/ContactCell.tsx

+16-5
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
1-
import type { FindContactById } from 'types/graphql'
1+
import type { FindContactById, FindContactByIdVariables } from 'types/graphql'
22

3-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
3+
import type {
4+
CellSuccessProps,
5+
CellFailureProps,
6+
TypedDocumentNode,
7+
} from '@redwoodjs/web'
48

59
import Contact from 'src/components/Contact/Contact'
610

7-
export const QUERY = gql`
11+
export const QUERY: TypedDocumentNode<
12+
FindContactById,
13+
FindContactByIdVariables
14+
> = gql`
815
query FindContactById($id: Int!) {
916
contact: contact(id: $id) {
1017
id
@@ -20,10 +27,14 @@ export const Loading = () => <div>Loading...</div>
2027

2128
export const Empty = () => <div>Contact not found</div>
2229

23-
export const Failure = ({ error }: CellFailureProps) => (
30+
export const Failure = ({
31+
error,
32+
}: CellFailureProps<FindContactByIdVariables>) => (
2433
<div className="rw-cell-error">{error?.message}</div>
2534
)
2635

27-
export const Success = ({ contact }: CellSuccessProps<FindContactById>) => {
36+
export const Success = ({
37+
contact,
38+
}: CellSuccessProps<FindContactById, FindContactByIdVariables>) => {
2839
return <Contact contact={contact} />
2940
}

‎__fixtures__/test-project/web/src/components/Contact/ContactForm/ContactForm.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { EditContactById, UpdateContactInput } from 'types/graphql'
22

3+
import type { RWGqlError } from '@redwoodjs/forms'
34
import {
45
Form,
56
FormError,
@@ -8,7 +9,6 @@ import {
89
TextField,
910
Submit,
1011
} from '@redwoodjs/forms'
11-
import type { RWGqlError } from '@redwoodjs/forms'
1212

1313
type FormContact = NonNullable<EditContactById['contact']>
1414

‎__fixtures__/test-project/web/src/components/Contact/Contacts/Contacts.tsx

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,21 @@
11
import type {
2+
DeleteContactMutation,
23
DeleteContactMutationVariables,
34
FindContacts,
45
} from 'types/graphql'
56

67
import { Link, routes } from '@redwoodjs/router'
78
import { useMutation } from '@redwoodjs/web'
9+
import type { TypedDocumentNode } from '@redwoodjs/web'
810
import { toast } from '@redwoodjs/web/toast'
911

1012
import { QUERY } from 'src/components/Contact/ContactsCell'
1113
import { timeTag, truncate } from 'src/lib/formatters'
1214

13-
const DELETE_CONTACT_MUTATION = gql`
15+
const DELETE_CONTACT_MUTATION: TypedDocumentNode<
16+
DeleteContactMutation,
17+
DeleteContactMutationVariables
18+
> = gql`
1419
mutation DeleteContactMutation($id: Int!) {
1520
deleteContact(id: $id) {
1621
id

‎__fixtures__/test-project/web/src/components/Contact/ContactsCell/ContactsCell.tsx

+14-5
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,18 @@
1-
import type { FindContacts } from 'types/graphql'
1+
import type { FindContacts, FindContactsVariables } from 'types/graphql'
22

33
import { Link, routes } from '@redwoodjs/router'
4-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
4+
import type {
5+
CellSuccessProps,
6+
CellFailureProps,
7+
TypedDocumentNode,
8+
} from '@redwoodjs/web'
59

610
import Contacts from 'src/components/Contact/Contacts'
711

8-
export const QUERY = gql`
12+
export const QUERY: TypedDocumentNode<
13+
FindContacts,
14+
FindContactsVariables
15+
> = gql`
916
query FindContacts {
1017
contacts {
1118
id
@@ -30,10 +37,12 @@ export const Empty = () => {
3037
)
3138
}
3239

33-
export const Failure = ({ error }: CellFailureProps) => (
40+
export const Failure = ({ error }: CellFailureProps<FindContacts>) => (
3441
<div className="rw-cell-error">{error?.message}</div>
3542
)
3643

37-
export const Success = ({ contacts }: CellSuccessProps<FindContacts>) => {
44+
export const Success = ({
45+
contacts,
46+
}: CellSuccessProps<FindContacts, FindContactsVariables>) => {
3847
return <Contacts contacts={contacts} />
3948
}

‎__fixtures__/test-project/web/src/components/Contact/EditContactCell/EditContactCell.tsx

+16-4
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,21 @@
1-
import type { EditContactById, UpdateContactInput } from 'types/graphql'
1+
import type {
2+
EditContactById,
3+
UpdateContactInput,
4+
UpdateContactMutationVariables,
5+
} from 'types/graphql'
26

37
import { navigate, routes } from '@redwoodjs/router'
4-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
8+
import type {
9+
CellSuccessProps,
10+
CellFailureProps,
11+
TypedDocumentNode,
12+
} from '@redwoodjs/web'
513
import { useMutation } from '@redwoodjs/web'
614
import { toast } from '@redwoodjs/web/toast'
715

816
import ContactForm from 'src/components/Contact/ContactForm'
917

10-
export const QUERY = gql`
18+
export const QUERY: TypedDocumentNode<EditContactById> = gql`
1119
query EditContactById($id: Int!) {
1220
contact: contact(id: $id) {
1321
id
@@ -18,7 +26,11 @@ export const QUERY = gql`
1826
}
1927
}
2028
`
21-
const UPDATE_CONTACT_MUTATION = gql`
29+
30+
const UPDATE_CONTACT_MUTATION: TypedDocumentNode<
31+
EditContactById,
32+
UpdateContactMutationVariables
33+
> = gql`
2234
mutation UpdateContactMutation($id: Int!, $input: UpdateContactInput!) {
2335
updateContact(id: $id, input: $input) {
2436
id

‎__fixtures__/test-project/web/src/components/Contact/NewContact/NewContact.tsx

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import type { CreateContactInput } from 'types/graphql'
1+
import type {
2+
CreateContactMutation,
3+
CreateContactInput,
4+
CreateContactMutationVariables,
5+
} from 'types/graphql'
26

37
import { navigate, routes } from '@redwoodjs/router'
48
import { useMutation } from '@redwoodjs/web'
9+
import type { TypedDocumentNode } from '@redwoodjs/web'
510
import { toast } from '@redwoodjs/web/toast'
611

712
import ContactForm from 'src/components/Contact/ContactForm'
813

9-
const CREATE_CONTACT_MUTATION = gql`
14+
const CREATE_CONTACT_MUTATION: TypedDocumentNode<
15+
CreateContactMutation,
16+
CreateContactMutationVariables
17+
> = gql`
1018
mutation CreateContactMutation($input: CreateContactInput!) {
1119
createContact(input: $input) {
1220
id

‎__fixtures__/test-project/web/src/components/Post/EditPostCell/EditPostCell.tsx

+16-4
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,21 @@
1-
import type { EditPostById, UpdatePostInput } from 'types/graphql'
1+
import type {
2+
EditPostById,
3+
UpdatePostInput,
4+
UpdatePostMutationVariables,
5+
} from 'types/graphql'
26

37
import { navigate, routes } from '@redwoodjs/router'
4-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
8+
import type {
9+
CellSuccessProps,
10+
CellFailureProps,
11+
TypedDocumentNode,
12+
} from '@redwoodjs/web'
513
import { useMutation } from '@redwoodjs/web'
614
import { toast } from '@redwoodjs/web/toast'
715

816
import PostForm from 'src/components/Post/PostForm'
917

10-
export const QUERY = gql`
18+
export const QUERY: TypedDocumentNode<EditPostById> = gql`
1119
query EditPostById($id: Int!) {
1220
post: post(id: $id) {
1321
id
@@ -18,7 +26,11 @@ export const QUERY = gql`
1826
}
1927
}
2028
`
21-
const UPDATE_POST_MUTATION = gql`
29+
30+
const UPDATE_POST_MUTATION: TypedDocumentNode<
31+
EditPostById,
32+
UpdatePostMutationVariables
33+
> = gql`
2234
mutation UpdatePostMutation($id: Int!, $input: UpdatePostInput!) {
2335
updatePost(id: $id, input: $input) {
2436
id

‎__fixtures__/test-project/web/src/components/Post/NewPost/NewPost.tsx

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import type { CreatePostInput } from 'types/graphql'
1+
import type {
2+
CreatePostMutation,
3+
CreatePostInput,
4+
CreatePostMutationVariables,
5+
} from 'types/graphql'
26

37
import { navigate, routes } from '@redwoodjs/router'
48
import { useMutation } from '@redwoodjs/web'
9+
import type { TypedDocumentNode } from '@redwoodjs/web'
510
import { toast } from '@redwoodjs/web/toast'
611

712
import PostForm from 'src/components/Post/PostForm'
813

9-
const CREATE_POST_MUTATION = gql`
14+
const CREATE_POST_MUTATION: TypedDocumentNode<
15+
CreatePostMutation,
16+
CreatePostMutationVariables
17+
> = gql`
1018
mutation CreatePostMutation($input: CreatePostInput!) {
1119
createPost(input: $input) {
1220
id

‎__fixtures__/test-project/web/src/components/Post/Post/Post.tsx

+10-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import type { DeletePostMutationVariables, FindPostById } from 'types/graphql'
1+
import type {
2+
DeletePostMutation,
3+
DeletePostMutationVariables,
4+
FindPostById,
5+
} from 'types/graphql'
26

37
import { Link, routes, navigate } from '@redwoodjs/router'
48
import { useMutation } from '@redwoodjs/web'
9+
import type { TypedDocumentNode } from '@redwoodjs/web'
510
import { toast } from '@redwoodjs/web/toast'
611

712
import { timeTag } from 'src/lib/formatters'
813

9-
const DELETE_POST_MUTATION = gql`
14+
const DELETE_POST_MUTATION: TypedDocumentNode<
15+
DeletePostMutation,
16+
DeletePostMutationVariables
17+
> = gql`
1018
mutation DeletePostMutation($id: Int!) {
1119
deletePost(id: $id) {
1220
id

‎__fixtures__/test-project/web/src/components/Post/PostCell/PostCell.tsx

+14-5
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
1-
import type { FindPostById } from 'types/graphql'
1+
import type { FindPostById, FindPostByIdVariables } from 'types/graphql'
22

3-
import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
3+
import type {
4+
CellSuccessProps,
5+
CellFailureProps,
6+
TypedDocumentNode,
7+
} from '@redwoodjs/web'
48

59
import Post from 'src/components/Post/Post'
610

7-
export const QUERY = gql`
11+
export const QUERY: TypedDocumentNode<
12+
FindPostById,
13+
FindPostByIdVariables
14+
> = gql`
815
query FindPostById($id: Int!) {
916
post: post(id: $id) {
1017
id
@@ -20,10 +27,12 @@ export const Loading = () => <div>Loading...</div>
2027

2128
export const Empty = () => <div>Post not found</div>
2229

23-
export const Failure = ({ error }: CellFailureProps) => (
30+
export const Failure = ({ error }: CellFailureProps<FindPostByIdVariables>) => (
2431
<div className="rw-cell-error">{error?.message}</div>
2532
)
2633

27-
export const Success = ({ post }: CellSuccessProps<FindPostById>) => {
34+
export const Success = ({
35+
post,
36+
}: CellSuccessProps<FindPostById, FindPostByIdVariables>) => {
2837
return <Post post={post} />
2938
}

‎__fixtures__/test-project/web/src/components/Post/PostForm/PostForm.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { EditPostById, UpdatePostInput } from 'types/graphql'
22

3+
import type { RWGqlError } from '@redwoodjs/forms'
34
import {
45
Form,
56
FormError,
@@ -9,7 +10,6 @@ import {
910
NumberField,
1011
Submit,
1112
} from '@redwoodjs/forms'
12-
import type { RWGqlError } from '@redwoodjs/forms'
1313

1414
type FormPost = NonNullable<EditPostById['post']>
1515

0 commit comments

Comments
 (0)