diff --git a/packages/insomnia-app/app/plugins/context/app.tsx b/packages/insomnia-app/app/plugins/context/app.tsx index ac5e1ba815..af8126bffb 100644 --- a/packages/insomnia-app/app/plugins/context/app.tsx +++ b/packages/insomnia-app/app/plugins/context/app.tsx @@ -1,5 +1,6 @@ import * as electron from 'electron'; import React from 'react'; +import type ReactDOM from 'react-dom'; import * as analytics from '../../../app/common/analytics'; import { axiosRequest as axios } from '../../../app/network/axios-request'; @@ -64,7 +65,11 @@ export interface AppContext { export interface PrivateProperties { axios: typeof axios; analytics: typeof analytics; - insomniaComponents: any; + loadRendererModules: () => Promise<{ + insomniaComponents: any; + ReactDOM: typeof ReactDOM; + React: typeof React; + } | {}>; } export function init(renderPurpose: RenderPurpose = RENDER_PURPOSE_GENERAL): { @@ -216,7 +221,22 @@ export function init(renderPurpose: RenderPurpose = RENDER_PURPOSE_GENERAL): { __private: { axios, analytics, - insomniaComponents: globalThis.document ? require('insomnia-components') : {}, + // Provide modules that can be used in the renderer process + async loadRendererModules() { + if (typeof globalThis.document === 'undefined') { + return {}; + } + + const ReactDOM = await import('react-dom'); + const React = await import('react'); + const insomniaComponents = await import('insomnia-components'); + + return { + ReactDOM, + React, + insomniaComponents, + }; + }, }, }; } diff --git a/plugins/insomnia-plugin-kong-portal/esbuild.ts b/plugins/insomnia-plugin-kong-portal/esbuild.ts index b8f65285f7..081c2c3925 100644 --- a/plugins/insomnia-plugin-kong-portal/esbuild.ts +++ b/plugins/insomnia-plugin-kong-portal/esbuild.ts @@ -3,7 +3,7 @@ import { build } from 'esbuild'; build({ bundle: true, entryPoints: ['./src/index.ts'], - external: ['react', 'react-dom', 'styled-components'], + external: ['react', 'react-dom'], format: 'cjs', outfile: './dist/index.js', watch: Boolean(process.env.ESBUILD_WATCH), diff --git a/plugins/insomnia-plugin-kong-portal/package-lock.json b/plugins/insomnia-plugin-kong-portal/package-lock.json index 7302ad8d27..53090a7ba4 100644 --- a/plugins/insomnia-plugin-kong-portal/package-lock.json +++ b/plugins/insomnia-plugin-kong-portal/package-lock.json @@ -9,9 +9,6 @@ "version": "2.12.0-beta.0", "license": "Apache-2.0", "dependencies": { - "react": "^17.0.2", - "react-dom": "^17.0.2", - "styled-components": "^5.3.3", "url-join": "^4.0.1" }, "devDependencies": { @@ -24,7 +21,10 @@ "cross-env": "^7.0.3", "esbuild": "^0.14.29", "esbuild-runner": "^2.2.1", + "react": "^17.0.2", + "react-dom": "^17.0.2", "rimraf": "3.0.2", + "styled-components": "^5.3.3", "typescript": "^4.5.5" } }, @@ -32,6 +32,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.8.3.tgz", "integrity": "sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g==", + "dev": true, "dependencies": { "@babel/highlight": "^7.8.3" } @@ -40,6 +41,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.9.5.tgz", "integrity": "sha512-GbNIxVB3ZJe3tLeDm1HSn2AhuD/mVcyLDpgtLXa5tplmWrJdF/elxB56XNqCuD6szyNkDi6wuoKXln3QeBmCHQ==", + "dev": true, "dependencies": { "@babel/types": "^7.9.5", "jsesc": "^2.5.1", @@ -51,6 +53,7 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz", "integrity": "sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==", + "dev": true, "dependencies": { "@babel/types": "^7.16.7" }, @@ -62,6 +65,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.9.5.tgz", "integrity": "sha512-JVcQZeXM59Cd1qanDUxv9fgJpt3NeKUaqBqUEvfmQ+BCOKq2xUgaWZW2hr0dkbyJgezYuplEoh5knmrnS68efw==", + "dev": true, "dependencies": { "@babel/helper-get-function-arity": "^7.8.3", "@babel/template": "^7.8.3", @@ -72,6 +76,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz", "integrity": "sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA==", + "dev": true, "dependencies": { "@babel/types": "^7.8.3" } @@ -80,6 +85,7 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz", "integrity": "sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==", + "dev": true, "dependencies": { "@babel/types": "^7.16.7" }, @@ -91,6 +97,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz", "integrity": "sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA==", + "dev": true, "dependencies": { "@babel/types": "^7.8.3" } @@ -99,6 +106,7 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz", "integrity": "sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -107,6 +115,7 @@ "version": "7.9.0", "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.9.0.tgz", "integrity": "sha512-lJZPilxX7Op3Nv/2cvFdnlepPXDxi29wxteT57Q965oc5R9v86ztx0jfxVrTcBk8C2kcPkkDa2Z4T3ZsPPVWsQ==", + "dev": true, "dependencies": { "@babel/helper-validator-identifier": "^7.9.0", "chalk": "^2.0.0", @@ -117,6 +126,7 @@ "version": "7.9.4", "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.9.4.tgz", "integrity": "sha512-bC49otXX6N0/VYhgOMh4gnP26E9xnDZK3TmbNpxYzzz9BQLBosQwfyOe9/cXUU3txYhTzLCbcqd5c8y/OmCjHA==", + "dev": true, "bin": { "parser": "bin/babel-parser.js" }, @@ -128,6 +138,7 @@ "version": "7.8.6", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.8.6.tgz", "integrity": "sha512-zbMsPMy/v0PWFZEhQJ66bqjhH+z0JgMoBWuikXybgG3Gkd/3t5oQ1Rw2WQhnSrsOmsKXnZOx15tkC4qON/+JPg==", + "dev": true, "dependencies": { "@babel/code-frame": "^7.8.3", "@babel/parser": "^7.8.6", @@ -138,6 +149,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.9.5.tgz", "integrity": "sha512-c4gH3jsvSuGUezlP6rzSJ6jf8fYjLj3hsMZRx/nX0h+fmHN0w+ekubRrHPqnMec0meycA2nwCsJ7dC8IPem2FQ==", + "dev": true, "dependencies": { "@babel/code-frame": "^7.8.3", "@babel/generator": "^7.9.5", @@ -154,6 +166,7 @@ "version": "7.17.0", "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.17.0.tgz", "integrity": "sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==", + "dev": true, "dependencies": { "@babel/helper-validator-identifier": "^7.16.7", "to-fast-properties": "^2.0.0" @@ -166,6 +179,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dev": true, "dependencies": { "@emotion/memoize": "^0.7.4" } @@ -173,17 +187,20 @@ "node_modules/@emotion/memoize": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", - "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==", + "dev": true }, "node_modules/@emotion/stylis": { "version": "0.8.5", "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz", - "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==" + "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==", + "dev": true }, "node_modules/@emotion/unitless": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", - "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==", + "dev": true }, "node_modules/@types/hoist-non-react-statics": { "version": "3.3.1", @@ -257,6 +274,7 @@ "version": "3.2.1", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", + "dev": true, "dependencies": { "color-convert": "^1.9.0" }, @@ -276,7 +294,8 @@ "node_modules/babel-plugin-syntax-jsx": { "version": "6.18.0", "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz", - "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=" + "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=", + "dev": true }, "node_modules/balanced-match": { "version": "1.0.2", @@ -303,12 +322,14 @@ "node_modules/camelize": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz", - "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=" + "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=", + "dev": true }, "node_modules/chalk": { "version": "2.4.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", + "dev": true, "dependencies": { "ansi-styles": "^3.2.1", "escape-string-regexp": "^1.0.5", @@ -333,6 +354,7 @@ "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", + "dev": true, "dependencies": { "color-name": "1.1.3" } @@ -340,7 +362,8 @@ "node_modules/color-name": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", - "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" + "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=", + "dev": true }, "node_modules/concat-map": { "version": "0.0.1", @@ -491,6 +514,7 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", "integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=", + "dev": true, "engines": { "node": ">=4" } @@ -499,6 +523,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.0.0.tgz", "integrity": "sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==", + "dev": true, "dependencies": { "camelize": "^1.0.0", "css-color-keywords": "^1.0.0", @@ -529,6 +554,7 @@ "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", "deprecated": "Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)", + "dev": true, "dependencies": { "ms": "^2.1.1" } @@ -923,6 +949,7 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=", + "dev": true, "engines": { "node": ">=0.8.0" } @@ -986,6 +1013,7 @@ "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", + "dev": true, "engines": { "node": ">=4" } @@ -994,6 +1022,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=", + "dev": true, "engines": { "node": ">=4" } @@ -1002,6 +1031,7 @@ "version": "3.3.2", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "dev": true, "dependencies": { "react-is": "^16.7.0" } @@ -1009,7 +1039,8 @@ "node_modules/hoist-non-react-statics/node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "dev": true }, "node_modules/inflight": { "version": "1.0.6", @@ -1045,12 +1076,14 @@ "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", + "dev": true }, "node_modules/jsesc": { "version": "2.5.2", "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==", + "dev": true, "bin": { "jsesc": "bin/jsesc" }, @@ -1061,12 +1094,14 @@ "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "dev": true }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dev": true, "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" }, @@ -1089,12 +1124,14 @@ "node_modules/ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", - "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", + "dev": true }, "node_modules/object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", + "dev": true, "engines": { "node": ">=0.10.0" } @@ -1130,6 +1167,7 @@ "version": "2.3.1", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true, "engines": { "node": ">=8.6" }, @@ -1140,12 +1178,14 @@ "node_modules/postcss-value-parser": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", - "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", + "dev": true }, "node_modules/react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" @@ -1158,6 +1198,7 @@ "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz", "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", @@ -1171,6 +1212,7 @@ "version": "18.0.0", "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.0.0.tgz", "integrity": "sha512-yUcBYdBBbo3QiPsgYDcfQcIkGZHfxOaoE6HLSnr1sPzMhdyxusbfKOSUbSd/ocGi32dxcj366PsTj+5oggeKKw==", + "dev": true, "peer": true }, "node_modules/require-directory": { @@ -1219,6 +1261,7 @@ "version": "0.20.2", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz", "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" @@ -1227,7 +1270,8 @@ "node_modules/shallowequal": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", - "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==", + "dev": true }, "node_modules/shebang-command": { "version": "2.0.0", @@ -1254,6 +1298,7 @@ "version": "0.5.7", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true, "engines": { "node": ">=0.10.0" } @@ -1313,6 +1358,7 @@ "version": "5.3.5", "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.5.tgz", "integrity": "sha512-ndETJ9RKaaL6q41B69WudeqLzOpY1A/ET/glXkNZ2T7dPjPqpPCXXQjDFYZWwNnE5co0wX+gTCqx9mfxTmSIPg==", + "dev": true, "hasInstallScript": true, "dependencies": { "@babel/helper-module-imports": "^7.0.0", @@ -1343,6 +1389,7 @@ "version": "2.0.6", "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.6.tgz", "integrity": "sha512-Sk+7o/oa2HfHv3Eh8sxoz75/fFvEdHsXV4grdeHufX0nauCmymlnN0rGhIvfpMQSJMvGutJ85gvCGea4iqmDpg==", + "dev": true, "dependencies": { "@babel/helper-annotate-as-pure": "^7.16.0", "@babel/helper-module-imports": "^7.16.0", @@ -1358,6 +1405,7 @@ "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", + "dev": true, "dependencies": { "has-flag": "^3.0.0" }, @@ -1369,6 +1417,7 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=", + "dev": true, "engines": { "node": ">=4" } @@ -1519,6 +1568,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.8.3.tgz", "integrity": "sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g==", + "dev": true, "requires": { "@babel/highlight": "^7.8.3" } @@ -1527,6 +1577,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.9.5.tgz", "integrity": "sha512-GbNIxVB3ZJe3tLeDm1HSn2AhuD/mVcyLDpgtLXa5tplmWrJdF/elxB56XNqCuD6szyNkDi6wuoKXln3QeBmCHQ==", + "dev": true, "requires": { "@babel/types": "^7.9.5", "jsesc": "^2.5.1", @@ -1538,6 +1589,7 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz", "integrity": "sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==", + "dev": true, "requires": { "@babel/types": "^7.16.7" } @@ -1546,6 +1598,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.9.5.tgz", "integrity": "sha512-JVcQZeXM59Cd1qanDUxv9fgJpt3NeKUaqBqUEvfmQ+BCOKq2xUgaWZW2hr0dkbyJgezYuplEoh5knmrnS68efw==", + "dev": true, "requires": { "@babel/helper-get-function-arity": "^7.8.3", "@babel/template": "^7.8.3", @@ -1556,6 +1609,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz", "integrity": "sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA==", + "dev": true, "requires": { "@babel/types": "^7.8.3" } @@ -1564,6 +1618,7 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz", "integrity": "sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==", + "dev": true, "requires": { "@babel/types": "^7.16.7" } @@ -1572,6 +1627,7 @@ "version": "7.8.3", "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz", "integrity": "sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA==", + "dev": true, "requires": { "@babel/types": "^7.8.3" } @@ -1579,12 +1635,14 @@ "@babel/helper-validator-identifier": { "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz", - "integrity": "sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==" + "integrity": "sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==", + "dev": true }, "@babel/highlight": { "version": "7.9.0", "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.9.0.tgz", "integrity": "sha512-lJZPilxX7Op3Nv/2cvFdnlepPXDxi29wxteT57Q965oc5R9v86ztx0jfxVrTcBk8C2kcPkkDa2Z4T3ZsPPVWsQ==", + "dev": true, "requires": { "@babel/helper-validator-identifier": "^7.9.0", "chalk": "^2.0.0", @@ -1594,12 +1652,14 @@ "@babel/parser": { "version": "7.9.4", "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.9.4.tgz", - "integrity": "sha512-bC49otXX6N0/VYhgOMh4gnP26E9xnDZK3TmbNpxYzzz9BQLBosQwfyOe9/cXUU3txYhTzLCbcqd5c8y/OmCjHA==" + "integrity": "sha512-bC49otXX6N0/VYhgOMh4gnP26E9xnDZK3TmbNpxYzzz9BQLBosQwfyOe9/cXUU3txYhTzLCbcqd5c8y/OmCjHA==", + "dev": true }, "@babel/template": { "version": "7.8.6", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.8.6.tgz", "integrity": "sha512-zbMsPMy/v0PWFZEhQJ66bqjhH+z0JgMoBWuikXybgG3Gkd/3t5oQ1Rw2WQhnSrsOmsKXnZOx15tkC4qON/+JPg==", + "dev": true, "requires": { "@babel/code-frame": "^7.8.3", "@babel/parser": "^7.8.6", @@ -1610,6 +1670,7 @@ "version": "7.9.5", "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.9.5.tgz", "integrity": "sha512-c4gH3jsvSuGUezlP6rzSJ6jf8fYjLj3hsMZRx/nX0h+fmHN0w+ekubRrHPqnMec0meycA2nwCsJ7dC8IPem2FQ==", + "dev": true, "requires": { "@babel/code-frame": "^7.8.3", "@babel/generator": "^7.9.5", @@ -1626,6 +1687,7 @@ "version": "7.17.0", "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.17.0.tgz", "integrity": "sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==", + "dev": true, "requires": { "@babel/helper-validator-identifier": "^7.16.7", "to-fast-properties": "^2.0.0" @@ -1635,6 +1697,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dev": true, "requires": { "@emotion/memoize": "^0.7.4" } @@ -1642,17 +1705,20 @@ "@emotion/memoize": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", - "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==", + "dev": true }, "@emotion/stylis": { "version": "0.8.5", "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz", - "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==" + "integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==", + "dev": true }, "@emotion/unitless": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", - "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==", + "dev": true }, "@types/hoist-non-react-statics": { "version": "3.3.1", @@ -1723,6 +1789,7 @@ "version": "3.2.1", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", + "dev": true, "requires": { "color-convert": "^1.9.0" } @@ -1739,7 +1806,8 @@ "babel-plugin-syntax-jsx": { "version": "6.18.0", "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz", - "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=" + "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=", + "dev": true }, "balanced-match": { "version": "1.0.2", @@ -1766,12 +1834,14 @@ "camelize": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.0.tgz", - "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=" + "integrity": "sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=", + "dev": true }, "chalk": { "version": "2.4.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", + "dev": true, "requires": { "ansi-styles": "^3.2.1", "escape-string-regexp": "^1.0.5", @@ -1793,6 +1863,7 @@ "version": "1.9.3", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", + "dev": true, "requires": { "color-name": "1.1.3" } @@ -1800,7 +1871,8 @@ "color-name": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", - "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" + "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=", + "dev": true }, "concat-map": { "version": "0.0.1", @@ -1909,12 +1981,14 @@ "css-color-keywords": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", - "integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=" + "integrity": "sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=", + "dev": true }, "css-to-react-native": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.0.0.tgz", "integrity": "sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==", + "dev": true, "requires": { "camelize": "^1.0.0", "css-color-keywords": "^1.0.0", @@ -1937,6 +2011,7 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", + "dev": true, "requires": { "ms": "^2.1.1" } @@ -2134,7 +2209,8 @@ "escape-string-regexp": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", - "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=" + "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=", + "dev": true }, "follow-redirects": { "version": "1.14.9", @@ -2171,17 +2247,20 @@ "globals": { "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", - "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==" + "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", + "dev": true }, "has-flag": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", - "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=" + "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=", + "dev": true }, "hoist-non-react-statics": { "version": "3.3.2", "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "dev": true, "requires": { "react-is": "^16.7.0" }, @@ -2189,7 +2268,8 @@ "react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "dev": true } } }, @@ -2224,22 +2304,26 @@ "js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", + "dev": true }, "jsesc": { "version": "2.5.2", "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", - "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==" + "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==", + "dev": true }, "lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "dev": true }, "loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dev": true, "requires": { "js-tokens": "^3.0.0 || ^4.0.0" } @@ -2256,12 +2340,14 @@ "ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", - "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", + "dev": true }, "object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", + "dev": true }, "once": { "version": "1.4.0", @@ -2287,17 +2373,20 @@ "picomatch": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", - "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==" + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true }, "postcss-value-parser": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", - "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", + "dev": true }, "react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==", + "dev": true, "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" @@ -2307,6 +2396,7 @@ "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz", "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==", + "dev": true, "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", @@ -2317,6 +2407,7 @@ "version": "18.0.0", "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.0.0.tgz", "integrity": "sha512-yUcBYdBBbo3QiPsgYDcfQcIkGZHfxOaoE6HLSnr1sPzMhdyxusbfKOSUbSd/ocGi32dxcj366PsTj+5oggeKKw==", + "dev": true, "peer": true }, "require-directory": { @@ -2355,6 +2446,7 @@ "version": "0.20.2", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz", "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==", + "dev": true, "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" @@ -2363,7 +2455,8 @@ "shallowequal": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", - "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==", + "dev": true }, "shebang-command": { "version": "2.0.0", @@ -2383,7 +2476,8 @@ "source-map": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", - "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=" + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true }, "source-map-support": { "version": "0.5.19", @@ -2433,6 +2527,7 @@ "version": "5.3.5", "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.5.tgz", "integrity": "sha512-ndETJ9RKaaL6q41B69WudeqLzOpY1A/ET/glXkNZ2T7dPjPqpPCXXQjDFYZWwNnE5co0wX+gTCqx9mfxTmSIPg==", + "dev": true, "requires": { "@babel/helper-module-imports": "^7.0.0", "@babel/traverse": "^7.4.5", @@ -2450,6 +2545,7 @@ "version": "2.0.6", "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.6.tgz", "integrity": "sha512-Sk+7o/oa2HfHv3Eh8sxoz75/fFvEdHsXV4grdeHufX0nauCmymlnN0rGhIvfpMQSJMvGutJ85gvCGea4iqmDpg==", + "dev": true, "requires": { "@babel/helper-annotate-as-pure": "^7.16.0", "@babel/helper-module-imports": "^7.16.0", @@ -2464,6 +2560,7 @@ "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", + "dev": true, "requires": { "has-flag": "^3.0.0" } @@ -2471,7 +2568,8 @@ "to-fast-properties": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", - "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=" + "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=", + "dev": true }, "tree-kill": { "version": "1.2.2", diff --git a/plugins/insomnia-plugin-kong-portal/package.json b/plugins/insomnia-plugin-kong-portal/package.json index 9788de2ab7..d1505d7304 100644 --- a/plugins/insomnia-plugin-kong-portal/package.json +++ b/plugins/insomnia-plugin-kong-portal/package.json @@ -28,12 +28,12 @@ "unlisted": true }, "dependencies": { - "react": "^17.0.2", - "react-dom": "^17.0.2", - "styled-components": "^5.3.3", "url-join": "^4.0.1" }, "devDependencies": { + "react": "^17.0.2", + "react-dom": "^17.0.2", + "styled-components": "^5.3.3", "@types/react": "^16.14.5", "@types/react-dom": "^16.9.12", "@types/styled-components": "^5.1.23", diff --git a/plugins/insomnia-plugin-kong-portal/src/deploy-to-portal.tsx b/plugins/insomnia-plugin-kong-portal/src/deploy-to-portal.tsx index 5b2b3e654a..be8e528962 100644 --- a/plugins/insomnia-plugin-kong-portal/src/deploy-to-portal.tsx +++ b/plugins/insomnia-plugin-kong-portal/src/deploy-to-portal.tsx @@ -1,12 +1,12 @@ import { AxiosError, AxiosRequestConfig } from 'axios'; -import React, { Component, SyntheticEvent } from 'react'; +import type ReactLib from 'react'; +import { type SyntheticEvent } from 'react'; import urlJoin from 'url-join'; import { Context, Spec } from './document-actions'; -const isAxiosError = (error?: Error | AxiosError): error is AxiosError => ( - Boolean(error) && Object.prototype.hasOwnProperty.call(error, 'isAxiosError') -); +const isAxiosError = (error?: Error | AxiosError): error is AxiosError => + Boolean(error) && Object.prototype.hasOwnProperty.call(error, 'isAxiosError'); interface Props { axios: (config: AxiosRequestConfig) => Promise<{ @@ -52,394 +52,445 @@ const defaultPersistedState: PersistedState = { kongPortalUserWorkspace: '', }; -export class DeployToPortal extends Component { - state: State = { - ...defaultPersistedState, - workspaceId: '', - kongSpecFileName: '', - isLoading: false, - connectionError: null, - showUploadError: false, - kongPortalLegacyMode: false, - kongPortalDeployView: 'edit', - forceSpecOverwrite: false, - kongPortalDeployError: '', - }; +export function getDeployToPortalComponent(options: { + React: typeof ReactLib; +}): { DeployToPortal: ReactLib.ComponentType } { + const { React } = options; + class DeployToPortal extends React.Component { + state: State = { + ...defaultPersistedState, + workspaceId: '', + kongSpecFileName: '', + isLoading: false, + connectionError: null, + showUploadError: false, + kongPortalLegacyMode: false, + kongPortalDeployView: 'edit', + forceSpecOverwrite: false, + kongPortalDeployError: '', + }; - _handleLoadingToggle(status: boolean) { - this.setState({ isLoading: status }); - } - - _hasConnectInfo() { - return this.state.kongPortalApiUrl.length > 0 && this.state.kongPortalUserWorkspace.length > 0; - } - - _handleEditKongConnection() { - this.setState({ kongPortalDeployView: 'edit' }); - } - - _handleReturnToUpload() { - this.setState({ kongPortalDeployView: 'upload' }); - } - - async _handleUploadSpec(overwrite: boolean, event?: SyntheticEvent) { - if (event) { - event.preventDefault(); + _handleLoadingToggle(status: boolean) { + this.setState({ isLoading: status }); } - const { spec, axios, trackSegmentEvent } = this.props; - - const { - kongSpecFileName, - kongPortalUserWorkspace, - kongPortalApiUrl, - kongPortalRbacToken, - kongPortalLegacyMode, - } = this.state; - - let newSpec; - let method: AxiosRequestConfig['method'] = 'post'; - let urlFilePath = urlJoin(kongPortalApiUrl, kongPortalUserWorkspace + '/files'); - let headers = {}; - - // Check legacy mode - if (kongPortalLegacyMode) { - newSpec = { - type: 'spec', - name: kongSpecFileName, - contents: spec.rawContents, - }; - } else { - newSpec = { - path: urlJoin('specs/', kongSpecFileName), - contents: spec.rawContents, - }; - } - // Check RBAC - if (kongPortalRbacToken.length > 0) { - headers = { - 'Content-Type': 'application/json', - 'Kong-Admin-Token': kongPortalRbacToken, - }; - } - // Check overwrite intent - if (overwrite) { - method = 'patch'; - urlFilePath = urlJoin( - kongPortalApiUrl, - kongPortalUserWorkspace, - '/files/specs/', - kongSpecFileName, + _hasConnectInfo() { + return ( + this.state.kongPortalApiUrl.length > 0 && + this.state.kongPortalUserWorkspace.length > 0 ); } - try { - const response = await axios({ - method, - url: urlFilePath, - data: newSpec, - headers, - }); - if (response.statusText === 'Created' || response.statusText === 'OK') { - this.setState({ kongPortalDeployView: 'success' }); - const action = overwrite ? 'replace_portal' : 'create_portal'; - trackSegmentEvent('Kong Synced', { type: 'deploy', action }); + _handleEditKongConnection() { + this.setState({ kongPortalDeployView: 'edit' }); + } + + _handleReturnToUpload() { + this.setState({ kongPortalDeployView: 'upload' }); + } + + async _handleUploadSpec( + overwrite: boolean, + event?: SyntheticEvent + ) { + if (event) { + event.preventDefault(); } - } catch (err) { - if (err.response && err.response.status === 409) { - this.setState({ kongPortalDeployView: 'overwrite' }); - const action = overwrite ? 'replace_portal' : 'create_portal'; - trackSegmentEvent('Kong Synced', { type: 'deploy', action, error: err.response.status + ': ' + err.response.statusText }); + + const { spec, axios, trackSegmentEvent } = this.props; + + const { + kongSpecFileName, + kongPortalUserWorkspace, + kongPortalApiUrl, + kongPortalRbacToken, + kongPortalLegacyMode, + } = this.state; + + let newSpec; + let method: AxiosRequestConfig['method'] = 'post'; + let urlFilePath = urlJoin( + kongPortalApiUrl, + kongPortalUserWorkspace + '/files' + ); + let headers = {}; + + // Check legacy mode + if (kongPortalLegacyMode) { + newSpec = { + type: 'spec', + name: kongSpecFileName, + contents: spec.rawContents, + }; } else { - console.log('Failed to upload to dev portal', err.response); - if (err.response && err.response.data && err.response.data.message) { - this.setState({ kongPortalDeployError: err.response.data.message }); - } - this.setState({ kongPortalDeployView: 'error' }); + newSpec = { + path: urlJoin('specs/', kongSpecFileName), + contents: spec.rawContents, + }; } - } - } - - async _handleConnectKong(event: SyntheticEvent) { - event.preventDefault(); - - const { axios, trackSegmentEvent } = this.props; - - const { kongPortalUserWorkspace, kongPortalApiUrl, kongPortalRbacToken } = this.state; - - // Show loading animation - this._handleLoadingToggle(true); - try { - // Check connection - const apiUrl = urlJoin(kongPortalApiUrl, kongPortalUserWorkspace + '/kong'); - - const response = await axios({ - method: 'get', - url: apiUrl, - headers: { + // Check RBAC + if (kongPortalRbacToken.length > 0) { + headers = { + 'Content-Type': 'application/json', 'Kong-Admin-Token': kongPortalRbacToken, - }, - }); - if (response.status === 200 || response.status === 201) { - trackSegmentEvent('Kong Connected', { type: 'token', action: 'portal_deploy' }); - - // Set legacy mode for post upload formatting, suppress loader, set monitor portal URL, move to upload view - const guiHost = response.data.configuration.portal_gui_host; - this.setState({ - kongPortalLegacyMode: response.data.configuration.portal_is_legacy, - connectionError: null, - kongPortalDeployView: 'upload', - kongPortalUrl: urlJoin(`http://${guiHost}`, kongPortalUserWorkspace), - }); - - this._handleLoadingToggle(false); + }; } - } catch (error: unknown) { - if (error instanceof Error) { - trackSegmentEvent('Kong Connected', { type: 'token', action: 'portal_deploy', error: error.message }); - console.log('Connection error', error); - this._handleLoadingToggle(false); - this.setState({ connectionError: error }); - } - } - } - - async componentDidMount() { - const newState = { ...defaultPersistedState }; - for (const key in newState) { - const value = await this.props.store.getItem(key); - newState[key as keyof PersistedState] = String(value); - } - this.setState(newState); - } - - async componentDidUpdate() { - for (const key in defaultPersistedState) { - await this.props.store.setItem(key, this.state[key as keyof PersistedState]); - } - } - - async _handleKongPortalApiUrlChange(e: SyntheticEvent) { - this.setState({ kongPortalApiUrl: e.currentTarget.value }); - } - - async _handleRBACKTokenChange(e: SyntheticEvent) { - this.setState({ kongPortalRbacToken: e.currentTarget.value }); - } - - async _handleKongPortalUserWorkspaceChange(e: SyntheticEvent) { - this.setState({ kongPortalUserWorkspace: e.currentTarget.value }); - } - - render() { - const { insomniaComponents: { Button } } = this.props; - const { - kongPortalApiUrl, - kongSpecFileName, - kongPortalUserWorkspace, - kongPortalDeployView, - connectionError, - kongPortalRbacToken, - isLoading, - showUploadError, - kongPortalLegacyMode, - kongPortalUrl, - kongPortalDeployError, - } = this.state; - - // Check input > enable connection & upload - const connectIsEnabled = kongPortalApiUrl.length > 0 && kongPortalUserWorkspace.length > 0; - const uploadIsEnabled = kongSpecFileName.length > 0; - - // Check view - if (kongPortalDeployView === 'edit') { - let connectionErrorElement: JSX.Element | null = null; - - if (connectionError) { - const stack = connectionError.stack; - let messageToShow = stack; - if (isAxiosError(connectionError) && connectionError.response) { - const response = connectionError.response; - messageToShow = `${response.status} ${response.statusText}`; - const responseMessage = response.data?.message; - if (responseMessage) { - messageToShow += `: ${responseMessage}`; - } - } - - connectionErrorElement = ( -

- Error. Please check your settings and try again. -

- More details - 
-                {messageToShow}
-
-
-

+ // Check overwrite intent + if (overwrite) { + method = 'patch'; + urlFilePath = urlJoin( + kongPortalApiUrl, + kongPortalUserWorkspace, + '/files/specs/', + kongSpecFileName ); } - return ( - // Kong Connection Details -
- {connectionErrorElement} -
- -
- -
- -
-
- - -
-
- ); - } else if (kongPortalDeployView === 'upload') { - return ( - // File Name > Upload -
-

) { + event.preventDefault(); + + const { axios, trackSegmentEvent } = this.props; + + const { kongPortalUserWorkspace, kongPortalApiUrl, kongPortalRbacToken } = + this.state; + + // Show loading animation + this._handleLoadingToggle(true); + try { + // Check connection + const apiUrl = urlJoin( + kongPortalApiUrl, + kongPortalUserWorkspace + '/kong' + ); + + const response = await axios({ + method: 'get', + url: apiUrl, + headers: { + 'Kong-Admin-Token': kongPortalRbacToken, + }, + }); + if (response.status === 200 || response.status === 201) { + trackSegmentEvent('Kong Connected', { + type: 'token', + action: 'portal_deploy', + }); + + // Set legacy mode for post upload formatting, suppress loader, set monitor portal URL, move to upload view + const guiHost = response.data.configuration.portal_gui_host; + this.setState({ + kongPortalLegacyMode: response.data.configuration.portal_is_legacy, + connectionError: null, + kongPortalDeployView: 'upload', + kongPortalUrl: urlJoin(`http://${guiHost}`, kongPortalUserWorkspace), + }); + + this._handleLoadingToggle(false); + } + } catch (error: unknown) { + if (error instanceof Error) { + trackSegmentEvent('Kong Connected', { + type: 'token', + action: 'portal_deploy', + error: error.message, + }); + console.log('Connection error', error); + this._handleLoadingToggle(false); + this.setState({ connectionError: error }); + } + } + } + + async componentDidMount() { + const newState = { ...defaultPersistedState }; + for (const key in newState) { + const value = await this.props.store.getItem(key); + newState[key as keyof PersistedState] = String(value); + } + this.setState(newState); + } + + async componentDidUpdate() { + for (const key in defaultPersistedState) { + await this.props.store.setItem( + key, + this.state[key as keyof PersistedState] + ); + } + } + + async _handleKongPortalApiUrlChange(e: SyntheticEvent) { + this.setState({ kongPortalApiUrl: e.currentTarget.value }); + } + + async _handleRBACKTokenChange(e: SyntheticEvent) { + this.setState({ kongPortalRbacToken: e.currentTarget.value }); + } + + async _handleKongPortalUserWorkspaceChange( + e: SyntheticEvent + ) { + this.setState({ kongPortalUserWorkspace: e.currentTarget.value }); + } + + render() { + const { + insomniaComponents: { Button }, + } = this.props; + const { + kongPortalApiUrl, + kongSpecFileName, + kongPortalUserWorkspace, + kongPortalDeployView, + connectionError, + kongPortalRbacToken, + isLoading, + showUploadError, + kongPortalLegacyMode, + kongPortalUrl, + kongPortalDeployError, + } = this.state; + + // Check input > enable connection & upload + const connectIsEnabled = + kongPortalApiUrl.length > 0 && kongPortalUserWorkspace.length > 0; + const uploadIsEnabled = kongSpecFileName.length > 0; + + // Check view + if (kongPortalDeployView === 'edit') { + let connectionErrorElement: JSX.Element | null = null; + + if (connectionError) { + const stack = connectionError.stack; + let messageToShow = stack; + if (isAxiosError(connectionError) && connectionError.response) { + const response = connectionError.response; + messageToShow = `${response.status} ${response.statusText}`; + const responseMessage = response.data?.message; + if (responseMessage) { + messageToShow += `: ${responseMessage}`; + } + } + + connectionErrorElement = ( +

+ Error. Please check your settings and try again. +

+ More details + 
+                  {messageToShow}
+
+
+

+ ); + } + return ( + // Kong Connection Details + + {connectionErrorElement} +
+ +
+ +
+ +
+
+ + +
+
+ ); + } else if (kongPortalDeployView === 'upload') { + return ( + // File Name > Upload +
- Connected to Kong - - Edit Connection - -

- {showUploadError && ( -

The file already exists on this workspace.

- )} -
- + Connected to Kong + + Edit Connection + +

+ {showUploadError && ( +

+ The file already exists on this workspace. +

+ )} +
+ +
+
+ + +
+ + ); + } else if (kongPortalDeployView === 'success') { + return ( +
+

+ The Document is now available on + {kongPortalLegacyMode ? ( + 'Dev Portal' + ) : ( + Dev Portal + )} +

+
+ +
-
- - + ); + } else if (kongPortalDeployView === 'error') { + return ( + // File Name > Upload +
+

+ Error uploading spec {kongSpecFileName} to the{' '} + {kongPortalUserWorkspace} workspace.{' '} + {kongPortalDeployError} +

+
+ + +
- - ); - } else if (kongPortalDeployView === 'success') { - return ( -
-

- The Document is now available on - {kongPortalLegacyMode ? 'Dev Portal' : Dev Portal} -

-
- + ); + } else if (kongPortalDeployView === 'overwrite') { + return ( + // File Name > Upload +
+

+ File already exists in workspace. +

+

+ Uploading spec {kongSpecFileName} to the{' '} + {kongPortalUserWorkspace} workspace will + overwrite the existing spec. +

+
+ + +
-
- ); - } else if (kongPortalDeployView === 'error') { - return ( - // File Name > Upload -
-

- Error uploading spec {kongSpecFileName} to the{' '} - {kongPortalUserWorkspace} workspace.{' '} - {kongPortalDeployError} -

-
- - -
-
- ); - } else if (kongPortalDeployView === 'overwrite') { - return ( - // File Name > Upload -
-

File already exists in workspace.

-

- Uploading spec {kongSpecFileName} to the{' '} - {kongPortalUserWorkspace} workspace will overwrite the existing spec. -

-
- - -
-
- ); - } else { - return

Nothing to see here...

; + ); + } else { + return

Nothing to see here...

; + } } } + + return { DeployToPortal }; } diff --git a/plugins/insomnia-plugin-kong-portal/src/document-actions.tsx b/plugins/insomnia-plugin-kong-portal/src/document-actions.tsx index 00cef01e06..cb47269321 100644 --- a/plugins/insomnia-plugin-kong-portal/src/document-actions.tsx +++ b/plugins/insomnia-plugin-kong-portal/src/document-actions.tsx @@ -1,8 +1,8 @@ import axios from 'axios'; -import React from 'react'; -import ReactDOM from 'react-dom'; +import type React from 'react'; +import type ReactDOM from 'react-dom'; -import { DeployToPortal } from './deploy-to-portal'; +import { getDeployToPortalComponent } from './deploy-to-portal'; // This is a temporary shim until insomnia-app exports plugin types that plugin authors can use export interface Spec { @@ -24,7 +24,11 @@ export interface Context { analytics: { trackSegmentEvent: (event: string, properties?: Record) => any; }; - insomniaComponents: any; + loadRendererModules: () => Promise<{ + insomniaComponents: any; + ReactDOM: typeof ReactDOM; + React: typeof React; + }>; }; app: { dialog: (message: string, root: HTMLElement, config: any) => void; @@ -37,22 +41,27 @@ export const documentActions = [ hideAfterClick: true, action(context: Context, spec: Spec) { const root = document.createElement('div'); - ReactDOM.render( - , - root, - ); + const { analytics, axios, loadRendererModules } = context.__private; + loadRendererModules().then(({ React, ReactDOM, insomniaComponents }) => { + const { DeployToPortal } = getDeployToPortalComponent({ React }); - context.app.dialog('Deploy to Dev Portal', root, { - skinny: true, - onHide() { - ReactDOM.unmountComponentAtNode(root); - }, + ReactDOM.render( + , + root, + ); + + context.app.dialog('Deploy to Dev Portal', root, { + skinny: true, + onHide() { + ReactDOM.unmountComponentAtNode(root); + }, + }); }); }, },