Implement visual diff

[FluorescentHallucinogen]

This pull request adds a visual diff between two GraphQL schemas.

It should significantly improve the developer experience (DX) as compared to plaintext JSON diff.

Added fields are marked in green color, deleted in red and modified in yellow. Every change is explained in tooltip on affected field hover.

[FluorescentHallucinogen]

@kamilkisiela This line could be removed when this bug is fixed.

@ardatan cc.

[kamilkisiela]

@FluorescentHallucinogen looks good but let's wait for the fix @ardatan

[FluorescentHallucinogen]

@kamilkisiela Need your help. How to include (copy) this file into build?

[kamilkisiela]

We would have to adjust bob-the-bundler but I'll do it after merging this PR.

[FluorescentHallucinogen]

@kamilkisiela @dotansimha @ardatan @Urigo

Also visual diff from this pull request could be a very useful addition to GraphQL Hive:

All that is needed is to execute the next GraphQL query to https://app.graphql-hive.com/api/proxy endpoint

query compare($organization: ID!, $project: ID!, $target: ID!, $version: ID!) {
  schemaCompareToPrevious(
    selector: {organization: $organization, project: $project, target: $target, version: $version}
  ) {
    __typename
    ...SchemaCompareResultFields
    ...SchemaCompareErrorFields
  }
  schemaVersion(
    selector: {organization: $organization, project: $project, target: $target, version: $version}
  ) {
    __typename
    ...SchemaVersionFields
  }
}

fragment SchemaCompareResultFields on SchemaCompareResult {
  initial
  changes {
    total
    nodes {
      ...SchemaChangeFields
      __typename
    }
    __typename
  }
  diff {
    before
    after
    __typename
  }
}

fragment SchemaChangeFields on SchemaChange {
  path
  message
  criticality
}

fragment SchemaCompareErrorFields on SchemaCompareError {
  message
}

fragment SchemaVersionFields on SchemaVersion {
  id
  date
  valid
  commit {
    id
    author
    service
    commit
    __typename
  }
}

and compare data.schemaCompareToPrevious.diff.before and data.schemaCompareToPrevious.diff.after from response.

[TuvalSimha]

Hi @FluorescentHallucinogen ,
Thank you for your contribution. At the moment we are not looking into supporting this kind of feature in Inspector, because we think it might make maintenance more complicated, and since we think that visual diff is working fine, but it's not scalable after ~50 types.

I do think this PR is a good reference for users who wants to create a custom setup on top of Voyager and Inspector, so maybe we can convert that into an example?