console: add types generator in add new action form

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/6092
GitOrigin-RevId: 993de137c99d2af186d8f5088b3db6dfcb46a1e1
This commit is contained in:
Daniele Cammareri 2022-10-04 20:42:32 +02:00 committed by hasura-bot
parent bf991be955
commit bfca6d782d
10 changed files with 464 additions and 29 deletions

View File

@ -25,6 +25,7 @@
"@sentry/react": "7.11.1",
"@sentry/tracing": "7.11.1",
"@types/lodash.get": "^4.4.6",
"@walmartlabs/json-to-simple-graphql-schema": "^3.0.1",
"@xstate/react": "^2.0.0",
"ace-builds": "^1.4.11",
"antd": "4.18.6",
@ -35,6 +36,7 @@
"case-sensitive-paths-webpack-plugin": "^2.3.0",
"clsx": "1.1.1",
"codemirror": "5.51.0",
"format-graphql": "^1.4.0",
"graphiql": "1.0.0-alpha.0",
"graphiql-code-exporter": "2.0.8",
"graphiql-explorer": "0.6.2",
@ -11827,6 +11829,91 @@
"url": "https://opencollective.com/typescript-eslint"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@walmartlabs/json-to-simple-graphql-schema/-/json-to-simple-graphql-schema-3.0.1.tgz",
"integrity": "sha512-fHO2Zxwr76eQbttR7W+i2QFmYE4m+Dpk1SIXAkJLmaxDbYzSIUAn3hoCvhuCAXMGwvPcIQTDfjx/2dRBtbHbNA==",
"dependencies": {
"lodash.isboolean": "3.0.3",
"lodash.isinteger": "4.0.4",
"lodash.isnumber": "3.0.3",
"lodash.isobject": "3.0.2",
"lodash.set": "4.3.2",
"pascal-case": "3.1.2",
"util": "0.12.4",
"yargs": "17.3.0"
},
"bin": {
"json-to-simple-graphql-schema": "app.js"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/cliui": {
"version": "7.0.4",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
"integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
"dependencies": {
"string-width": "^4.2.0",
"strip-ansi": "^6.0.0",
"wrap-ansi": "^7.0.0"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/strip-ansi": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
"dependencies": {
"ansi-regex": "^5.0.1"
},
"engines": {
"node": ">=8"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/util": {
"version": "0.12.4",
"resolved": "https://registry.npmjs.org/util/-/util-0.12.4.tgz",
"integrity": "sha512-bxZ9qtSlGUWSOy9Qa9Xgk11kSslpuZwaxCg4sNIDj6FLucDab2JxnHwyNTCpHMtK1MjoQiWQ6DiUMZYbSrO+Sw==",
"dependencies": {
"inherits": "^2.0.3",
"is-arguments": "^1.0.4",
"is-generator-function": "^1.0.7",
"is-typed-array": "^1.1.3",
"safe-buffer": "^5.1.2",
"which-typed-array": "^1.1.2"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
"integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
"engines": {
"node": ">=10"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/yargs": {
"version": "17.3.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.3.0.tgz",
"integrity": "sha512-GQl1pWyDoGptFPJx9b9L6kmR33TGusZvXIZUT+BOz9f7X2L94oeAskFYLEg/FkhV06zZPBYLvLZRWeYId29lew==",
"dependencies": {
"cliui": "^7.0.2",
"escalade": "^3.1.1",
"get-caller-file": "^2.0.5",
"require-directory": "^2.1.1",
"string-width": "^4.2.3",
"y18n": "^5.0.5",
"yargs-parser": "^21.0.0"
},
"engines": {
"node": ">=12"
}
},
"node_modules/@walmartlabs/json-to-simple-graphql-schema/node_modules/yargs-parser": {
"version": "21.1.1",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
"integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
"engines": {
"node": ">=12"
}
},
"node_modules/@webassemblyjs/ast": {
"version": "1.8.5",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.8.5.tgz",
@ -13289,7 +13376,6 @@
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
"integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
"dev": true,
"engines": {
"node": ">= 0.4"
},
@ -18759,6 +18845,7 @@
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
"integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==",
"devOptional": true,
"dependencies": {
"prr": "~1.0.1"
},
@ -21088,7 +21175,6 @@
"version": "0.3.3",
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
"integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
"dev": true,
"dependencies": {
"is-callable": "^1.1.3"
}
@ -21299,6 +21385,29 @@
"resolved": "https://registry.npmjs.org/form-data-encoder/-/form-data-encoder-1.7.2.tgz",
"integrity": "sha512-qfqtYan3rxrnCk1VYaA4H+Ms9xdpPqvLZa6xmMgFvhO32x7/3J/ExcTd6qpxM0vH2GdMI+poehyBZvqfMTto8A=="
},
"node_modules/format-graphql": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/format-graphql/-/format-graphql-1.4.0.tgz",
"integrity": "sha512-RyhM4rJAqgJ2nb9X7VzCPt+LuhPDjd2W4JtAsSWFzKd4RReVARE00SILdSgA8eDSby8jB3LclhKPFQF7YTQxfg==",
"dependencies": {
"graphql": "^15.1.0",
"yargs": "^15.3.1"
},
"bin": {
"format-graphql": "dist/bin/index.js"
},
"engines": {
"node": ">=10.0"
}
},
"node_modules/format-graphql/node_modules/graphql": {
"version": "15.8.0",
"resolved": "https://registry.npmjs.org/graphql/-/graphql-15.8.0.tgz",
"integrity": "sha512-5gghUc24tP9HRznNpV2+FIoq3xKkj5dTQqf4v0CpdPbFVwFkWoxOM+o+2OC9ZSvjEMTjfmG9QT+gcvggTwW1zw==",
"engines": {
"node": ">= 10.x"
}
},
"node_modules/formdata-node": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/formdata-node/-/formdata-node-4.4.1.tgz",
@ -23672,7 +23781,6 @@
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz",
"integrity": "sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==",
"dev": true,
"dependencies": {
"call-bind": "^1.0.2",
"has-tostringtag": "^1.0.0"
@ -23950,7 +24058,6 @@
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz",
"integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==",
"dev": true,
"dependencies": {
"has-tostringtag": "^1.0.0"
},
@ -24245,7 +24352,6 @@
"version": "1.1.9",
"resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.9.tgz",
"integrity": "sha512-kfrlnTTn8pZkfpJMUgYD7YZ3qzeJgWUn8XfVYBARc4wnmNOmLbmuuaAs3q5fvB0UJOn6yHAKaGTPM7d6ezoD/A==",
"dev": true,
"dependencies": {
"available-typed-arrays": "^1.0.5",
"call-bind": "^1.0.2",
@ -27538,6 +27644,11 @@
"integrity": "sha512-L4/arjjuq4noiUJpt3yS6KIKDtJwNe2fIYgMqyYYKoeIfV1iEqvPwhCx23o+R9dzouGihDAPN1dTIRWa7zk8tw==",
"dev": true
},
"node_modules/lodash.set": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
"integrity": "sha512-4hNPN5jlm/N/HLMCO43v8BXKq9Z7QdAGc/VGrRD61w8gN9g/6jF9A4L1pbUgBLCffi0w9VsXfTOij5x8iTyFvg=="
},
"node_modules/lodash.uniq": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@ -28363,6 +28474,7 @@
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
"devOptional": true,
"bin": {
"mime": "cli.js"
},
@ -32850,7 +32962,8 @@
"node_modules/prr": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
"integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw=="
"integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==",
"devOptional": true
},
"node_modules/psl": {
"version": "1.9.0",
@ -41558,7 +41671,6 @@
"version": "1.1.8",
"resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.8.tgz",
"integrity": "sha512-Jn4e5PItbcAHyLoRDwvPj1ypu27DJbtdYXUa5zsinrUx77Uvfb0cXwwnGMTn7cjUfhhqgVQnVJCwF+7cgU7tpw==",
"dev": true,
"dependencies": {
"available-typed-arrays": "^1.0.5",
"call-bind": "^1.0.2",
@ -41638,7 +41750,6 @@
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
"integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
"dev": true,
"dependencies": {
"ansi-styles": "^4.0.0",
"string-width": "^4.1.0",
@ -41655,7 +41766,6 @@
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true,
"dependencies": {
"color-convert": "^2.0.1"
},
@ -41670,7 +41780,6 @@
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
"dev": true,
"dependencies": {
"ansi-regex": "^5.0.1"
},
@ -50928,6 +51037,78 @@
"eslint-visitor-keys": "^2.0.0"
}
},
"@walmartlabs/json-to-simple-graphql-schema": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@walmartlabs/json-to-simple-graphql-schema/-/json-to-simple-graphql-schema-3.0.1.tgz",
"integrity": "sha512-fHO2Zxwr76eQbttR7W+i2QFmYE4m+Dpk1SIXAkJLmaxDbYzSIUAn3hoCvhuCAXMGwvPcIQTDfjx/2dRBtbHbNA==",
"requires": {
"lodash.isboolean": "3.0.3",
"lodash.isinteger": "4.0.4",
"lodash.isnumber": "3.0.3",
"lodash.isobject": "3.0.2",
"lodash.set": "4.3.2",
"pascal-case": "3.1.2",
"util": "0.12.4",
"yargs": "17.3.0"
},
"dependencies": {
"cliui": {
"version": "7.0.4",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
"integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
"requires": {
"string-width": "^4.2.0",
"strip-ansi": "^6.0.0",
"wrap-ansi": "^7.0.0"
}
},
"strip-ansi": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
"requires": {
"ansi-regex": "^5.0.1"
}
},
"util": {
"version": "0.12.4",
"resolved": "https://registry.npmjs.org/util/-/util-0.12.4.tgz",
"integrity": "sha512-bxZ9qtSlGUWSOy9Qa9Xgk11kSslpuZwaxCg4sNIDj6FLucDab2JxnHwyNTCpHMtK1MjoQiWQ6DiUMZYbSrO+Sw==",
"requires": {
"inherits": "^2.0.3",
"is-arguments": "^1.0.4",
"is-generator-function": "^1.0.7",
"is-typed-array": "^1.1.3",
"safe-buffer": "^5.1.2",
"which-typed-array": "^1.1.2"
}
},
"y18n": {
"version": "5.0.8",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
"integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA=="
},
"yargs": {
"version": "17.3.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-17.3.0.tgz",
"integrity": "sha512-GQl1pWyDoGptFPJx9b9L6kmR33TGusZvXIZUT+BOz9f7X2L94oeAskFYLEg/FkhV06zZPBYLvLZRWeYId29lew==",
"requires": {
"cliui": "^7.0.2",
"escalade": "^3.1.1",
"get-caller-file": "^2.0.5",
"require-directory": "^2.1.1",
"string-width": "^4.2.3",
"y18n": "^5.0.5",
"yargs-parser": "^21.0.0"
}
},
"yargs-parser": {
"version": "21.1.1",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
"integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw=="
}
}
},
"@webassemblyjs/ast": {
"version": "1.8.5",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.8.5.tgz",
@ -52110,8 +52291,7 @@
"available-typed-arrays": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
"integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
"dev": true
"integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw=="
},
"aws-sign2": {
"version": "0.7.0",
@ -56490,6 +56670,7 @@
"version": "0.1.8",
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
"integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==",
"devOptional": true,
"requires": {
"prr": "~1.0.1"
}
@ -58288,7 +58469,6 @@
"version": "0.3.3",
"resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
"integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
"dev": true,
"requires": {
"is-callable": "^1.1.3"
}
@ -58452,6 +58632,22 @@
"resolved": "https://registry.npmjs.org/form-data-encoder/-/form-data-encoder-1.7.2.tgz",
"integrity": "sha512-qfqtYan3rxrnCk1VYaA4H+Ms9xdpPqvLZa6xmMgFvhO32x7/3J/ExcTd6qpxM0vH2GdMI+poehyBZvqfMTto8A=="
},
"format-graphql": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/format-graphql/-/format-graphql-1.4.0.tgz",
"integrity": "sha512-RyhM4rJAqgJ2nb9X7VzCPt+LuhPDjd2W4JtAsSWFzKd4RReVARE00SILdSgA8eDSby8jB3LclhKPFQF7YTQxfg==",
"requires": {
"graphql": "^15.1.0",
"yargs": "^15.3.1"
},
"dependencies": {
"graphql": {
"version": "15.8.0",
"resolved": "https://registry.npmjs.org/graphql/-/graphql-15.8.0.tgz",
"integrity": "sha512-5gghUc24tP9HRznNpV2+FIoq3xKkj5dTQqf4v0CpdPbFVwFkWoxOM+o+2OC9ZSvjEMTjfmG9QT+gcvggTwW1zw=="
}
}
},
"formdata-node": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/formdata-node/-/formdata-node-4.4.1.tgz",
@ -60257,7 +60453,6 @@
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.1.1.tgz",
"integrity": "sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==",
"dev": true,
"requires": {
"call-bind": "^1.0.2",
"has-tostringtag": "^1.0.0"
@ -60454,7 +60649,6 @@
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz",
"integrity": "sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==",
"dev": true,
"requires": {
"has-tostringtag": "^1.0.0"
}
@ -60652,7 +60846,6 @@
"version": "1.1.9",
"resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.9.tgz",
"integrity": "sha512-kfrlnTTn8pZkfpJMUgYD7YZ3qzeJgWUn8XfVYBARc4wnmNOmLbmuuaAs3q5fvB0UJOn6yHAKaGTPM7d6ezoD/A==",
"dev": true,
"requires": {
"available-typed-arrays": "^1.0.5",
"call-bind": "^1.0.2",
@ -63190,6 +63383,11 @@
"integrity": "sha512-L4/arjjuq4noiUJpt3yS6KIKDtJwNe2fIYgMqyYYKoeIfV1iEqvPwhCx23o+R9dzouGihDAPN1dTIRWa7zk8tw==",
"dev": true
},
"lodash.set": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
"integrity": "sha512-4hNPN5jlm/N/HLMCO43v8BXKq9Z7QdAGc/VGrRD61w8gN9g/6jF9A4L1pbUgBLCffi0w9VsXfTOij5x8iTyFvg=="
},
"lodash.uniq": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@ -63842,7 +64040,8 @@
"mime": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
"devOptional": true
},
"mime-db": {
"version": "1.52.0",
@ -67288,7 +67487,8 @@
"prr": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
"integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw=="
"integrity": "sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==",
"devOptional": true
},
"psl": {
"version": "1.9.0",
@ -74078,7 +74278,6 @@
"version": "1.1.8",
"resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.8.tgz",
"integrity": "sha512-Jn4e5PItbcAHyLoRDwvPj1ypu27DJbtdYXUa5zsinrUx77Uvfb0cXwwnGMTn7cjUfhhqgVQnVJCwF+7cgU7tpw==",
"dev": true,
"requires": {
"available-typed-arrays": "^1.0.5",
"call-bind": "^1.0.2",
@ -74146,7 +74345,6 @@
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
"integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
"dev": true,
"requires": {
"ansi-styles": "^4.0.0",
"string-width": "^4.1.0",
@ -74157,7 +74355,6 @@
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
"dev": true,
"requires": {
"color-convert": "^2.0.1"
}
@ -74166,7 +74363,6 @@
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
"integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
"dev": true,
"requires": {
"ansi-regex": "^5.0.1"
}

View File

@ -93,6 +93,7 @@
"@sentry/react": "7.11.1",
"@sentry/tracing": "7.11.1",
"@types/lodash.get": "^4.4.6",
"@walmartlabs/json-to-simple-graphql-schema": "^3.0.1",
"@xstate/react": "^2.0.0",
"ace-builds": "^1.4.11",
"antd": "4.18.6",
@ -103,6 +104,7 @@
"case-sensitive-paths-webpack-plugin": "^2.3.0",
"clsx": "1.1.1",
"codemirror": "5.51.0",
"format-graphql": "^1.4.0",
"graphiql": "1.0.0-alpha.0",
"graphiql-code-exporter": "2.0.8",
"graphiql-explorer": "0.6.2",

View File

@ -1,6 +1,8 @@
import React from 'react';
import { GraphQLError } from 'graphql';
import { IconTooltip } from '@/new-components/Tooltip';
import { Button } from '@/new-components/Button';
import { FaMagic } from 'react-icons/fa';
import HandlerEditor from './HandlerEditor';
import ExecutionEditor from './ExecutionEditor';
import HeaderConfEditor from './HeaderConfEditor';
@ -11,6 +13,7 @@ import { Nullable } from '../../../../Common/utils/tsUtils';
import ActionDefIcon from '../../../../Common/Icons/ActionDef';
import TypesDefIcon from '../../../../Common/Icons/TypesDef';
import { inputStyles } from '../../constants';
import { TypeGeneratorModal } from './TypeGeneratorModal/TypeGeneratorModal';
type ActionEditorProps = {
handler: string;
@ -75,6 +78,8 @@ const ActionEditor: React.FC<ActionEditorProps> = ({
timer: actionParseTimer,
} = actionDefinition;
const [isTypesGeneratorOpen, setIsTypesGeneratorOpen] = React.useState(false);
return (
<>
<h2 className="text-lg font-semibold mb-xs flex items-center">
@ -157,6 +162,21 @@ const ActionEditor: React.FC<ActionEditorProps> = ({
<GlobalTypesViewer />
</div>
<TypeGeneratorModal
isOpen={isTypesGeneratorOpen}
onInsertTypes={types =>
typeDefinitionOnChange(types, null, null, null)
}
onClose={() => setIsTypesGeneratorOpen(false)}
/>
<Button
icon={<FaMagic />}
onClick={() => setIsTypesGeneratorOpen(true)}
>
Type generator
</Button>
</div>
<HandlerEditor

View File

@ -0,0 +1,126 @@
import React, { useEffect } from 'react';
import z from 'zod';
import { CodeEditorField } from '@/new-components/Form';
import { formatSdl } from 'format-graphql';
import { jsonToSchema } from '@walmartlabs/json-to-simple-graphql-schema/lib';
import { useFormContext } from 'react-hook-form';
import { useDebouncedEffect } from '@/hooks/useDebounceEffect';
import { SchemaType } from './types';
export const schema = z.object({
jsonInput: z.string(),
graphqlInput: z.string(),
jsonOutput: z.string(),
graphqlOutput: z.string(),
});
const editorOptions = {
minLines: 10,
maxLines: 10,
showLineNumbers: true,
useSoftTabs: true,
};
export const TypeGeneratorForm = (props: {
setValues: (values: SchemaType) => void;
}) => {
const { setValues } = props;
const { watch, setValue, setError, clearErrors } = useFormContext();
const jsonInput = watch('jsonInput');
const jsonOutput = watch('jsonOutput');
const graphqlInput = watch('graphqlInput');
const graphqlOutput = watch('graphqlOutput');
useEffect(() => {
setValues({
jsonInput,
jsonOutput,
graphqlInput,
graphqlOutput,
});
}, [jsonInput, jsonOutput, graphqlInput, graphqlOutput]);
useDebouncedEffect(
() => {
clearErrors();
try {
if (jsonInput) {
const schema = jsonToSchema({
jsonInput: jsonInput,
baseType: 'SampleInput',
});
setValue(
'graphqlInput',
formatSdl(schema.value.replace(/type\s(.*)\s\{/g, 'input $1 {'))
);
}
} catch (e) {
setError('jsonInput', {
message: 'Invalid JSON',
});
}
try {
if (jsonOutput) {
const schema = jsonToSchema({
jsonInput: jsonOutput,
baseType: 'SampleOutput',
});
setValue('graphqlOutput', formatSdl(schema.value));
}
} catch (e) {
setError('jsonOutput', {
message: 'Invalid JSON',
});
}
},
400,
[jsonInput, jsonOutput, clearErrors, setError, setValue]
);
return (
<div>
<div className="flex">
<CodeEditorField
noErrorPlaceholder
name="jsonInput"
label="Sample Request (JSON)"
tooltip="Enter a sample request in JSON format to generate the input type"
editorOptions={editorOptions}
editorProps={{
className: 'rounded-r-none',
}}
/>
<CodeEditorField
name="graphqlInput"
label="&nbsp;"
tooltip=""
editorOptions={editorOptions}
editorProps={{
className: 'rounded-l-none bg-slate-100',
}}
/>
</div>
<div className="flex">
<CodeEditorField
name="jsonOutput"
label="Sample Response (JSON)"
tooltip="Enter a sample response in JSON format to generate the output type"
editorOptions={editorOptions}
editorProps={{
className: 'rounded-r-none',
}}
/>
<CodeEditorField
name="graphqlOutput"
label="&nbsp;"
tooltip=""
editorOptions={editorOptions}
editorProps={{
className: 'rounded-l-none bg-slate-100',
}}
/>
</div>
</div>
);
};

View File

@ -0,0 +1,71 @@
import { Dialog } from '@/new-components/Dialog';
import { Form } from '@/new-components/Form';
import { SchemaType } from './types';
import React from 'react';
import { schema, TypeGeneratorForm } from './TypeGeneratorForm';
interface TypeGeneratorModalProps {
onInsertTypes: (types: string) => void;
onClose: () => void;
isOpen: boolean;
}
export const TypeGeneratorModal = (props: TypeGeneratorModalProps) => {
const { isOpen, onClose, onInsertTypes } = props;
const [values, setValues] = React.useState<SchemaType>({
jsonInput: JSON.stringify({
username: '',
password: '',
}),
graphqlInput: '',
jsonOutput: JSON.stringify({
accessToken: '',
}),
graphqlOutput: '',
});
if (!isOpen) {
return null;
}
return (
<Dialog
size="xl"
footer={
<Dialog.Footer
onSubmit={() => {
onInsertTypes(
`${values?.graphqlInput ?? ''}\n${
values?.graphqlOutput ?? ''
}`.trim()
);
onClose();
}}
onClose={onClose}
callToDeny="Cancel"
callToAction="Insert Types"
/>
}
title="Type Generator"
hasBackdrop
onClose={onClose}
>
<div className="px-sm">
<p className="text-muted mb-6">
Generate your GraphQL Types from a sample of your request and response
body.
</p>
<Form
options={{
defaultValues: values,
}}
className="pl-0 pr-0"
schema={schema}
onSubmit={() => {}}
>
{() => <TypeGeneratorForm setValues={setValues} />}
</Form>
</div>
</Dialog>
);
};

View File

@ -0,0 +1,9 @@
declare module '@walmartlabs/json-to-simple-graphql-schema/lib' {
export function jsonToSchema(options: {
jsonInput: string;
baseType: string;
}): { value: string };
}
declare module 'format-graphql' {
export function formatSdl(query: string): string;
}

View File

@ -0,0 +1,4 @@
import z from 'zod';
import { schema } from './TypeGeneratorForm';
export type SchemaType = z.infer<typeof schema>;

View File

@ -1,7 +1,7 @@
import React from 'react';
import clsx from 'clsx';
import * as RadixDialog from '@radix-ui/react-dialog';
import { FaTimes } from 'react-icons/fa';
import clsx from 'clsx';
import { Button } from '../Button/Button';
export type FooterProps = {
@ -47,12 +47,13 @@ const Backdrop = () => (
<RadixDialog.Overlay className="fixed top-0 left-0 h-full w-full bg-gray-900/90 backdrop-blur-sm z-[100]" />
);
type DialogSize = 'sm' | 'md' | 'lg';
type DialogSize = 'sm' | 'md' | 'lg' | 'xl';
const dialogSizing: Record<DialogSize, string> = {
sm: 'max-w-xl',
md: 'max-w-2xl',
lg: 'max-w-3xl',
xl: 'max-w-4xl',
};
export type DialogProps = {

View File

@ -159,7 +159,6 @@ export const CodeEditorField: React.FC<CodeEditorFieldProps> = ({
},
},
]}
editorProps={editorProps}
setOptions={editorOptions}
data-test={dataTest}
className={clsx(
@ -169,7 +168,8 @@ export const CodeEditorField: React.FC<CodeEditorFieldProps> = ({
: 'border-gray-300',
disabled
? 'bg-gray-200 border-gray-200 hover:border-gray-200'
: 'hover:border-gray-400'
: 'hover:border-gray-400',
editorProps?.className
)}
data-testid={name}
/>
@ -177,8 +177,14 @@ export const CodeEditorField: React.FC<CodeEditorFieldProps> = ({
);
}}
/>
{/* This is to let form errors to appear below the tip */}
{tipState === 'ANY' && (
<div className="bg-legacybg top-full left-1 text-gray-600 text-sm mt-1">
{' '}
</div>
)}
{tipState === 'ESC' && (
<div className="absolute bg-legacybg top-full left-1 text-gray-600 text-sm mt-1">
<div className="bg-legacybg top-full left-1 text-gray-600 text-sm mt-1">
Tip:{' '}
<strong>
Press <em>Esc</em> key
@ -187,7 +193,7 @@ export const CodeEditorField: React.FC<CodeEditorFieldProps> = ({
</div>
)}
{tipState === 'TAB' && (
<div className="absolute bg-legacybg top-full left-1 text-gray-600 text-sm mt-1">
<div className="bg-legacybg top-full left-1 text-gray-600 text-sm mt-1">
Tip: Press <em>Esc</em> key then{' '}
<strong>
navigate with <em>Tab</em>

View File

@ -38,7 +38,7 @@ export const Tooltip: React.VFC<TooltipProps> = ({
<RadixTooltip.Portal>
<RadixTooltip.Content
side={side}
className="bg-gray-800 p-sm text-white rounded max-w-lg"
className="bg-gray-800 p-sm text-white rounded max-w-lg z-[102]"
>
<RadixTooltip.Arrow
className="fill-current text-gray-800"