Compiler: warn about missing/invalid directives

[MarceloPrado]

When writing an inline fragment to be used by readInlineData, Relay won't warn you if you forget to use the @inline directive:

export function getFooBarValue(fragmentRef: DummyExampleFragment$key) {
  const data = readInlineData(
    graphql`
      fragment DummyExampleFragment on Node {
        ... on Foo {
          bar
        }
      }
    `,
    fragmentRef,
  );

  return data?.foo?.bar ?? "";
}

From the compiler standpoint, everything works great as long as you spread DummyExampleFragment on Node. However, at runtime, Relay will throw an error:

Invariant Violation: GraphQLTag: Expected an inline data fragment, got `{"argumentDefinitions": ... }`.

The fix is simple - we just need to add @inline to our fragment definition. It would be great if the compiler explained that to me at build-time.

Overall, I believe we need "smarter" fragment types. Typescript should complain if:

• I pass a fragment without @refetchable to useRefetchableFragment
• I pass a fragment without @inline to readInlineData
• I pass a fragment without @connection and @refetchable to usePaginationFragment
• etc.