feat(network-plugin): add support for optional "gql operation name" in data table (#4625)

Summary:
Using this network tab explorer at a company that works in graphql is very difficult because everything comes from the same HTTP route. I've added support for an optional (not visible by default) "GraphQL operation name" field for people who want to use that.

## Changelog
Adds a new optional column in the desktop network plugin called "GraphQL operation name" which will display the operation name if its available.

Pull Request resolved: https://github.com/facebook/flipper/pull/4625

Test Plan:
I didn't see much in the way of component testing for this behaviour. Looking for some guidance here. I'm happy to add some if we think that makes sense

https://user-images.githubusercontent.com/17029928/227016610-b6da1ff3-4a7e-45c6-88da-ceaa6fad53ad.mp4

Reviewed By: ivanmisuno

Differential Revision: D44331605

Pulled By: aigoncharov

fbshipit-source-id: fe7a7812541c235871ae8a71e5461ea2adbd2560
This commit is contained in:
Michael Judd
2023-03-23 05:38:15 -07:00
committed by Facebook GitHub Bot
parent 7609a4cb38
commit 0115ab3113
2 changed files with 17 additions and 0 deletions

View File

@@ -264,6 +264,15 @@ export function formatStatus(status: number | undefined) {
return status ? '' + status : '';
}
export function formatOperationName(requestData: string): string {
try {
const parsedData = JSON.parse(requestData);
return parsedData?.operationName;
} catch (_err) {
return '';
}
}
export function requestsToText(requests: Request[]): string {
const request = requests[0];
if (!request || !request.url) {