JSFiddle - React, Tailwind, and code Playground
by Frank Liu
JavaScript
const obj = "[{\"operationName\":\"experiments\",\"variables\":{\"project\":\"PACKAGE_MANAGEMENT\",\"experimentNames\":[\"pacman_experiment_reactive_recommendation_modal\"]},\"query\":\"query experiments($project: Project!, $experimentNames: [String!]!) {\\n experimentation {\\n experiments(input: {project: $project, experimentNames: $experimentNames}) {\\n experimentName\\n decision\\n __typename\\n }\\n __typename\\n }\\n}\\n\"},{\"operationName\":\"GetSoipCatalogue\",\"variables\":{},\"query\":\"query GetSoipCatalogue {\\n sales {\\n entertainment: catalogue(context: BUY, filter: {catalogueName: \\\"pacman-entertainment\\\"}) {\\n products {\\n reference\\n owned\\n addable\\n removable\\n inBasket\\n inBasketActions\\n impactedBy {\\n reference\\n action\\n __typename\\n }\\n cost {\\n currency\\n recurring {\\n price {\\n main\\n fractional\\n __typename\\n }\\n undiscountedPrice {\\n main\\n fractional\\n __typename\\n }\\n differentialBasketPrice {\\n main\\n fractional\\n negative\\n __typename\\n }\\n __typename\\n }\\n __typename\\n }\\n offerTimeline {\\n duration\\n endDate\\n __typename\\n }\\n contract {\\n duration\\n endDate\\n __typename\\n }\\n details {\\n availabilityReasons\\n fulfilmentType\\n __typename\\n }\\n stockLevel\\n impact {\\n products {\\n reference\\n action\\n __typename\\n }\\n differentialCost {\\n currency\\n recurringPrice {\\n ...