move fragments closer to usage

Author: tgriesser

example-hooks-gen/ts/components/Todo.tsx

@@ -36,16 +36,6 @@ interface Props {
 }
 
 graphql`
-  fragment TodoData on Todo {
-    complete
-    id
-    text
-  }
-  fragment TodoViewer on User {
-    id
-    totalCount
-    completedCount
-  }
   mutation TodoRemoveMutation($input: RemoveTodoInput!) {
     removeTodo(input: $input) {
       deletedTodoId
@@ -55,6 +45,9 @@ graphql`
       }
     }
   }
+`
+
+graphql`
   mutation TodoRenameMutation($input: RenameTodoInput!) {
     renameTodo(input: $input) {
       todo {
@@ -63,6 +56,9 @@ graphql`
       }
     }
   }
+`
+
+graphql`
   mutation TodoChangeStatusMutation($input: ChangeTodoStatusInput!) {
     changeTodoStatus(input: $input) {
       todo {
@@ -80,8 +76,22 @@ graphql`
 const Todo = (props: Props) => {
   const [isEditing, setIsEditing] = React.useState(false)
 
+  graphql`
+    fragment TodoData on Todo {
+      complete
+      id
+      text
+    }
+  `
   const todo = useTodoDataFragment(props.todo)
 
+  graphql`
+    fragment TodoViewer on User {
+      id
+      totalCount
+      completedCount
+    }
+  `
   const viewer = useTodoViewerFragment(props.viewer)
 
   const [commitRename] = useTodoRenameMutation()

example-hooks-gen/ts/components/TodoApp.tsx

@@ -29,28 +29,14 @@ interface Props {
 }
 
 graphql`
-  fragment TodoAppData on User
-  @refetchable(queryName: "TodoAppRefetchQuery")
-  @argumentDefinitions(
-    last: { type: "Int" }
-    first: { type: "Int" }
-    after: { type: "String" }
-    before: { type: "String" }
-  ) {
-    id
-    totalCount
-    isAppending
-    ...TodoListFooterData
-    ...TodoList
-      @arguments(last: $last, first: $first, after: $after, before: $before)
-  }
-
   mutation TodoAppSetAppendingMutation($isAppending: Boolean!) {
     setAppending(appending: $isAppending) {
       isAppending
     }
   }
+`
 
+graphql`
   mutation TodoAppAddTodoMutation(
     $input: AddTodoInput!
     $connections: [ID!]!
@@ -85,6 +71,23 @@ graphql`
 let tempID = 0
 
 const TodoApp = (props: Props) => {
+  graphql`
+    fragment TodoAppData on User
+    @refetchable(queryName: "TodoAppRefetchQuery")
+    @argumentDefinitions(
+      last: { type: "Int" }
+      first: { type: "Int" }
+      after: { type: "String" }
+      before: { type: "String" }
+    ) {
+      id
+      totalCount
+      isAppending
+      ...TodoListFooterData
+      ...TodoList
+        @arguments(last: $last, first: $first, after: $after, before: $before)
+    }
+  `
   const [viewer, refetch] = useRefetchableTodoAppDataFragment(props.frag)
   const [addTodo] = useTodoAppAddTodoMutation()
   const [setAppending] = useTodoAppSetAppendingMutation()

example-hooks-gen/ts/components/TodoList.tsx

@@ -25,6 +25,21 @@ interface Props {
   viewer: TodoList$key
 }
 
+graphql`
+  mutation TodoListMarkAllTodosMutation($input: MarkAllTodosInput!) {
+    markAllTodos(input: $input) {
+      changedTodos {
+        id
+        complete
+      }
+      viewer {
+        id
+        completedCount
+      }
+    }
+  }
+`
+
 graphql`
   fragment TodoList on User
   @argumentDefinitions(
@@ -49,18 +64,6 @@ graphql`
     completedCount
     ...TodoViewer
   }
-  mutation TodoListMarkAllTodosMutation($input: MarkAllTodosInput!) {
-    markAllTodos(input: $input) {
-      changedTodos {
-        id
-        complete
-      }
-      viewer {
-        id
-        completedCount
-      }
-    }
-  }
 `
 
 const TodoList = (props: Props) => {