fix a bug where div keys repetition caused buggy render

[wawhal]

When you open the schema page on data tab in console, the suggested relations are generated with an iteration over a list and the key prop to each operator is the left-table of the suggested relation. In cases where relations for multiple tables are suggested, re-rendering is buggy because multiple elements have the same key and React looks at the key prop while performing incremental renders.

Description

What component does this PR affect?

• Server
• Console
• CLI
• Docs
• Community Content
• Build System

Requires changes from other components? If yes, please mark the components:

• Server
• Console
• CLI
• Docs
• Community Content
• Build System

Related Issue

Solution and Design

Type

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Docs update
• Community content

Checklist:

• I have read the contributing guide and my code conforms to the guidelines.
• This change requires a change in the documentation.
• I have updated the documentation accordingly.
• I have added required tests.

[coco98]

@wawhal @praveenweb you should specify which UI element is affected so that its easy to QA. Esp since this doesnt seem to be linked to an issue or is internally tracked.

[hasura-bot]

Review app for commit f7b049c deployed to Heroku: https://hge-ci-pull-1578.herokuapp.com
Docker image for server: hasura/graphql-engine:pull1578-f7b049c

[shahidhk]

@karthikvt26 One more review is required, esp. for functionality if it has to be verified. Please review.

[rikinsk-zz]

Functionality looks good

[hasura-bot]

Review app https://hge-ci-pull-1578.herokuapp.com is deleted