From 558b0a9b5c86b60e9bfa74e9efe9b895dea89eb2 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 12:47:31 +0000 Subject: [PATCH 01/54] Remove devcontainer comments --- .devcontainer/devcontainer.json | 14 -------------- 1 file changed, 14 deletions(-) diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index a1385fdf..a81a6bb6 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,21 +1,10 @@ -// For format details, see https://aka.ms/devcontainer.json. For config options, see the -// README at: https://github.com/devcontainers/templates/tree/main/src/javascript-node { "name": "React SDK", - // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile "image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bullseye", - // Features to add to the dev container. More info: https://containers.dev/features. - // "features": {}, - - // Use 'forwardPorts' to make a list of ports inside the container available locally. - // "forwardPorts": [], - - // Use 'postCreateCommand' to run commands after the container is created. "postCreateCommand": "npm install -g npm && yarn install", - // Configure tool-specific properties. "customizations": { "vscode": { "extensions": [ @@ -29,7 +18,4 @@ ] } } - - // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. - // "remoteUser": "root" } From 6f8aa7520ca3b7d1ec94e7a2f3ce2c12baa4dad5 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 12:48:35 +0000 Subject: [PATCH 02/54] Testing bug bash devcontainer config --- .devcontainer/devcontainer.bug-bash.json | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 .devcontainer/devcontainer.bug-bash.json diff --git a/.devcontainer/devcontainer.bug-bash.json b/.devcontainer/devcontainer.bug-bash.json new file mode 100644 index 00000000..bcab2a26 --- /dev/null +++ b/.devcontainer/devcontainer.bug-bash.json @@ -0,0 +1,21 @@ +{ + "name": "React Bug Bash", + + "image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bullseye", + + "postCreateCommand": "npm install -g npm && yarn install && echo 'WELCOME TO THE BUG BASH'", + + "customizations": { + "vscode": { + "extensions": [ + "dbaeumer.vscode-eslint", + "eamodio.gitlens", + "esbenp.prettier-vscode", + "Gruntfuggly.todo-tree", + "github.vscode-github-actions", + "Orta.vscode-jest", + "ms-vscode.test-adapter-converter" + ] + } + } +} From d83ba726730dd3cf6aa1c30cba2d448379ed0d54 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 13:06:57 +0000 Subject: [PATCH 03/54] Remove the separate dev container conf --- .devcontainer/devcontainer.bug-bash.json | 21 --------------------- 1 file changed, 21 deletions(-) delete mode 100644 .devcontainer/devcontainer.bug-bash.json diff --git a/.devcontainer/devcontainer.bug-bash.json b/.devcontainer/devcontainer.bug-bash.json deleted file mode 100644 index bcab2a26..00000000 --- a/.devcontainer/devcontainer.bug-bash.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "React Bug Bash", - - "image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bullseye", - - "postCreateCommand": "npm install -g npm && yarn install && echo 'WELCOME TO THE BUG BASH'", - - "customizations": { - "vscode": { - "extensions": [ - "dbaeumer.vscode-eslint", - "eamodio.gitlens", - "esbenp.prettier-vscode", - "Gruntfuggly.todo-tree", - "github.vscode-github-actions", - "Orta.vscode-jest", - "ms-vscode.test-adapter-converter" - ] - } - } -} From cbb484538293740b1e3c0d8fd07978d06897b643 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 15:53:45 +0000 Subject: [PATCH 04/54] Add setup & exec as npm scripts --- bug-bash/index.js | 16 ++++++++++++++++ bug-bash/setup.sh | 6 ++++++ package.json | 4 +++- 3 files changed, 25 insertions(+), 1 deletion(-) create mode 100644 bug-bash/index.js create mode 100644 bug-bash/setup.sh diff --git a/bug-bash/index.js b/bug-bash/index.js new file mode 100644 index 00000000..407c4873 --- /dev/null +++ b/bug-bash/index.js @@ -0,0 +1,16 @@ +const scenario = process.argv[2]; + +switch(scenario) { + case 'scenario1': + console.log('Running setup for scenario 1...'); + // Code to set up scenario 1 + break; + case 'scenario2': + console.log('Running setup for scenario 2...'); + // Code to set up scenario 2 + break; + // etc. + default: + console.error(`Unknown scenario: ${scenario}`); + process.exit(1); +} \ No newline at end of file diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh new file mode 100644 index 00000000..e9ea6432 --- /dev/null +++ b/bug-bash/setup.sh @@ -0,0 +1,6 @@ +#!/bin/bash + +echo "Welcome to the Bug Bash ๐Ÿž" +echo "Setting up for the bug bash..." + +# TODO: configure container environment below diff --git a/package.json b/package.json index d4d6c1c7..a7302413 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,9 @@ "lint": "tsc --noEmit && eslint 'src/**/*.{js,ts,tsx}' --quiet --fix", "test": "jest --silent", "prepublishOnly": "npm run test && npm run build", - "prepare": "npm run build" + "prepare": "npm run build", + "bug-bash:setup": "sh ./bug-bash/setup.sh", + "bug-bash": "node ./bug-bash/" }, "publishConfig": { "access": "public" From 772fdd4e2cd80745dfaf95f3f1c74c7027a8365e Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:19:39 +0000 Subject: [PATCH 05/54] Use LF by default when in devcontainer --- .devcontainer/devcontainer.json | 37 ++++++++++++++++++--------------- 1 file changed, 20 insertions(+), 17 deletions(-) diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index a81a6bb6..80d0fa17 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,21 +1,24 @@ { - "name": "React SDK", - - "image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bullseye", + "name": "React SDK", - "postCreateCommand": "npm install -g npm && yarn install", + "image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bullseye", - "customizations": { - "vscode": { - "extensions": [ - "dbaeumer.vscode-eslint", - "eamodio.gitlens", - "esbenp.prettier-vscode", - "Gruntfuggly.todo-tree", - "github.vscode-github-actions", - "Orta.vscode-jest", - "ms-vscode.test-adapter-converter" - ] - } - } + "postCreateCommand": "npm install -g npm && yarn install", + + "customizations": { + "vscode": { + "extensions": [ + "dbaeumer.vscode-eslint", + "eamodio.gitlens", + "esbenp.prettier-vscode", + "Gruntfuggly.todo-tree", + "github.vscode-github-actions", + "Orta.vscode-jest", + "ms-vscode.test-adapter-converter" + ], + "settings": { + "files.eol": "\n" + } + } + } } From 2eac90f62295c188bf586b23cb5dd92f315db912 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:26:47 +0000 Subject: [PATCH 06/54] Update jest config --- .vscode/settings.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.vscode/settings.json b/.vscode/settings.json index 43248688..0eb9c9d0 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -4,4 +4,6 @@ "all-tests" ] }, + "jest.jestCommandLine": "./node_modules/.bin/jest", + "jest.autoRevealOutput": "on-exec-error" } \ No newline at end of file From a5df270bc730ff7549f7274655b2739139c93fdb Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:27:22 +0000 Subject: [PATCH 07/54] Update JS SDK via yarn.lock --- yarn.lock | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/yarn.lock b/yarn.lock index 1f7eaa37..9cc64334 100644 --- a/yarn.lock +++ b/yarn.lock @@ -558,10 +558,10 @@ dependencies: uuid "^3.3.2" -"@optimizely/optimizely-sdk@^5.0.0-beta": - version "5.0.0-beta" - resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta.tgz#3290713524707d6328ec2c00a4ec1490410d3bcd" - integrity sha512-WgiZDAJcdRyRPbJlZ96cuVVAF+6IuwK4hzGT6XBPdfRrBm6jLb9oQ3qUhGJMxNBoUFHlaNVnvm/T4lKS/gcy9Q== +"@optimizely/optimizely-sdk@^5.0.0-beta2": + version "5.0.0-beta2" + resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta2.tgz#83eb7ea3fb94ad6e75263c1493f219d3cfff0595" + integrity sha512-UnA5Nk1ZbmpsJoHt2uizJ+Rb0qx6Jrt2+g9rPguzbkr1HMFDiK1apod8+9NVzB98SroXSA+dHTlBc+OAVp7m4w== dependencies: "@optimizely/js-sdk-datafile-manager" "^0.9.5" decompress-response "^4.2.1" From 7d8d053befe9570b3589cc5809b959ec9be67313 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:42:53 +0000 Subject: [PATCH 08/54] Convert to TS for bug bash --- bug-bash/{index.js => index.ts} | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) rename bug-bash/{index.js => index.ts} (79%) diff --git a/bug-bash/index.js b/bug-bash/index.ts similarity index 79% rename from bug-bash/index.js rename to bug-bash/index.ts index 407c4873..7314e0cc 100644 --- a/bug-bash/index.js +++ b/bug-bash/index.ts @@ -1,4 +1,8 @@ -const scenario = process.argv[2]; +import dotenv from 'dotenv'; + +dotenv.config(); + +const scenario: string = process.argv[2]; switch(scenario) { case 'scenario1': From 75fc61016840498fd0961d2f1f584829d5a7caf1 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:43:15 +0000 Subject: [PATCH 09/54] Prompt for SDK key for the bug bash --- bug-bash/setup.sh | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index e9ea6432..57143cc1 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -3,4 +3,8 @@ echo "Welcome to the Bug Bash ๐Ÿž" echo "Setting up for the bug bash..." -# TODO: configure container environment below +# Prompt for SDK key +read -p "Please enter your SDK key: " sdk_key + +# Create .env file or append to existing one +echo "SDK_KEY=$sdk_key" >> .env \ No newline at end of file From 4bf5c51ec71eecbdce396d096441a6cee2adacbd Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 19:44:58 +0000 Subject: [PATCH 10/54] Ignore the .env file --- .gitignore | 1 + 1 file changed, 1 insertion(+) diff --git a/.gitignore b/.gitignore index b2eac095..ddb1a126 100644 --- a/.gitignore +++ b/.gitignore @@ -7,3 +7,4 @@ lib dist/ build/ .rpt2_cache +.env \ No newline at end of file From cca10847a11b637f1b330508b618b74d5ee0cfe3 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 20:23:05 +0000 Subject: [PATCH 11/54] Enhance setup.sh --- bug-bash/setup.sh | 24 +++++++++++++++++++++--- 1 file changed, 21 insertions(+), 3 deletions(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index 57143cc1..481820a3 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -3,8 +3,26 @@ echo "Welcome to the Bug Bash ๐Ÿž" echo "Setting up for the bug bash..." +# Install dotenv via NPM instead of yarn so as not to save to package.json +npm install --no-save --legacy-peer-deps --silent dotenv +# Revert changes to yarn.lock file +git checkout -- yarn.lock + # Prompt for SDK key -read -p "Please enter your SDK key: " sdk_key +echo +echo "\033[1;38;2;0;55;255mPlease enter your SDK key: \033[0m\c" +read sdk_key + +# Check if .env file contains SDK_KEY entry +if grep -q "SDK_KEY" .env; then + # If it does, replace the existing entry + sed -i "s/^SDK_KEY=.*/SDK_KEY=$sdk_key/" .env +else + # If it doesn't, append the new entry + echo "SDK_KEY=$sdk_key" >> .env +fi -# Create .env file or append to existing one -echo "SDK_KEY=$sdk_key" >> .env \ No newline at end of file +echo +echo "\033[1;38;2;59;224;129mReady\033[0m." +echo "Please run \"npm run bug-bash -- \" (note the spaces before & after --)" +echo \ No newline at end of file From 41c0e4113e2140307c4cc0ccc910632073eb3760 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 20:35:56 +0000 Subject: [PATCH 12/54] Conditionally npm --- bug-bash/setup.sh | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index 481820a3..7b310f37 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -3,10 +3,13 @@ echo "Welcome to the Bug Bash ๐Ÿž" echo "Setting up for the bug bash..." -# Install dotenv via NPM instead of yarn so as not to save to package.json -npm install --no-save --legacy-peer-deps --silent dotenv -# Revert changes to yarn.lock file -git checkout -- yarn.lock +# Conditionally add npm packages +if ! node -e "require('dotenv')" > /dev/null 2>&1; then + # Install via NPM instead of yarn so as not to save to package.json + npm install --no-save --legacy-peer-deps --silent dotenv + # Revert changes to yarn.lock file + git checkout -- yarn.lock +fi # Prompt for SDK key echo From 6d67dfe73af9b2a4299d05836dee3270d7905ac3 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 20:36:22 +0000 Subject: [PATCH 13/54] Change back to scripty .js --- bug-bash/{index.ts => index.js} | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) rename bug-bash/{index.ts => index.js} (60%) diff --git a/bug-bash/index.ts b/bug-bash/index.js similarity index 60% rename from bug-bash/index.ts rename to bug-bash/index.js index 7314e0cc..1518796b 100644 --- a/bug-bash/index.ts +++ b/bug-bash/index.js @@ -1,10 +1,14 @@ -import dotenv from 'dotenv'; +// eslint-disable-next-line @typescript-eslint/no-var-requires +const dotenv = require('dotenv'); dotenv.config(); -const scenario: string = process.argv[2]; +const scenario = process.argv[2]; +const sdkKey = process.env.SDK_KEY; -switch(scenario) { +console.log('SDK Key: ', sdkKey); + +switch (scenario) { case 'scenario1': console.log('Running setup for scenario 1...'); // Code to set up scenario 1 @@ -17,4 +21,4 @@ switch(scenario) { default: console.error(`Unknown scenario: ${scenario}`); process.exit(1); -} \ No newline at end of file +} From b014634fd65c2be08c054e48478df6e91fb5284e Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:00:03 +0000 Subject: [PATCH 14/54] Add boilerplate React bug-bash/app --- bug-bash/app/.eslintrc.cjs | 18 + bug-bash/app/.gitignore | 24 + bug-bash/app/README.md | 27 + bug-bash/app/index.html | 13 + bug-bash/app/package-lock.json | 2403 +++++++++++++++++++++++++++++ bug-bash/app/package.json | 28 + bug-bash/app/public/vite.svg | 1 + bug-bash/app/src/App.css | 42 + bug-bash/app/src/App.tsx | 35 + bug-bash/app/src/assets/react.svg | 1 + bug-bash/app/src/index.css | 69 + bug-bash/app/src/main.tsx | 10 + bug-bash/app/src/vite-env.d.ts | 1 + bug-bash/app/tsconfig.json | 25 + bug-bash/app/tsconfig.node.json | 10 + bug-bash/app/vite.config.ts | 7 + 16 files changed, 2714 insertions(+) create mode 100644 bug-bash/app/.eslintrc.cjs create mode 100644 bug-bash/app/.gitignore create mode 100644 bug-bash/app/README.md create mode 100644 bug-bash/app/index.html create mode 100644 bug-bash/app/package-lock.json create mode 100644 bug-bash/app/package.json create mode 100644 bug-bash/app/public/vite.svg create mode 100644 bug-bash/app/src/App.css create mode 100644 bug-bash/app/src/App.tsx create mode 100644 bug-bash/app/src/assets/react.svg create mode 100644 bug-bash/app/src/index.css create mode 100644 bug-bash/app/src/main.tsx create mode 100644 bug-bash/app/src/vite-env.d.ts create mode 100644 bug-bash/app/tsconfig.json create mode 100644 bug-bash/app/tsconfig.node.json create mode 100644 bug-bash/app/vite.config.ts diff --git a/bug-bash/app/.eslintrc.cjs b/bug-bash/app/.eslintrc.cjs new file mode 100644 index 00000000..d6c95379 --- /dev/null +++ b/bug-bash/app/.eslintrc.cjs @@ -0,0 +1,18 @@ +module.exports = { + root: true, + env: { browser: true, es2020: true }, + extends: [ + 'eslint:recommended', + 'plugin:@typescript-eslint/recommended', + 'plugin:react-hooks/recommended', + ], + ignorePatterns: ['dist', '.eslintrc.cjs'], + parser: '@typescript-eslint/parser', + plugins: ['react-refresh'], + rules: { + 'react-refresh/only-export-components': [ + 'warn', + { allowConstantExport: true }, + ], + }, +} diff --git a/bug-bash/app/.gitignore b/bug-bash/app/.gitignore new file mode 100644 index 00000000..a547bf36 --- /dev/null +++ b/bug-bash/app/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/bug-bash/app/README.md b/bug-bash/app/README.md new file mode 100644 index 00000000..1ebe379f --- /dev/null +++ b/bug-bash/app/README.md @@ -0,0 +1,27 @@ +# React + TypeScript + Vite + +This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. + +Currently, two official plugins are available: + +- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh +- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh + +## Expanding the ESLint configuration + +If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: + +- Configure the top-level `parserOptions` property like this: + +```js + parserOptions: { + ecmaVersion: 'latest', + sourceType: 'module', + project: ['./tsconfig.json', './tsconfig.node.json'], + tsconfigRootDir: __dirname, + }, +``` + +- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked` +- Optionally add `plugin:@typescript-eslint/stylistic-type-checked` +- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list diff --git a/bug-bash/app/index.html b/bug-bash/app/index.html new file mode 100644 index 00000000..e4b78eae --- /dev/null +++ b/bug-bash/app/index.html @@ -0,0 +1,13 @@ + + + + + + + Vite + React + TS + + +
+ + + diff --git a/bug-bash/app/package-lock.json b/bug-bash/app/package-lock.json new file mode 100644 index 00000000..d6ed4bae --- /dev/null +++ b/bug-bash/app/package-lock.json @@ -0,0 +1,2403 @@ +{ + "name": "app", + "version": "0.0.0", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "app", + "version": "0.0.0", + "dependencies": { + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.2.15", + "@types/react-dom": "^18.2.7", + "@typescript-eslint/eslint-plugin": "^6.0.0", + "@typescript-eslint/parser": "^6.0.0", + "@vitejs/plugin-react-swc": "^3.3.2", + "eslint": "^8.45.0", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-refresh": "^0.4.3", + "typescript": "^5.0.2", + "vite": "^4.4.5" + } + }, + "node_modules/@aashutoshrathi/word-wrap": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz", + "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/@esbuild/android-arm": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.18.17.tgz", + "integrity": "sha512-wHsmJG/dnL3OkpAcwbgoBTTMHVi4Uyou3F5mf58ZtmUyIKfcdA7TROav/6tCzET4A3QW2Q2FC+eFneMU+iyOxg==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/android-arm64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.18.17.tgz", + "integrity": "sha512-9np+YYdNDed5+Jgr1TdWBsozZ85U1Oa3xW0c7TWqH0y2aGghXtZsuT8nYRbzOMcl0bXZXjOGbksoTtVOlWrRZg==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/android-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.18.17.tgz", + "integrity": "sha512-O+FeWB/+xya0aLg23hHEM2E3hbfwZzjqumKMSIqcHbNvDa+dza2D0yLuymRBQQnC34CWrsJUXyH2MG5VnLd6uw==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "android" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/darwin-arm64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.18.17.tgz", + "integrity": "sha512-M9uJ9VSB1oli2BE/dJs3zVr9kcCBBsE883prage1NWz6pBS++1oNn/7soPNS3+1DGj0FrkSvnED4Bmlu1VAE9g==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/darwin-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.18.17.tgz", + "integrity": "sha512-XDre+J5YeIJDMfp3n0279DFNrGCXlxOuGsWIkRb1NThMZ0BsrWXoTg23Jer7fEXQ9Ye5QjrvXpxnhzl3bHtk0g==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/freebsd-arm64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.17.tgz", + "integrity": "sha512-cjTzGa3QlNfERa0+ptykyxs5A6FEUQQF0MuilYXYBGdBxD3vxJcKnzDlhDCa1VAJCmAxed6mYhA2KaJIbtiNuQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/freebsd-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.18.17.tgz", + "integrity": "sha512-sOxEvR8d7V7Kw8QqzxWc7bFfnWnGdaFBut1dRUYtu+EIRXefBc/eIsiUiShnW0hM3FmQ5Zf27suDuHsKgZ5QrA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-arm": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.18.17.tgz", + "integrity": "sha512-2d3Lw6wkwgSLC2fIvXKoMNGVaeY8qdN0IC3rfuVxJp89CRfA3e3VqWifGDfuakPmp90+ZirmTfye1n4ncjv2lg==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-arm64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.18.17.tgz", + "integrity": "sha512-c9w3tE7qA3CYWjT+M3BMbwMt+0JYOp3vCMKgVBrCl1nwjAlOMYzEo+gG7QaZ9AtqZFj5MbUc885wuBBmu6aADQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-ia32": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.18.17.tgz", + "integrity": "sha512-1DS9F966pn5pPnqXYz16dQqWIB0dmDfAQZd6jSSpiT9eX1NzKh07J6VKR3AoXXXEk6CqZMojiVDSZi1SlmKVdg==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-loong64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.18.17.tgz", + "integrity": "sha512-EvLsxCk6ZF0fpCB6w6eOI2Fc8KW5N6sHlIovNe8uOFObL2O+Mr0bflPHyHwLT6rwMg9r77WOAWb2FqCQrVnwFg==", + "cpu": [ + "loong64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-mips64el": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.18.17.tgz", + "integrity": "sha512-e0bIdHA5p6l+lwqTE36NAW5hHtw2tNRmHlGBygZC14QObsA3bD4C6sXLJjvnDIjSKhW1/0S3eDy+QmX/uZWEYQ==", + "cpu": [ + "mips64el" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-ppc64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.18.17.tgz", + "integrity": "sha512-BAAilJ0M5O2uMxHYGjFKn4nJKF6fNCdP1E0o5t5fvMYYzeIqy2JdAP88Az5LHt9qBoUa4tDaRpfWt21ep5/WqQ==", + "cpu": [ + "ppc64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-riscv64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.18.17.tgz", + "integrity": "sha512-Wh/HW2MPnC3b8BqRSIme/9Zhab36PPH+3zam5pqGRH4pE+4xTrVLx2+XdGp6fVS3L2x+DrsIcsbMleex8fbE6g==", + "cpu": [ + "riscv64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-s390x": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.18.17.tgz", + "integrity": "sha512-j/34jAl3ul3PNcK3pfI0NSlBANduT2UO5kZ7FCaK33XFv3chDhICLY8wJJWIhiQ+YNdQ9dxqQctRg2bvrMlYgg==", + "cpu": [ + "s390x" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/linux-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.18.17.tgz", + "integrity": "sha512-QM50vJ/y+8I60qEmFxMoxIx4de03pGo2HwxdBeFd4nMh364X6TIBZ6VQ5UQmPbQWUVWHWws5MmJXlHAXvJEmpQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/netbsd-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.18.17.tgz", + "integrity": "sha512-/jGlhWR7Sj9JPZHzXyyMZ1RFMkNPjC6QIAan0sDOtIo2TYk3tZn5UDrkE0XgsTQCxWTTOcMPf9p6Rh2hXtl5TQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "netbsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/openbsd-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.18.17.tgz", + "integrity": "sha512-rSEeYaGgyGGf4qZM2NonMhMOP/5EHp4u9ehFiBrg7stH6BYEEjlkVREuDEcQ0LfIl53OXLxNbfuIj7mr5m29TA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "openbsd" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/sunos-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.18.17.tgz", + "integrity": "sha512-Y7ZBbkLqlSgn4+zot4KUNYst0bFoO68tRgI6mY2FIM+b7ZbyNVtNbDP5y8qlu4/knZZ73fgJDlXID+ohY5zt5g==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "sunos" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/win32-arm64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.18.17.tgz", + "integrity": "sha512-bwPmTJsEQcbZk26oYpc4c/8PvTY3J5/QK8jM19DVlEsAB41M39aWovWoHtNm78sd6ip6prilxeHosPADXtEJFw==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/win32-ia32": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.18.17.tgz", + "integrity": "sha512-H/XaPtPKli2MhW+3CQueo6Ni3Avggi6hP/YvgkEe1aSaxw+AeO8MFjq8DlgfTd9Iz4Yih3QCZI6YLMoyccnPRg==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@esbuild/win32-x64": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.18.17.tgz", + "integrity": "sha512-fGEb8f2BSA3CW7riJVurug65ACLuQAzKq0SSqkY2b2yHHH0MzDfbLyKIGzHwOI/gkHcxM/leuSW6D5w/LMNitA==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=12" + } + }, + "node_modules/@eslint-community/eslint-utils": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", + "integrity": "sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==", + "dev": true, + "dependencies": { + "eslint-visitor-keys": "^3.3.0" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "peerDependencies": { + "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0" + } + }, + "node_modules/@eslint-community/regexpp": { + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.6.2.tgz", + "integrity": "sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw==", + "dev": true, + "engines": { + "node": "^12.0.0 || ^14.0.0 || >=16.0.0" + } + }, + "node_modules/@eslint/eslintrc": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.1.1.tgz", + "integrity": "sha512-9t7ZA7NGGK8ckelF0PQCfcxIUzs1Md5rrO6U/c+FIQNanea5UZC0wqKXH4vHBccmu4ZJgZ2idtPeW7+Q2npOEA==", + "dev": true, + "dependencies": { + "ajv": "^6.12.4", + "debug": "^4.3.2", + "espree": "^9.6.0", + "globals": "^13.19.0", + "ignore": "^5.2.0", + "import-fresh": "^3.2.1", + "js-yaml": "^4.1.0", + "minimatch": "^3.1.2", + "strip-json-comments": "^3.1.1" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/@eslint/js": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.46.0.tgz", + "integrity": "sha512-a8TLtmPi8xzPkCbp/OGFUo5yhRkHM2Ko9kOWP4znJr0WAhWyThaw3PnwX4vOTWOAMsV2uRt32PPDcEz63esSaA==", + "dev": true, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + } + }, + "node_modules/@humanwhocodes/config-array": { + "version": "0.11.10", + "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.10.tgz", + "integrity": "sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==", + "dev": true, + "dependencies": { + "@humanwhocodes/object-schema": "^1.2.1", + "debug": "^4.1.1", + "minimatch": "^3.0.5" + }, + "engines": { + "node": ">=10.10.0" + } + }, + "node_modules/@humanwhocodes/module-importer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz", + "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==", + "dev": true, + "engines": { + "node": ">=12.22" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/nzakas" + } + }, + "node_modules/@humanwhocodes/object-schema": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz", + "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", + "dev": true + }, + "node_modules/@nodelib/fs.scandir": { + "version": "2.1.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dev": true, + "dependencies": { + "@nodelib/fs.stat": "2.0.5", + "run-parallel": "^1.1.9" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.stat": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.walk": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dev": true, + "dependencies": { + "@nodelib/fs.scandir": "2.1.5", + "fastq": "^1.6.0" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@swc/core": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.74.tgz", + "integrity": "sha512-P+MIExOTdWlfq8Heb1/NhBAke6UTckd4cRDuJoFcFMGBRvgoCMNWhnfP3FRRXPLI7GGg27dRZS+xHiqYyQmSrA==", + "dev": true, + "hasInstallScript": true, + "engines": { + "node": ">=10" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/swc" + }, + "optionalDependencies": { + "@swc/core-darwin-arm64": "1.3.74", + "@swc/core-darwin-x64": "1.3.74", + "@swc/core-linux-arm-gnueabihf": "1.3.74", + "@swc/core-linux-arm64-gnu": "1.3.74", + "@swc/core-linux-arm64-musl": "1.3.74", + "@swc/core-linux-x64-gnu": "1.3.74", + "@swc/core-linux-x64-musl": "1.3.74", + "@swc/core-win32-arm64-msvc": "1.3.74", + "@swc/core-win32-ia32-msvc": "1.3.74", + "@swc/core-win32-x64-msvc": "1.3.74" + }, + "peerDependencies": { + "@swc/helpers": "^0.5.0" + }, + "peerDependenciesMeta": { + "@swc/helpers": { + "optional": true + } + } + }, + "node_modules/@swc/core-darwin-arm64": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.3.74.tgz", + "integrity": "sha512-2rMV4QxM583jXcREfo0MhV3Oj5pgRSfSh/kVrB1twL2rQxOrbzkAPT/8flmygdVoL4f2F7o1EY5lKlYxEBiIKQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-darwin-x64": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.74.tgz", + "integrity": "sha512-KKEGE1wXneYXe15fWDRM8/oekd/Q4yAuccA0vWY/7i6nOSPqWYcSDR0nRtR030ltDxWt0rk/eCTmNkrOWrKs3A==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm-gnueabihf": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.74.tgz", + "integrity": "sha512-HehH5DR6r/5fIVu7tu8ZqgrHkhSCQNewf1ztFQJgcmaQWn+H4AJERBjwkjosqh4TvUJucZv8vyRTvrFeBXaCSA==", + "cpu": [ + "arm" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm64-gnu": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.74.tgz", + "integrity": "sha512-+xkbCRz/wczgdknoV4NwYxbRI2dD7x/qkIFcVM2buzLCq8oWLweuV8+aL4pRqu0qDh7ZSb1jcaVTUIsySCJznA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-arm64-musl": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.74.tgz", + "integrity": "sha512-maKFZSCD3tQznzPV7T3V+TtiWZFEFM8YrnSS5fQNNb+K9J65sL+170uTb3M7H4cFkG+9Sm5k5yCrCIutlvV48g==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-x64-gnu": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.74.tgz", + "integrity": "sha512-LEXpcShF6DLTWJSiBhMSYZkLQ27UvaQ24fCFhoIV/R3dhYaUpHmIyLPPBNC82T03lB3ONUFVwrRw6fxDJ/f00A==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-linux-x64-musl": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.74.tgz", + "integrity": "sha512-sxsFctbFMZEFmDE7CmYljG0dMumH8XBTwwtGr8s6z0fYAzXBGNq2AFPcmEh2np9rPWkt7pE1m0ByESD+dMkbxQ==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-arm64-msvc": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.74.tgz", + "integrity": "sha512-F7hY9/BjFCozA4YPFYFH5FGCyWwa44vIXHqG66F5cDwXDGFn8ZtBsYIsiPfUYcx0AeAo1ojnVWKPxokZhYNYqA==", + "cpu": [ + "arm64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-ia32-msvc": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.74.tgz", + "integrity": "sha512-qBAsiD1AlIdqED6wy3UNRHyAys9pWMUidX0LJ6mj24r/vfrzzTBAUrLJe5m7bzE+F1Rgi001avYJeEW1DLEJ+Q==", + "cpu": [ + "ia32" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@swc/core-win32-x64-msvc": { + "version": "1.3.74", + "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.74.tgz", + "integrity": "sha512-S3YAvvLprTnPRwQuy9Dkwubb5SRLpVK3JJsqYDbGfgj8PGQyKHZcVJ5X3nfFsoWLy3j9B/3Os2nawprRSzeC5A==", + "cpu": [ + "x64" + ], + "dev": true, + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">=10" + } + }, + "node_modules/@types/json-schema": { + "version": "7.0.12", + "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.12.tgz", + "integrity": "sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==", + "dev": true + }, + "node_modules/@types/prop-types": { + "version": "15.7.5", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", + "dev": true + }, + "node_modules/@types/react": { + "version": "18.2.18", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.18.tgz", + "integrity": "sha512-da4NTSeBv/P34xoZPhtcLkmZuJ+oYaCxHmyHzwaDQo9RQPBeXV+06gEk2FpqEcsX9XrnNLvRpVh6bdavDSjtiQ==", + "dev": true, + "dependencies": { + "@types/prop-types": "*", + "@types/scheduler": "*", + "csstype": "^3.0.2" + } + }, + "node_modules/@types/react-dom": { + "version": "18.2.7", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.7.tgz", + "integrity": "sha512-GRaAEriuT4zp9N4p1i8BDBYmEyfo+xQ3yHjJU4eiK5NDa1RmUZG+unZABUTK4/Ox/M+GaHwb6Ow8rUITrtjszA==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, + "node_modules/@types/scheduler": { + "version": "0.16.3", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==", + "dev": true + }, + "node_modules/@types/semver": { + "version": "7.5.0", + "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.0.tgz", + "integrity": "sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==", + "dev": true + }, + "node_modules/@typescript-eslint/eslint-plugin": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.2.1.tgz", + "integrity": "sha512-iZVM/ALid9kO0+I81pnp1xmYiFyqibAHzrqX4q5YvvVEyJqY+e6rfTXSCsc2jUxGNqJqTfFSSij/NFkZBiBzLw==", + "dev": true, + "dependencies": { + "@eslint-community/regexpp": "^4.5.1", + "@typescript-eslint/scope-manager": "6.2.1", + "@typescript-eslint/type-utils": "6.2.1", + "@typescript-eslint/utils": "6.2.1", + "@typescript-eslint/visitor-keys": "6.2.1", + "debug": "^4.3.4", + "graphemer": "^1.4.0", + "ignore": "^5.2.4", + "natural-compare": "^1.4.0", + "natural-compare-lite": "^1.4.0", + "semver": "^7.5.4", + "ts-api-utils": "^1.0.1" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "@typescript-eslint/parser": "^6.0.0 || ^6.0.0-alpha", + "eslint": "^7.0.0 || ^8.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@typescript-eslint/parser": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.2.1.tgz", + "integrity": "sha512-Ld+uL1kYFU8e6btqBFpsHkwQ35rw30IWpdQxgOqOh4NfxSDH6uCkah1ks8R/RgQqI5hHPXMaLy9fbFseIe+dIg==", + "dev": true, + "dependencies": { + "@typescript-eslint/scope-manager": "6.2.1", + "@typescript-eslint/types": "6.2.1", + "@typescript-eslint/typescript-estree": "6.2.1", + "@typescript-eslint/visitor-keys": "6.2.1", + "debug": "^4.3.4" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^7.0.0 || ^8.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@typescript-eslint/scope-manager": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.2.1.tgz", + "integrity": "sha512-UCqBF9WFqv64xNsIEPfBtenbfodPXsJ3nPAr55mGPkQIkiQvgoWNo+astj9ZUfJfVKiYgAZDMnM6dIpsxUMp3Q==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "6.2.1", + "@typescript-eslint/visitor-keys": "6.2.1" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/@typescript-eslint/type-utils": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-6.2.1.tgz", + "integrity": "sha512-fTfCgomBMIgu2Dh2Or3gMYgoNAnQm3RLtRp+jP7A8fY+LJ2+9PNpi5p6QB5C4RSP+U3cjI0vDlI3mspAkpPVbQ==", + "dev": true, + "dependencies": { + "@typescript-eslint/typescript-estree": "6.2.1", + "@typescript-eslint/utils": "6.2.1", + "debug": "^4.3.4", + "ts-api-utils": "^1.0.1" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^7.0.0 || ^8.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@typescript-eslint/types": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-6.2.1.tgz", + "integrity": "sha512-528bGcoelrpw+sETlyM91k51Arl2ajbNT9L4JwoXE2dvRe1yd8Q64E4OL7vHYw31mlnVsf+BeeLyAZUEQtqahQ==", + "dev": true, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/@typescript-eslint/typescript-estree": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-6.2.1.tgz", + "integrity": "sha512-G+UJeQx9AKBHRQBpmvr8T/3K5bJa485eu+4tQBxFq0KoT22+jJyzo1B50JDT9QdC1DEmWQfdKsa8ybiNWYsi0Q==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "6.2.1", + "@typescript-eslint/visitor-keys": "6.2.1", + "debug": "^4.3.4", + "globby": "^11.1.0", + "is-glob": "^4.0.3", + "semver": "^7.5.4", + "ts-api-utils": "^1.0.1" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@typescript-eslint/utils": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-6.2.1.tgz", + "integrity": "sha512-eBIXQeupYmxVB6S7x+B9SdBeB6qIdXKjgQBge2J+Ouv8h9Cxm5dHf/gfAZA6dkMaag+03HdbVInuXMmqFB/lKQ==", + "dev": true, + "dependencies": { + "@eslint-community/eslint-utils": "^4.4.0", + "@types/json-schema": "^7.0.12", + "@types/semver": "^7.5.0", + "@typescript-eslint/scope-manager": "6.2.1", + "@typescript-eslint/types": "6.2.1", + "@typescript-eslint/typescript-estree": "6.2.1", + "semver": "^7.5.4" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^7.0.0 || ^8.0.0" + } + }, + "node_modules/@typescript-eslint/visitor-keys": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-6.2.1.tgz", + "integrity": "sha512-iTN6w3k2JEZ7cyVdZJTVJx2Lv7t6zFA8DCrJEHD2mwfc16AEvvBWVhbFh34XyG2NORCd0viIgQY1+u7kPI0WpA==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "6.2.1", + "eslint-visitor-keys": "^3.4.1" + }, + "engines": { + "node": "^16.0.0 || >=18.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/@vitejs/plugin-react-swc": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-3.3.2.tgz", + "integrity": "sha512-VJFWY5sfoZerQRvJrh518h3AcQt6f/yTuWn4/TRB+dqmYU0NX1qz7qM5Wfd+gOQqUzQW4gxKqKN3KpE/P3+zrA==", + "dev": true, + "dependencies": { + "@swc/core": "^1.3.61" + }, + "peerDependencies": { + "vite": "^4" + } + }, + "node_modules/acorn": { + "version": "8.10.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz", + "integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==", + "dev": true, + "bin": { + "acorn": "bin/acorn" + }, + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/acorn-jsx": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", + "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", + "dev": true, + "peerDependencies": { + "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" + } + }, + "node_modules/ajv": { + "version": "6.12.6", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", + "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "dev": true, + "dependencies": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/ansi-styles": { + "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" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/argparse": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", + "dev": true + }, + "node_modules/array-union": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz", + "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/balanced-match": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", + "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true + }, + "node_modules/brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "dependencies": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "node_modules/braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dev": true, + "dependencies": { + "fill-range": "^7.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/callsites": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", + "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==", + "dev": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true + }, + "node_modules/concat-map": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", + "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", + "dev": true + }, + "node_modules/cross-spawn": { + "version": "7.0.3", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", + "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", + "dev": true, + "dependencies": { + "path-key": "^3.1.0", + "shebang-command": "^2.0.0", + "which": "^2.0.1" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/csstype": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", + "dev": true + }, + "node_modules/debug": { + "version": "4.3.4", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", + "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", + "dev": true, + "dependencies": { + "ms": "2.1.2" + }, + "engines": { + "node": ">=6.0" + }, + "peerDependenciesMeta": { + "supports-color": { + "optional": true + } + } + }, + "node_modules/deep-is": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz", + "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==", + "dev": true + }, + "node_modules/dir-glob": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", + "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", + "dev": true, + "dependencies": { + "path-type": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/doctrine": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz", + "integrity": "sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==", + "dev": true, + "dependencies": { + "esutils": "^2.0.2" + }, + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/esbuild": { + "version": "0.18.17", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz", + "integrity": "sha512-1GJtYnUxsJreHYA0Y+iQz2UEykonY66HNWOb0yXYZi9/kNrORUEHVg87eQsCtqh59PEJ5YVZJO98JHznMJSWjg==", + "dev": true, + "hasInstallScript": true, + "bin": { + "esbuild": "bin/esbuild" + }, + "engines": { + "node": ">=12" + }, + "optionalDependencies": { + "@esbuild/android-arm": "0.18.17", + "@esbuild/android-arm64": "0.18.17", + "@esbuild/android-x64": "0.18.17", + "@esbuild/darwin-arm64": "0.18.17", + "@esbuild/darwin-x64": "0.18.17", + "@esbuild/freebsd-arm64": "0.18.17", + "@esbuild/freebsd-x64": "0.18.17", + "@esbuild/linux-arm": "0.18.17", + "@esbuild/linux-arm64": "0.18.17", + "@esbuild/linux-ia32": "0.18.17", + "@esbuild/linux-loong64": "0.18.17", + "@esbuild/linux-mips64el": "0.18.17", + "@esbuild/linux-ppc64": "0.18.17", + "@esbuild/linux-riscv64": "0.18.17", + "@esbuild/linux-s390x": "0.18.17", + "@esbuild/linux-x64": "0.18.17", + "@esbuild/netbsd-x64": "0.18.17", + "@esbuild/openbsd-x64": "0.18.17", + "@esbuild/sunos-x64": "0.18.17", + "@esbuild/win32-arm64": "0.18.17", + "@esbuild/win32-ia32": "0.18.17", + "@esbuild/win32-x64": "0.18.17" + } + }, + "node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/eslint": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.46.0.tgz", + "integrity": "sha512-cIO74PvbW0qU8e0mIvk5IV3ToWdCq5FYG6gWPHHkx6gNdjlbAYvtfHmlCMXxjcoVaIdwy/IAt3+mDkZkfvb2Dg==", + "dev": true, + "dependencies": { + "@eslint-community/eslint-utils": "^4.2.0", + "@eslint-community/regexpp": "^4.6.1", + "@eslint/eslintrc": "^2.1.1", + "@eslint/js": "^8.46.0", + "@humanwhocodes/config-array": "^0.11.10", + "@humanwhocodes/module-importer": "^1.0.1", + "@nodelib/fs.walk": "^1.2.8", + "ajv": "^6.12.4", + "chalk": "^4.0.0", + "cross-spawn": "^7.0.2", + "debug": "^4.3.2", + "doctrine": "^3.0.0", + "escape-string-regexp": "^4.0.0", + "eslint-scope": "^7.2.2", + "eslint-visitor-keys": "^3.4.2", + "espree": "^9.6.1", + "esquery": "^1.4.2", + "esutils": "^2.0.2", + "fast-deep-equal": "^3.1.3", + "file-entry-cache": "^6.0.1", + "find-up": "^5.0.0", + "glob-parent": "^6.0.2", + "globals": "^13.19.0", + "graphemer": "^1.4.0", + "ignore": "^5.2.0", + "imurmurhash": "^0.1.4", + "is-glob": "^4.0.0", + "is-path-inside": "^3.0.3", + "js-yaml": "^4.1.0", + "json-stable-stringify-without-jsonify": "^1.0.1", + "levn": "^0.4.1", + "lodash.merge": "^4.6.2", + "minimatch": "^3.1.2", + "natural-compare": "^1.4.0", + "optionator": "^0.9.3", + "strip-ansi": "^6.0.1", + "text-table": "^0.2.0" + }, + "bin": { + "eslint": "bin/eslint.js" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/eslint-plugin-react-hooks": { + "version": "4.6.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", + "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==", + "dev": true, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0" + } + }, + "node_modules/eslint-plugin-react-refresh": { + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.3.tgz", + "integrity": "sha512-Hh0wv8bUNY877+sI0BlCUlsS0TYYQqvzEwJsJJPM2WF4RnTStSnSR3zdJYa2nPOJgg3UghXi54lVyMSmpCalzA==", + "dev": true, + "peerDependencies": { + "eslint": ">=7" + } + }, + "node_modules/eslint-scope": { + "version": "7.2.2", + "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz", + "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==", + "dev": true, + "dependencies": { + "esrecurse": "^4.3.0", + "estraverse": "^5.2.0" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/eslint-visitor-keys": { + "version": "3.4.2", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.2.tgz", + "integrity": "sha512-8drBzUEyZ2llkpCA67iYrgEssKDUu68V8ChqqOfFupIaG/LCVPUT+CoGJpT77zJprs4T/W7p07LP7zAIMuweVw==", + "dev": true, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/espree": { + "version": "9.6.1", + "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz", + "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==", + "dev": true, + "dependencies": { + "acorn": "^8.9.0", + "acorn-jsx": "^5.3.2", + "eslint-visitor-keys": "^3.4.1" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/esquery": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.5.0.tgz", + "integrity": "sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==", + "dev": true, + "dependencies": { + "estraverse": "^5.1.0" + }, + "engines": { + "node": ">=0.10" + } + }, + "node_modules/esrecurse": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz", + "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==", + "dev": true, + "dependencies": { + "estraverse": "^5.2.0" + }, + "engines": { + "node": ">=4.0" + } + }, + "node_modules/estraverse": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz", + "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==", + "dev": true, + "engines": { + "node": ">=4.0" + } + }, + "node_modules/esutils": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", + "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/fast-deep-equal": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", + "dev": true + }, + "node_modules/fast-glob": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.1.tgz", + "integrity": "sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==", + "dev": true, + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.4" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/fast-glob/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/fast-json-stable-stringify": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", + "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", + "dev": true + }, + "node_modules/fast-levenshtein": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz", + "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==", + "dev": true + }, + "node_modules/fastq": { + "version": "1.15.0", + "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz", + "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==", + "dev": true, + "dependencies": { + "reusify": "^1.0.4" + } + }, + "node_modules/file-entry-cache": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz", + "integrity": "sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==", + "dev": true, + "dependencies": { + "flat-cache": "^3.0.4" + }, + "engines": { + "node": "^10.12.0 || >=12.0.0" + } + }, + "node_modules/fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dev": true, + "dependencies": { + "to-regex-range": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/find-up": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", + "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==", + "dev": true, + "dependencies": { + "locate-path": "^6.0.0", + "path-exists": "^4.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/flat-cache": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz", + "integrity": "sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==", + "dev": true, + "dependencies": { + "flatted": "^3.1.0", + "rimraf": "^3.0.2" + }, + "engines": { + "node": "^10.12.0 || >=12.0.0" + } + }, + "node_modules/flatted": { + "version": "3.2.7", + "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.2.7.tgz", + "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==", + "dev": true + }, + "node_modules/fs.realpath": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", + "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", + "dev": true + }, + "node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, + "dependencies": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + }, + "engines": { + "node": "*" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/glob-parent": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", + "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==", + "dev": true, + "dependencies": { + "is-glob": "^4.0.3" + }, + "engines": { + "node": ">=10.13.0" + } + }, + "node_modules/globals": { + "version": "13.20.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-13.20.0.tgz", + "integrity": "sha512-Qg5QtVkCy/kv3FUSlu4ukeZDVf9ee0iXLAUYX13gbR17bnejFTzr4iS9bY7kwCf1NztRNm1t91fjOiyx4CSwPQ==", + "dev": true, + "dependencies": { + "type-fest": "^0.20.2" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/globby": { + "version": "11.1.0", + "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz", + "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", + "dev": true, + "dependencies": { + "array-union": "^2.1.0", + "dir-glob": "^3.0.1", + "fast-glob": "^3.2.9", + "ignore": "^5.2.0", + "merge2": "^1.4.1", + "slash": "^3.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/graphemer": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz", + "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==", + "dev": true + }, + "node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/ignore": { + "version": "5.2.4", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz", + "integrity": "sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==", + "dev": true, + "engines": { + "node": ">= 4" + } + }, + "node_modules/import-fresh": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", + "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==", + "dev": true, + "dependencies": { + "parent-module": "^1.0.0", + "resolve-from": "^4.0.0" + }, + "engines": { + "node": ">=6" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/imurmurhash": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz", + "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==", + "dev": true, + "engines": { + "node": ">=0.8.19" + } + }, + "node_modules/inflight": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", + "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==", + "dev": true, + "dependencies": { + "once": "^1.3.0", + "wrappy": "1" + } + }, + "node_modules/inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", + "dev": true + }, + "node_modules/is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "dependencies": { + "is-extglob": "^2.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "dev": true, + "engines": { + "node": ">=0.12.0" + } + }, + "node_modules/is-path-inside": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz", + "integrity": "sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/isexe": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", + "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==", + "dev": true + }, + "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==" + }, + "node_modules/js-yaml": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz", + "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", + "dev": true, + "dependencies": { + "argparse": "^2.0.1" + }, + "bin": { + "js-yaml": "bin/js-yaml.js" + } + }, + "node_modules/json-schema-traverse": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", + "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==", + "dev": true + }, + "node_modules/json-stable-stringify-without-jsonify": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz", + "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==", + "dev": true + }, + "node_modules/levn": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz", + "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==", + "dev": true, + "dependencies": { + "prelude-ls": "^1.2.1", + "type-check": "~0.4.0" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/locate-path": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", + "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==", + "dev": true, + "dependencies": { + "p-locate": "^5.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/lodash.merge": { + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz", + "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==", + "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==", + "dependencies": { + "js-tokens": "^3.0.0 || ^4.0.0" + }, + "bin": { + "loose-envify": "cli.js" + } + }, + "node_modules/lru-cache": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", + "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", + "dev": true, + "dependencies": { + "yallist": "^4.0.0" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/merge2": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, + "node_modules/micromatch": { + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz", + "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==", + "dev": true, + "dependencies": { + "braces": "^3.0.2", + "picomatch": "^2.3.1" + }, + "engines": { + "node": ">=8.6" + } + }, + "node_modules/minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "dependencies": { + "brace-expansion": "^1.1.7" + }, + "engines": { + "node": "*" + } + }, + "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==", + "dev": true + }, + "node_modules/nanoid": { + "version": "3.3.6", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", + "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "bin": { + "nanoid": "bin/nanoid.cjs" + }, + "engines": { + "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" + } + }, + "node_modules/natural-compare": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", + "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==", + "dev": true + }, + "node_modules/natural-compare-lite": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/natural-compare-lite/-/natural-compare-lite-1.4.0.tgz", + "integrity": "sha512-Tj+HTDSJJKaZnfiuw+iaF9skdPpTo2GtEly5JHnWV/hfv2Qj/9RKsGISQtLh2ox3l5EAGw487hnBee0sIJ6v2g==", + "dev": true + }, + "node_modules/once": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", + "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==", + "dev": true, + "dependencies": { + "wrappy": "1" + } + }, + "node_modules/optionator": { + "version": "0.9.3", + "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz", + "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==", + "dev": true, + "dependencies": { + "@aashutoshrathi/word-wrap": "^1.2.3", + "deep-is": "^0.1.3", + "fast-levenshtein": "^2.0.6", + "levn": "^0.4.1", + "prelude-ls": "^1.2.1", + "type-check": "^0.4.0" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/p-limit": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz", + "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==", + "dev": true, + "dependencies": { + "yocto-queue": "^0.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/p-locate": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz", + "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==", + "dev": true, + "dependencies": { + "p-limit": "^3.0.2" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/parent-module": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", + "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==", + "dev": true, + "dependencies": { + "callsites": "^3.0.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/path-exists": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", + "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/path-is-absolute": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/path-key": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", + "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/path-type": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/picocolors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", + "dev": true + }, + "node_modules/picomatch": { + "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" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/postcss": { + "version": "8.4.27", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.27.tgz", + "integrity": "sha512-gY/ACJtJPSmUFPDCHtX78+01fHa64FaU4zaaWfuh1MhGJISufJAH4cun6k/8fwsHYeK4UQmENQK+tRLCFJE8JQ==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "dependencies": { + "nanoid": "^3.3.6", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/prelude-ls": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", + "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==", + "dev": true, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/punycode": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", + "integrity": "sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==", + "dev": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/queue-microtask": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ] + }, + "node_modules/react": { + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", + "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", + "dependencies": { + "loose-envify": "^1.1.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/react-dom": { + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", + "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", + "dependencies": { + "loose-envify": "^1.1.0", + "scheduler": "^0.23.0" + }, + "peerDependencies": { + "react": "^18.2.0" + } + }, + "node_modules/resolve-from": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", + "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==", + "dev": true, + "engines": { + "node": ">=4" + } + }, + "node_modules/reusify": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", + "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==", + "dev": true, + "engines": { + "iojs": ">=1.0.0", + "node": ">=0.10.0" + } + }, + "node_modules/rimraf": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", + "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", + "dev": true, + "dependencies": { + "glob": "^7.1.3" + }, + "bin": { + "rimraf": "bin.js" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/rollup": { + "version": "3.27.2", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.27.2.tgz", + "integrity": "sha512-YGwmHf7h2oUHkVBT248x0yt6vZkYQ3/rvE5iQuVBh3WO8GcJ6BNeOkpoX1yMHIiBm18EMLjBPIoUDkhgnyxGOQ==", + "dev": true, + "bin": { + "rollup": "dist/bin/rollup" + }, + "engines": { + "node": ">=14.18.0", + "npm": ">=8.0.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/run-parallel": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "dependencies": { + "queue-microtask": "^1.2.2" + } + }, + "node_modules/scheduler": { + "version": "0.23.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", + "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", + "dependencies": { + "loose-envify": "^1.1.0" + } + }, + "node_modules/semver": { + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", + "dev": true, + "dependencies": { + "lru-cache": "^6.0.0" + }, + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/shebang-command": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", + "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==", + "dev": true, + "dependencies": { + "shebang-regex": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/shebang-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz", + "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/slash": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "dev": true, + "engines": { + "node": ">=0.10.0" + } + }, + "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==", + "dev": true, + "dependencies": { + "ansi-regex": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/strip-json-comments": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz", + "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==", + "dev": true, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/text-table": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz", + "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==", + "dev": true + }, + "node_modules/to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dev": true, + "dependencies": { + "is-number": "^7.0.0" + }, + "engines": { + "node": ">=8.0" + } + }, + "node_modules/ts-api-utils": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.0.1.tgz", + "integrity": "sha512-lC/RGlPmwdrIBFTX59wwNzqh7aR2otPNPR/5brHZm/XKFYKsfqxihXUe9pU3JI+3vGkl+vyCoNNnPhJn3aLK1A==", + "dev": true, + "engines": { + "node": ">=16.13.0" + }, + "peerDependencies": { + "typescript": ">=4.2.0" + } + }, + "node_modules/type-check": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", + "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==", + "dev": true, + "dependencies": { + "prelude-ls": "^1.2.1" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/type-fest": { + "version": "0.20.2", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz", + "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/typescript": { + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", + "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", + "dev": true, + "bin": { + "tsc": "bin/tsc", + "tsserver": "bin/tsserver" + }, + "engines": { + "node": ">=14.17" + } + }, + "node_modules/uri-js": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", + "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==", + "dev": true, + "dependencies": { + "punycode": "^2.1.0" + } + }, + "node_modules/vite": { + "version": "4.4.8", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.8.tgz", + "integrity": "sha512-LONawOUUjxQridNWGQlNizfKH89qPigK36XhMI7COMGztz8KNY0JHim7/xDd71CZwGT4HtSRgI7Hy+RlhG0Gvg==", + "dev": true, + "dependencies": { + "esbuild": "^0.18.10", + "postcss": "^8.4.26", + "rollup": "^3.25.2" + }, + "bin": { + "vite": "bin/vite.js" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/vitejs/vite?sponsor=1" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + }, + "peerDependencies": { + "@types/node": ">= 14", + "less": "*", + "lightningcss": "^1.21.0", + "sass": "*", + "stylus": "*", + "sugarss": "*", + "terser": "^5.4.0" + }, + "peerDependenciesMeta": { + "@types/node": { + "optional": true + }, + "less": { + "optional": true + }, + "lightningcss": { + "optional": true + }, + "sass": { + "optional": true + }, + "stylus": { + "optional": true + }, + "sugarss": { + "optional": true + }, + "terser": { + "optional": true + } + } + }, + "node_modules/which": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", + "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", + "dev": true, + "dependencies": { + "isexe": "^2.0.0" + }, + "bin": { + "node-which": "bin/node-which" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/wrappy": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", + "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==", + "dev": true + }, + "node_modules/yallist": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", + "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", + "dev": true + }, + "node_modules/yocto-queue": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", + "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + } + } +} diff --git a/bug-bash/app/package.json b/bug-bash/app/package.json new file mode 100644 index 00000000..9511d229 --- /dev/null +++ b/bug-bash/app/package.json @@ -0,0 +1,28 @@ +{ + "name": "app", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc && vite build", + "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", + "preview": "vite preview" + }, + "dependencies": { + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.2.15", + "@types/react-dom": "^18.2.7", + "@typescript-eslint/eslint-plugin": "^6.0.0", + "@typescript-eslint/parser": "^6.0.0", + "@vitejs/plugin-react-swc": "^3.3.2", + "eslint": "^8.45.0", + "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-refresh": "^0.4.3", + "typescript": "^5.0.2", + "vite": "^4.4.5" + } +} diff --git a/bug-bash/app/public/vite.svg b/bug-bash/app/public/vite.svg new file mode 100644 index 00000000..e7b8dfb1 --- /dev/null +++ b/bug-bash/app/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/bug-bash/app/src/App.css b/bug-bash/app/src/App.css new file mode 100644 index 00000000..b9d355df --- /dev/null +++ b/bug-bash/app/src/App.css @@ -0,0 +1,42 @@ +#root { + max-width: 1280px; + margin: 0 auto; + padding: 2rem; + text-align: center; +} + +.logo { + height: 6em; + padding: 1.5em; + will-change: filter; + transition: filter 300ms; +} +.logo:hover { + filter: drop-shadow(0 0 2em #646cffaa); +} +.logo.react:hover { + filter: drop-shadow(0 0 2em #61dafbaa); +} + +@keyframes logo-spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +@media (prefers-reduced-motion: no-preference) { + a:nth-of-type(2) .logo { + animation: logo-spin infinite 20s linear; + } +} + +.card { + padding: 2em; +} + +.read-the-docs { + color: #888; +} diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx new file mode 100644 index 00000000..afe48ac7 --- /dev/null +++ b/bug-bash/app/src/App.tsx @@ -0,0 +1,35 @@ +import { useState } from 'react' +import reactLogo from './assets/react.svg' +import viteLogo from '/vite.svg' +import './App.css' + +function App() { + const [count, setCount] = useState(0) + + return ( + <> + +

Vite + React

+
+ +

+ Edit src/App.tsx and save to test HMR +

+
+

+ Click on the Vite and React logos to learn more +

+ + ) +} + +export default App diff --git a/bug-bash/app/src/assets/react.svg b/bug-bash/app/src/assets/react.svg new file mode 100644 index 00000000..6c87de9b --- /dev/null +++ b/bug-bash/app/src/assets/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/bug-bash/app/src/index.css b/bug-bash/app/src/index.css new file mode 100644 index 00000000..2c3fac68 --- /dev/null +++ b/bug-bash/app/src/index.css @@ -0,0 +1,69 @@ +:root { + font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; + line-height: 1.5; + font-weight: 400; + + color-scheme: light dark; + color: rgba(255, 255, 255, 0.87); + background-color: #242424; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -webkit-text-size-adjust: 100%; +} + +a { + font-weight: 500; + color: #646cff; + text-decoration: inherit; +} +a:hover { + color: #535bf2; +} + +body { + margin: 0; + display: flex; + place-items: center; + min-width: 320px; + min-height: 100vh; +} + +h1 { + font-size: 3.2em; + line-height: 1.1; +} + +button { + border-radius: 8px; + border: 1px solid transparent; + padding: 0.6em 1.2em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + background-color: #1a1a1a; + cursor: pointer; + transition: border-color 0.25s; +} +button:hover { + border-color: #646cff; +} +button:focus, +button:focus-visible { + outline: 4px auto -webkit-focus-ring-color; +} + +@media (prefers-color-scheme: light) { + :root { + color: #213547; + background-color: #ffffff; + } + a:hover { + color: #747bff; + } + button { + background-color: #f9f9f9; + } +} diff --git a/bug-bash/app/src/main.tsx b/bug-bash/app/src/main.tsx new file mode 100644 index 00000000..3d7150da --- /dev/null +++ b/bug-bash/app/src/main.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import ReactDOM from 'react-dom/client' +import App from './App.tsx' +import './index.css' + +ReactDOM.createRoot(document.getElementById('root')!).render( + + + , +) diff --git a/bug-bash/app/src/vite-env.d.ts b/bug-bash/app/src/vite-env.d.ts new file mode 100644 index 00000000..11f02fe2 --- /dev/null +++ b/bug-bash/app/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/bug-bash/app/tsconfig.json b/bug-bash/app/tsconfig.json new file mode 100644 index 00000000..a7fc6fbf --- /dev/null +++ b/bug-bash/app/tsconfig.json @@ -0,0 +1,25 @@ +{ + "compilerOptions": { + "target": "ES2020", + "useDefineForClassFields": true, + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["src"], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/bug-bash/app/tsconfig.node.json b/bug-bash/app/tsconfig.node.json new file mode 100644 index 00000000..42872c59 --- /dev/null +++ b/bug-bash/app/tsconfig.node.json @@ -0,0 +1,10 @@ +{ + "compilerOptions": { + "composite": true, + "skipLibCheck": true, + "module": "ESNext", + "moduleResolution": "bundler", + "allowSyntheticDefaultImports": true + }, + "include": ["vite.config.ts"] +} diff --git a/bug-bash/app/vite.config.ts b/bug-bash/app/vite.config.ts new file mode 100644 index 00000000..861b04b3 --- /dev/null +++ b/bug-bash/app/vite.config.ts @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import react from '@vitejs/plugin-react-swc' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [react()], +}) From 7d84ab0ed518989a516c21898ad691a440aae69d Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:00:31 +0000 Subject: [PATCH 15/54] Update setup.sh to install + run React app --- bug-bash/setup.sh | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index 7b310f37..a7e8cbb2 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -25,7 +25,14 @@ else echo "SDK_KEY=$sdk_key" >> .env fi +cd bug-bash/app +npm install --silent + echo echo "\033[1;38;2;59;224;129mReady\033[0m." -echo "Please run \"npm run bug-bash -- \" (note the spaces before & after --)" -echo \ No newline at end of file +echo "Please go into bug-bash/app-src and begin editing App.tsx for your testing scenarios." +echo +echo "Press enter to start the local Bug Bash server. You'll need to leave this terminal active." +read _discard + +npm run dev From 803a6ee0dfc3bfa1189a5ee7c36d28d06685c92c Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:03:33 +0000 Subject: [PATCH 16/54] Update npm script to run bug-bash --- bug-bash/index.js | 24 ------------------------ package.json | 3 +-- 2 files changed, 1 insertion(+), 26 deletions(-) delete mode 100644 bug-bash/index.js diff --git a/bug-bash/index.js b/bug-bash/index.js deleted file mode 100644 index 1518796b..00000000 --- a/bug-bash/index.js +++ /dev/null @@ -1,24 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/no-var-requires -const dotenv = require('dotenv'); - -dotenv.config(); - -const scenario = process.argv[2]; -const sdkKey = process.env.SDK_KEY; - -console.log('SDK Key: ', sdkKey); - -switch (scenario) { - case 'scenario1': - console.log('Running setup for scenario 1...'); - // Code to set up scenario 1 - break; - case 'scenario2': - console.log('Running setup for scenario 2...'); - // Code to set up scenario 2 - break; - // etc. - default: - console.error(`Unknown scenario: ${scenario}`); - process.exit(1); -} diff --git a/package.json b/package.json index 25051805..d1ec3c76 100644 --- a/package.json +++ b/package.json @@ -28,8 +28,7 @@ "test": "jest --silent", "prepublishOnly": "npm run test && npm run build", "prepare": "npm run build", - "bug-bash:setup": "sh ./bug-bash/setup.sh", - "bug-bash": "node ./bug-bash/" + "bug-bash": "sh ./bug-bash/setup.sh" }, "publishConfig": { "access": "public" From b72491cef86a525cc70cbd2e0a1f162fea330e65 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:15:04 +0000 Subject: [PATCH 17/54] Simplify setup.sh --- bug-bash/setup.sh | 23 +++++++++-------------- 1 file changed, 9 insertions(+), 14 deletions(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index a7e8cbb2..fc7c6da6 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -1,36 +1,31 @@ #!/bin/bash echo "Welcome to the Bug Bash ๐Ÿž" -echo "Setting up for the bug bash..." -# Conditionally add npm packages -if ! node -e "require('dotenv')" > /dev/null 2>&1; then - # Install via NPM instead of yarn so as not to save to package.json - npm install --no-save --legacy-peer-deps --silent dotenv - # Revert changes to yarn.lock file - git checkout -- yarn.lock -fi +# Install via NPM instead of yarn so as not to save to package.json +npm install --no-save --legacy-peer-deps --silent dotenv +# Revert changes to yarn.lock file +git checkout -- yarn.lock # Prompt for SDK key echo echo "\033[1;38;2;0;55;255mPlease enter your SDK key: \033[0m\c" read sdk_key -# Check if .env file contains SDK_KEY entry -if grep -q "SDK_KEY" .env; then +# Check if .env file exists and contains SDK_KEY entry +if [ -f .env ] && grep -q "SDK_KEY" .env; then # If it does, replace the existing entry sed -i "s/^SDK_KEY=.*/SDK_KEY=$sdk_key/" .env else - # If it doesn't, append the new entry - echo "SDK_KEY=$sdk_key" >> .env + # If it doesn't, create the file and append the new entry + echo "SDK_KEY=$sdk_key" > .env fi cd bug-bash/app npm install --silent echo -echo "\033[1;38;2;59;224;129mReady\033[0m." -echo "Please go into bug-bash/app-src and begin editing App.tsx for your testing scenarios." +echo "Please go into bug-bash/app-src and \033[1;38;2;59;224;129mbegin editing App.tsx\033[0m for your testing scenarios." echo echo "Press enter to start the local Bug Bash server. You'll need to leave this terminal active." read _discard From 0c41798969028e6ddf25f97308ad7dc84e7f9942 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:19:01 +0000 Subject: [PATCH 18/54] Simplify the react app --- bug-bash/app/public/vite.svg | 1 - bug-bash/app/src/App.css | 36 -------------------------- bug-bash/app/src/App.tsx | 25 ++---------------- bug-bash/app/src/assets/react.svg | 1 - bug-bash/app/src/index.css | 43 +------------------------------ 5 files changed, 3 insertions(+), 103 deletions(-) delete mode 100644 bug-bash/app/public/vite.svg delete mode 100644 bug-bash/app/src/assets/react.svg diff --git a/bug-bash/app/public/vite.svg b/bug-bash/app/public/vite.svg deleted file mode 100644 index e7b8dfb1..00000000 --- a/bug-bash/app/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/bug-bash/app/src/App.css b/bug-bash/app/src/App.css index b9d355df..902778b7 100644 --- a/bug-bash/app/src/App.css +++ b/bug-bash/app/src/App.css @@ -4,39 +4,3 @@ padding: 2rem; text-align: center; } - -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafbaa); -} - -@keyframes logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} - -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; -} diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index afe48ac7..269d6f57 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -1,33 +1,12 @@ -import { useState } from 'react' -import reactLogo from './assets/react.svg' -import viteLogo from '/vite.svg' import './App.css' function App() { - const [count, setCount] = useState(0) - return ( <> - -

Vite + React

+

Bug Bash

- -

- Edit src/App.tsx and save to test HMR -

+
-

- Click on the Vite and React logos to learn more -

) } diff --git a/bug-bash/app/src/assets/react.svg b/bug-bash/app/src/assets/react.svg deleted file mode 100644 index 6c87de9b..00000000 --- a/bug-bash/app/src/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/bug-bash/app/src/index.css b/bug-bash/app/src/index.css index 2c3fac68..f342884e 100644 --- a/bug-bash/app/src/index.css +++ b/bug-bash/app/src/index.css @@ -14,15 +14,6 @@ -webkit-text-size-adjust: 100%; } -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - body { margin: 0; display: flex; @@ -34,36 +25,4 @@ body { h1 { font-size: 3.2em; line-height: 1.1; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; -} - -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } -} +} \ No newline at end of file From 835911b746e25d4c4bb82fe2edb7991bef706b53 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 4 Aug 2023 21:29:36 +0000 Subject: [PATCH 19/54] WIP: Update App + use local @optimizely/react-sdk --- bug-bash/app/src/App.tsx | 112 ++++++++++++++++++++++++++++++++++--- bug-bash/app/tsconfig.json | 5 +- 2 files changed, 107 insertions(+), 10 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 269d6f57..970cb449 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -1,14 +1,108 @@ -import './App.css' +import { useState } from 'react'; +import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; +import './App.css'; + +const optimizelyClient = createInstance({ sdkKey: '' }); + +function Pre(props) { + return 
{props.children}
; +} + +function isClientValid() { + return optimizelyClient.getOptimizelyConfig() !== null; +} + +const userIds = []; +while (userIds.length < 10) { + userIds.push((Math.floor(Math.random() * 999999) + 100000).toString()); +} function App() { + const [hasOnFlag, setHasOnFlag] = useState(false); + const [isDone, setIsDone] = useState(false); + const [isClientReady, setIsClientReady] = useState(null); + + optimizelyClient.onReady().then(() => { + setIsDone(true); + isClientValid() && setIsClientReady(true); + }); + + let projectId = '{project_id}'; + if (isClientValid()) { + const datafile = JSON.parse(optimizelyClient.getOptimizelyConfig().getDatafile()); + projectId = datafile.projectId; + } + + return ( + + 
Welcome to our Quickstart Guide!
+ {isClientReady && ( + <> + {userIds.map(userId => ( + + ))} +
+ {!hasOnFlag && } + + )} + {isDone && !isClientReady && ( + 
+          Optimizely client invalid. Verify in Settings -> Environments that you used the primary environment's SDK key
+
+ )} + + ); +} + +function FlagsOffMessage({ projectId }) { + const navLink = `https://app.optimizely.com/v2/projects/${projectId}/settings/implementation`; + return ( +
+ 
Flag was off for everyone. Some reasons could include:
+ 
1. Your sample size of visitors was too small. Rerun, or increase the iterations in the FOR loop
+ 
+        2. By default you have 2 keys for 2 project environments (dev/prod). Verify in Settings>Environments that you
+        used the right key for the environment where your flag is toggled to ON.
+
+ 
+        Check your key at {navLink}
+
+
+
+ ); +} + +function Decision({ userId, setHasOnFlag }) { + const [decision, clientReady] = useDecision('product_sort', {}, { overrideUserId: userId }); + + if (!clientReady) { + return ''; + } + + const variationKey = decision.variationKey; + + if (variationKey === null) { + console.log(' decision error: ', decision['reasons']); + } + + if (decision.enabled) { + setTimeout(() => setHasOnFlag(true)); + } + + const sortMethod = decision.variables['sort_method']; + return ( - <> -

Bug Bash

-
- -
- - ) + 
+      {`\nFlag ${
+        decision.enabled ? 'on' : 'off'
+      }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${
+        decision.ruleKey
+      }`}
+
+ ); } -export default App +export default App; diff --git a/bug-bash/app/tsconfig.json b/bug-bash/app/tsconfig.json index a7fc6fbf..ea9ada0f 100644 --- a/bug-bash/app/tsconfig.json +++ b/bug-bash/app/tsconfig.json @@ -4,7 +4,10 @@ "useDefineForClassFields": true, "lib": ["ES2020", "DOM", "DOM.Iterable"], "module": "ESNext", - "skipLibCheck": true, + "skipLibCheck": true,"baseUrl": ".", + "paths": { + "@optimizely/react-sdk": ["../../dist"] + }, /* Bundler mode */ "moduleResolution": "bundler", From 4dc1db573a655c677a98f7109acf86729f37a6c9 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Mon, 7 Aug 2023 17:55:32 +0000 Subject: [PATCH 20/54] Add local React & dotenv --- bug-bash/app/package-lock.json | 64 ++++++++++++++++++++++++++++++++++ bug-bash/app/package.json | 2 ++ 2 files changed, 66 insertions(+) diff --git a/bug-bash/app/package-lock.json b/bug-bash/app/package-lock.json index d6ed4bae..00e1a454 100644 --- a/bug-bash/app/package-lock.json +++ b/bug-bash/app/package-lock.json @@ -8,6 +8,7 @@ "name": "app", "version": "0.0.0", "dependencies": { + "@optimizely/react-sdk": "file:../..", "react": "^18.2.0", "react-dom": "^18.2.0" }, @@ -17,6 +18,7 @@ "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "@vitejs/plugin-react-swc": "^3.3.2", + "dotenv": "^16.3.1", "eslint": "^8.45.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", @@ -24,6 +26,52 @@ "vite": "^4.4.5" } }, + "../..": { + "name": "@optimizely/react-sdk", + "version": "2.9.2", + "license": "Apache-2.0", + "dependencies": { + "@optimizely/optimizely-sdk": "^5.0.0-beta2", + "hoist-non-react-statics": "^3.3.0", + "prop-types": "^15.6.2", + "utility-types": "^2.1.0 || ^3.0.0" + }, + "devDependencies": { + "@rollup/plugin-commonjs": "^16.0.0", + "@rollup/plugin-node-resolve": "^10.0.0", + "@rollup/plugin-replace": "^2.3.4", + "@testing-library/jest-dom": "^5.16.4", + "@testing-library/react": "^13.1.1", + "@types/hoist-non-react-statics": "^3.3.1", + "@types/jest": "^26.0.14", + "@types/prop-types": "^15.5.6", + "@types/react": "^18.0.15", + "@types/react-dom": "^18.0.6", + "@typescript-eslint/eslint-plugin": "^2.23.0", + "@typescript-eslint/parser": "^2.23.0", + "eslint": "^6.8.0", + "eslint-config-prettier": "^6.10.0", + "eslint-plugin-prettier": "^3.1.2", + "eslint-plugin-react": "^7.19.0", + "eslint-plugin-react-hooks": "^4.1.0", + "jest": "^26.5.2", + "prettier": "1.19.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "rollup": "^2.32.1", + "rollup-plugin-typescript2": "^0.28.0", + "rollup-plugin-uglify": "^6.0.4", + "ts-jest": "^26.4.1", + "tslib": "^2.4.0", + "typescript": "^4.7.4" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0" + } + }, "node_modules/@aashutoshrathi/word-wrap": { "version": "1.2.6", "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz", @@ -509,6 +557,10 @@ "node": ">= 8" } }, + "node_modules/@optimizely/react-sdk": { + "resolved": "../..", + "link": true + }, "node_modules/@swc/core": { "version": "1.3.74", "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.3.74.tgz", @@ -1169,6 +1221,18 @@ "node": ">=6.0.0" } }, + "node_modules/dotenv": { + "version": "16.3.1", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.3.1.tgz", + "integrity": "sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/motdotla/dotenv?sponsor=1" + } + }, "node_modules/esbuild": { "version": "0.18.17", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz", diff --git a/bug-bash/app/package.json b/bug-bash/app/package.json index 9511d229..7b3ad7a6 100644 --- a/bug-bash/app/package.json +++ b/bug-bash/app/package.json @@ -10,6 +10,7 @@ "preview": "vite preview" }, "dependencies": { + "@optimizely/react-sdk": "file:../..", "react": "^18.2.0", "react-dom": "^18.2.0" }, @@ -19,6 +20,7 @@ "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "@vitejs/plugin-react-swc": "^3.3.2", + "dotenv": "^16.3.1", "eslint": "^8.45.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", From a14a677e6d2feee0f3190558f5c2f2642f82c569 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Mon, 7 Aug 2023 17:56:05 +0000 Subject: [PATCH 21/54] Update setup script --- bug-bash/setup.sh | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index fc7c6da6..d614764b 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -2,10 +2,14 @@ echo "Welcome to the Bug Bash ๐Ÿž" -# Install via NPM instead of yarn so as not to save to package.json -npm install --no-save --legacy-peer-deps --silent dotenv -# Revert changes to yarn.lock file -git checkout -- yarn.lock +cd bug-bash/app + +# Install deps +npm install --silent +# Add dotenv +npm install --save-dev --silent dotenv +# Add a reference to the local React SDK +npm install --save --silent ../../ # Prompt for SDK key echo @@ -21,9 +25,6 @@ else echo "SDK_KEY=$sdk_key" > .env fi -cd bug-bash/app -npm install --silent - echo echo "Please go into bug-bash/app-src and \033[1;38;2;59;224;129mbegin editing App.tsx\033[0m for your testing scenarios." echo From 52de93b3281f9b8fd75c0156e87fdadd0df03bf3 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 8 Aug 2023 15:41:57 +0000 Subject: [PATCH 22/54] Remove dotenv --- bug-bash/app/package-lock.json | 13 ------------- bug-bash/app/package.json | 1 - bug-bash/setup.sh | 2 -- 3 files changed, 16 deletions(-) diff --git a/bug-bash/app/package-lock.json b/bug-bash/app/package-lock.json index 00e1a454..10b2143a 100644 --- a/bug-bash/app/package-lock.json +++ b/bug-bash/app/package-lock.json @@ -18,7 +18,6 @@ "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "@vitejs/plugin-react-swc": "^3.3.2", - "dotenv": "^16.3.1", "eslint": "^8.45.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", @@ -1221,18 +1220,6 @@ "node": ">=6.0.0" } }, - "node_modules/dotenv": { - "version": "16.3.1", - "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.3.1.tgz", - "integrity": "sha512-IPzF4w4/Rd94bA9imS68tZBaYyBWSCE47V1RGuMrB94iyTOIEwRmVL2x/4An+6mETpLrKJ5hQkB8W4kFAadeIQ==", - "dev": true, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/motdotla/dotenv?sponsor=1" - } - }, "node_modules/esbuild": { "version": "0.18.17", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.17.tgz", diff --git a/bug-bash/app/package.json b/bug-bash/app/package.json index 7b3ad7a6..788085e4 100644 --- a/bug-bash/app/package.json +++ b/bug-bash/app/package.json @@ -20,7 +20,6 @@ "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "@vitejs/plugin-react-swc": "^3.3.2", - "dotenv": "^16.3.1", "eslint": "^8.45.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index d614764b..5c9782bc 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -6,8 +6,6 @@ cd bug-bash/app # Install deps npm install --silent -# Add dotenv -npm install --save-dev --silent dotenv # Add a reference to the local React SDK npm install --save --silent ../../ From a89ad2c8a9f4acb832f9e0e35f467e47e885649a Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 8 Aug 2023 15:42:24 +0000 Subject: [PATCH 23/54] WIP bring .env values in --- bug-bash/app/src/App.tsx | 15 +++++++-------- bug-bash/app/vite.config.ts | 3 +++ 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 970cb449..c71dfbb0 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -2,7 +2,9 @@ import { useState } from 'react'; import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; import './App.css'; -const optimizelyClient = createInstance({ sdkKey: '' }); +const sdkKey = import.meta.env.SDK_KEY; +console.log('>>> SDK_KEY', sdkKey); +const optimizelyClient = createInstance({ sdkKey }); function Pre(props) { return 
{props.children}
; @@ -12,7 +14,7 @@ function isClientValid() { return optimizelyClient.getOptimizelyConfig() !== null; } -const userIds = []; +const userIds: string[] = []; while (userIds.length < 10) { userIds.push((Math.floor(Math.random() * 999999) + 100000).toString()); } @@ -34,10 +36,7 @@ function App() { } return ( - + 
Welcome to our Quickstart Guide!
{isClientReady && ( <> @@ -50,7 +49,7 @@ function App() { )} {isDone && !isClientReady && ( 
-          Optimizely client invalid. Verify in Settings -> Environments that you used the primary environment's SDK key
+          Optimizely client invalid. Verify in Settings - Environments that you used the primary environment's SDK key
)} @@ -64,7 +63,7 @@ function FlagsOffMessage({ projectId }) { 
Flag was off for everyone. Some reasons could include:
1. Your sample size of visitors was too small. Rerun, or increase the iterations in the FOR loop
-        2. By default you have 2 keys for 2 project environments (dev/prod). Verify in Settings>Environments that you
+        2. By default you have 2 keys for 2 project environments (dev/prod). Verify in Settings - Environments that you
         used the right key for the environment where your flag is toggled to ON.
       
diff --git a/bug-bash/app/vite.config.ts b/bug-bash/app/vite.config.ts
index 861b04b3..1e1f3273 100644
--- a/bug-bash/app/vite.config.ts
+++ b/bug-bash/app/vite.config.ts
@@ -4,4 +4,7 @@ import react from '@vitejs/plugin-react-swc'
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [react()],
+  define: {
+    'process.env': process.env
+  }
 })

From 07ecfe4a45ed050d15f5982fa461054d2f6c5b48 Mon Sep 17 00:00:00 2001
From: Mike Chu 
Date: Mon, 14 Aug 2023 19:19:01 +0000
Subject: [PATCH 24/54] Complete WIP on reading SDK from .env

---
 bug-bash/app/src/App.tsx | 2 +-
 bug-bash/setup.sh        | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx
index c71dfbb0..e7faf515 100644
--- a/bug-bash/app/src/App.tsx
+++ b/bug-bash/app/src/App.tsx
@@ -2,7 +2,7 @@ import { useState } from 'react';
 import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk';
 import './App.css';
 
-const sdkKey = import.meta.env.SDK_KEY;
+const sdkKey = import.meta.env.VITE_SDK_KEY;
 console.log('>>> SDK_KEY', sdkKey);
 const optimizelyClient = createInstance({ sdkKey });
 
diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh
index 5c9782bc..71f04b2d 100644
--- a/bug-bash/setup.sh
+++ b/bug-bash/setup.sh
@@ -14,13 +14,13 @@ echo
 echo "\033[1;38;2;0;55;255mPlease enter your SDK key: \033[0m\c"
 read sdk_key
 
-# Check if .env file exists and contains SDK_KEY entry
-if [ -f .env ] && grep -q "SDK_KEY" .env; then
+# Check if .env.local file exists and contains SDK_KEY entry
+if [ -f .env.local ] && grep -q "VITE_SDK_KEY" .env.local; then
   # If it does, replace the existing entry
-  sed -i "s/^SDK_KEY=.*/SDK_KEY=$sdk_key/" .env
+  sed -i "s/^VITE_SDK_KEY=.*/VITE_SDK_KEY=$sdk_key/" .env.local
 else
   # If it doesn't, create the file and append the new entry
-  echo "SDK_KEY=$sdk_key" > .env
+  echo "VITE_SDK_KEY=$sdk_key" > .env.local
 fi
 
 echo

From 2eb812c187d0c7397974c30320703c497fe7ff38 Mon Sep 17 00:00:00 2001
From: Mike Chu 
Date: Mon, 14 Aug 2023 19:39:53 +0000
Subject: [PATCH 25/54] Transfer @rafinutshaw-optimizely's work in

---
 bug-bash/app/src/App.css       |   5 +
 bug-bash/app/src/App.tsx       | 296 ++++++++++++++++++++++++---------
 bug-bash/app/src/App.types.tsx |   6 +
 3 files changed, 232 insertions(+), 75 deletions(-)
 create mode 100644 bug-bash/app/src/App.types.tsx

diff --git a/bug-bash/app/src/App.css b/bug-bash/app/src/App.css
index 902778b7..6a92df1f 100644
--- a/bug-bash/app/src/App.css
+++ b/bug-bash/app/src/App.css
@@ -4,3 +4,8 @@
   padding: 2rem;
   text-align: center;
 }
+
+pre {
+  /* monospaced text*/
+  font-family: monospace;
+}
\ No newline at end of file
diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx
index e7faf515..24806f57 100644
--- a/bug-bash/app/src/App.tsx
+++ b/bug-bash/app/src/App.tsx
@@ -1,84 +1,234 @@
-import { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk';
-import './App.css';
-
-const sdkKey = import.meta.env.VITE_SDK_KEY;
-console.log('>>> SDK_KEY', sdkKey);
-const optimizelyClient = createInstance({ sdkKey });
-
-function Pre(props) {
-  return 
{props.children}
;
-}
-
-function isClientValid() {
-  return optimizelyClient.getOptimizelyConfig() !== null;
-}
-
-const userIds: string[] = [];
-while (userIds.length < 10) {
-  userIds.push((Math.floor(Math.random() * 999999) + 100000).toString());
-}
-
-function App() {
-  const [hasOnFlag, setHasOnFlag] = useState(false);
-  const [isDone, setIsDone] = useState(false);
-  const [isClientReady, setIsClientReady] = useState(null);
-
-  optimizelyClient.onReady().then(() => {
-    setIsDone(true);
-    isClientValid() && setIsClientReady(true);
-  });
-
-  let projectId = '{project_id}';
-  if (isClientValid()) {
-    const datafile = JSON.parse(optimizelyClient.getOptimizelyConfig().getDatafile());
-    projectId = datafile.projectId;
-  }
+import { OptimizelyReturnType } from './App.types';
+
+import { OdpSegmentManager } from '@optimizely/optimizely-sdk/lib/core/odp/odp_segment_manager';
+import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/core/odp/optimizely_segment_option';
+
+const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local file
+
+export const App: React.FC = () => {
+  const [featureKey, setFeatureKey] = useState('some_key');
+  const [isSegmentsFetched, setIsSegmentsFetched] = useState(null);
+  const [readyResult, setReadyResult] = useState();
+
+  const [enableDecision, setEnableDecision] = useState(false);
+  // 1. console should show two qualified segments and a viud
+  const optimizelyClient = createInstance({ sdkKey });
+  const [userId] = useState('matjaz-user-1');
+  const prepareClient = () => {
+    optimizelyClient.onReady().then(async (res: any) => {
+      setReadyResult(res);
+      setIsSegmentsFetched(true);
+    });
+  };
+
+  // 2. console should show three qualified segments and the same viud
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const [userId] = useState('matjaz-user-2');
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // 3. console should show no qualified segments and the same viud
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const [userId] = useState('matjaz-user-3');
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // 4. console should show no qualified segments and the same viud
+  // const [userId] = useState(null);
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // 5. the network tab zaious call should be sending the vuid_xxxxx as the vuid and there shouldnt be a fs_userid sent
+  // const [userId] = useState('vuid_overridden');
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // 6. the network tab should show 2 graphql calls
+  // const [userId] = useState('matjaz-user-3');
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // useEffect(() => {
+  //   const callSegments = async () => {
+  //     if (readyResult?.success) {
+  //       await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]);
+  //       await optimizelyClient.fetchQualifiedSegments();
+  //     }
+  //   };
+  //   callSegments();
+  // }, [readyResult?.success]);
+
+  // 7. the network tab should show 2 graphql calls
+  // const [userId] = useState('matjaz-user-3');
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //   });
+  // };
+
+  // useEffect(() => {
+  //   const callSegments = async () => {
+  //     if (readyResult?.success) {
+  //       await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //       await optimizelyClient.fetchQualifiedSegments();
+  //     }
+  //   };
+  //   callSegments();
+  // }, [readyResult?.success]);
+
+  // 8. there should be an error for the first call to fetchQualifiedSegments the second call should work fine
+  // const [userId] = useState('random-user-id');
+
+  // const prepareClient = () => {
+  //   console.log('optimizelyClient');
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //     await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //   });
+  // };
+
+  // 9. fetch should return error in the console, for segment fetch
+  // const optimizelyClient = createInstance({ sdkKey });
+  // const [userId] = useState('matjaz-user-2');
+
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //     await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //   });
+  // };
+
+  // 10. odp network error
+  // const optimizelyClient = createInstance({
+  //   logLevel: 'debug',
+  //   sdkKey,
+  //   datafileOptions: {
+  //     urlTemplate: 'https://httpstat.us/521?sdkKey=%s',
+  //   },
+  // });
+  // const [userId] = useState('matjaz-user-2');
+
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //     await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //   });
+  // };
+
+  // 11. segment api timeout error
+  // const optimizelyClient = createInstance({
+  //   sdkKey,
+  //   odpOptions: {
+  //     segmentsApiTimeout: 1,
+  //   },
+  // });
+  // const [userId] = useState('matjaz-user-2');
+
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //     await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //   });
+  // };
+
+  // 12. should work fine for proper timeout value
+  // const optimizelyClient = createInstance({
+  //   sdkKey,
+  //   odpOptions: {
+  //     segmentsApiTimeout: 100000,
+  //   },
+  // });
+  // const [userId] = useState('matjaz-user-2');
+
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setIsSegmentsFetched(true);
+  //     await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]);
+  //   });
+  // };
+
+  // useEffect(prepareClient, []);
+
+  // 13. call decide for a segment user is not a part of hence user should not qualify,
+  // later make the user part of the segment and call decide again to check if user qualifies
+  // const optimizelyClient = createInstance({
+  //   sdkKey,
+  // });
+  // const [userId] = useState('matjaz-user-2');
+
+  // const prepareClient = () => {
+  //   optimizelyClient.onReady().then(async (res: any) => {
+  //     setReadyResult(res);
+  //     setFeatureKey('test_feature_1')
+  //     setIsSegmentsFetched(true);
+  //     setEnableDecision(true);
+  //   });
+  // };
+
+  useEffect(prepareClient, []);
 
   return (
-    
-      
Welcome to our Quickstart Guide!

-      {isClientReady && (
+    
+      {readyResult?.success && (
         <>
-          {userIds.map(userId => (
-            
-          ))}
-          

-          {!hasOnFlag && }
+          
Application Output

+          
Please open your browser's "Developer tools" (Ctrl-Shift-I)

+          
+            
{`Is segments fetched for user '${userId}': ${isSegmentsFetched ? 'Yes' : 'No'} `}

+            
UserID: {optimizelyClient.user.id === null ? 'null' : optimizelyClient.user.id}

+            
VUID: {localStorage.getItem('optimizely-vuid')}

+            {enableDecision && featureKey && }
+          

         
       )}
-      {isDone && !isClientReady && (
-        
-          Optimizely client invalid. Verify in Settings - Environments that you used the primary environment's SDK key
-        

+      {readyResult && !readyResult.success && (
+        

+          Client failed to intialized. Check console for more details.
+          
Reason: {readyResult.reason}

+          
Message: {readyResult.message}

+        

       )}
     
   );
-}
+};
 
-function FlagsOffMessage({ projectId }) {
-  const navLink = `https://app.optimizely.com/v2/projects/${projectId}/settings/implementation`;
-  return (
-    

-      
Flag was off for everyone. Some reasons could include:

-      
1. Your sample size of visitors was too small. Rerun, or increase the iterations in the FOR loop

-      
-        2. By default you have 2 keys for 2 project environments (dev/prod). Verify in Settings - Environments that you
-        used the right key for the environment where your flag is toggled to ON.
-      

-      
-        Check your key at {navLink}
-      

-      

-    

-  );
-}
-
-function Decision({ userId, setHasOnFlag }) {
-  const [decision, clientReady] = useDecision('product_sort', {}, { overrideUserId: userId });
+function Decision({ userId, featureKey }: { userId: string; featureKey: string }) {
+  const [decision, clientReady] = useDecision(featureKey, {}, { overrideUserId: userId });
 
   if (!clientReady) {
-    return '';
+    return <>;
   }
 
   const variationKey = decision.variationKey;
@@ -87,20 +237,16 @@ function Decision({ userId, setHasOnFlag }) {
     console.log(' decision error: ', decision['reasons']);
   }
 
-  if (decision.enabled) {
-    setTimeout(() => setHasOnFlag(true));
-  }
-
   const sortMethod = decision.variables['sort_method'];
 
   return (
-    
+    

       {`\nFlag ${
         decision.enabled ? 'on' : 'off'
       }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${
         decision.ruleKey
       }`}
-    

+    
   );
 }
 
diff --git a/bug-bash/app/src/App.types.tsx b/bug-bash/app/src/App.types.tsx
new file mode 100644
index 00000000..2d55e0bf
--- /dev/null
+++ b/bug-bash/app/src/App.types.tsx
@@ -0,0 +1,6 @@
+export type OptimizelyReturnType = {
+    success: boolean;
+    reason?: string;
+    message?: string;
+  };
+  
\ No newline at end of file

From 88df7786fb1d9b4f59e9d58579a5aa14e1db184a Mon Sep 17 00:00:00 2001
From: Mike Chu 
Date: Mon, 14 Aug 2023 19:40:02 +0000
Subject: [PATCH 26/54] Small style fix

---
 bug-bash/app/src/index.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/bug-bash/app/src/index.css b/bug-bash/app/src/index.css
index f342884e..207cac5c 100644
--- a/bug-bash/app/src/index.css
+++ b/bug-bash/app/src/index.css
@@ -15,7 +15,7 @@
 }
 
 body {
-  margin: 0;
+  margin: 10px;
   display: flex;
   place-items: center;
   min-width: 320px;

From df3e319db07b885b11a7dd9fff3c0ae3fd47a27c Mon Sep 17 00:00:00 2001
From: Mike Chu 
Date: Mon, 14 Aug 2023 19:46:29 +0000
Subject: [PATCH 27/54] Minor semantic HTML changes

---
 bug-bash/app/src/App.tsx       | 28 +++++++++++++---------------
 bug-bash/app/src/App.types.tsx |  2 +-
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx
index 24806f57..0b335d6d 100644
--- a/bug-bash/app/src/App.tsx
+++ b/bug-bash/app/src/App.tsx
@@ -11,8 +11,8 @@ export const App: React.FC = () => {
   const [featureKey, setFeatureKey] = useState('some_key');
   const [isSegmentsFetched, setIsSegmentsFetched] = useState(null);
   const [readyResult, setReadyResult] = useState();
-
   const [enableDecision, setEnableDecision] = useState(false);
+
   // 1. console should show two qualified segments and a viud
   const optimizelyClient = createInstance({ sdkKey });
   const [userId] = useState('matjaz-user-1');
@@ -203,22 +203,22 @@ export const App: React.FC = () => {
     
       {readyResult?.success && (
         <>
-          
Application Output

-          
Please open your browser's "Developer tools" (Ctrl-Shift-I)

+          
Bug Bash Output

+          
Please open your browser's "Developer tools" (Ctrl-Shift-I) for Console output

           
-            
{`Is segments fetched for user '${userId}': ${isSegmentsFetched ? 'Yes' : 'No'} `}

-            
UserID: {optimizelyClient.user.id === null ? 'null' : optimizelyClient.user.id}

-            
VUID: {localStorage.getItem('optimizely-vuid')}

+            
{`Is segments fetched for user '${userId}': ${isSegmentsFetched ? 'Yes' : 'No'} `}

+            
UserID: {optimizelyClient.user.id === null ? 'null' : optimizelyClient.user.id}

+            
VUID: {localStorage.getItem('optimizely-vuid')}

             {enableDecision && featureKey && }
           

         
       )}
       {readyResult && !readyResult.success && (
-        

+        
           Client failed to intialized. Check console for more details.
-          
Reason: {readyResult.reason}

-          
Message: {readyResult.message}

-        

+          
Reason: {readyResult.reason}

+          
Message: {readyResult.message}

+
)} ); @@ -240,13 +240,11 @@ function Decision({ userId, featureKey }: { userId: string; featureKey: string } const sortMethod = decision.variables['sort_method']; return ( -
- {`\nFlag ${ - decision.enabled ? 'on' : 'off' - }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ +

+ {`Flag ${ decision.enabled ? 'on' : 'off'}. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ decision.ruleKey }`} -

+

); } diff --git a/bug-bash/app/src/App.types.tsx b/bug-bash/app/src/App.types.tsx index 2d55e0bf..6ca0b06f 100644 --- a/bug-bash/app/src/App.types.tsx +++ b/bug-bash/app/src/App.types.tsx @@ -2,5 +2,5 @@ export type OptimizelyReturnType = { success: boolean; reason?: string; message?: string; - }; +}; \ No newline at end of file From 43cf5ad16c3d9dbbf0411783afa6f16571436d72 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Mon, 14 Aug 2023 19:52:17 +0000 Subject: [PATCH 28/54] A bunch'o NITs for my comfort --- bug-bash/app/src/App.tsx | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 0b335d6d..fbfdfc9a 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -13,6 +13,8 @@ export const App: React.FC = () => { const [readyResult, setReadyResult] = useState(); const [enableDecision, setEnableDecision] = useState(false); + /* โฌ‡๏ธ Tests are below this line โฌ‡๏ธ */ + // 1. console should show two qualified segments and a viud const optimizelyClient = createInstance({ sdkKey }); const [userId] = useState('matjaz-user-1'); @@ -72,7 +74,6 @@ export const App: React.FC = () => { // setIsSegmentsFetched(true); // }); // }; - // useEffect(() => { // const callSegments = async () => { // if (readyResult?.success) { @@ -92,7 +93,6 @@ export const App: React.FC = () => { // setIsSegmentsFetched(true); // }); // }; - // useEffect(() => { // const callSegments = async () => { // if (readyResult?.success) { @@ -105,7 +105,6 @@ export const App: React.FC = () => { // 8. there should be an error for the first call to fetchQualifiedSegments the second call should work fine // const [userId] = useState('random-user-id'); - // const prepareClient = () => { // console.log('optimizelyClient'); // optimizelyClient.onReady().then(async (res: any) => { @@ -118,7 +117,6 @@ export const App: React.FC = () => { // 9. fetch should return error in the console, for segment fetch // const optimizelyClient = createInstance({ sdkKey }); // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: any) => { // setReadyResult(res); @@ -136,7 +134,6 @@ export const App: React.FC = () => { // }, // }); // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: any) => { // setReadyResult(res); @@ -170,7 +167,6 @@ export const App: React.FC = () => { // }, // }); // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: any) => { // setReadyResult(res); @@ -178,7 +174,6 @@ export const App: React.FC = () => { // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); // }); // }; - // useEffect(prepareClient, []); // 13. call decide for a segment user is not a part of hence user should not qualify, @@ -187,7 +182,6 @@ export const App: React.FC = () => { // sdkKey, // }); // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: any) => { // setReadyResult(res); @@ -197,6 +191,8 @@ export const App: React.FC = () => { // }); // }; + /* โฌ†๏ธ Tests are above this line โฌ†๏ธ */ + useEffect(prepareClient, []); return ( From 55d55fd7e01c08fc581b955d668977ec2f359f91 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 15 Aug 2023 13:48:04 +0000 Subject: [PATCH 29/54] Rename bug-bash setup & add run --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index d1ec3c76..ed875297 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,8 @@ "test": "jest --silent", "prepublishOnly": "npm run test && npm run build", "prepare": "npm run build", - "bug-bash": "sh ./bug-bash/setup.sh" + "bug-bash:setup": "sh ./bug-bash/setup.sh", + "bug-bash": "cd bug-bash/app && npm run dev" }, "publishConfig": { "access": "public" From 1d29b80f43ee7fec889df358b9966a14c84fc292 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 15 Aug 2023 15:27:58 +0000 Subject: [PATCH 30/54] Ensure shell scripts use LF line endings --- bug-bash/.gitattributes | 1 + 1 file changed, 1 insertion(+) create mode 100644 bug-bash/.gitattributes diff --git a/bug-bash/.gitattributes b/bug-bash/.gitattributes new file mode 100644 index 00000000..526c8a38 --- /dev/null +++ b/bug-bash/.gitattributes @@ -0,0 +1 @@ +*.sh text eol=lf \ No newline at end of file From d4f75a631f6850ac62fc764f555ff60cc4d2168d Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 15 Aug 2023 21:25:43 +0000 Subject: [PATCH 31/54] WIP testing & refactoring tests --- bug-bash/app/src/App.tsx | 140 +++++++++++++++++++-------------------- 1 file changed, 67 insertions(+), 73 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index fbfdfc9a..4e768a05 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -2,93 +2,94 @@ import React, { useEffect, useState } from 'react'; import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; import { OptimizelyReturnType } from './App.types'; -import { OdpSegmentManager } from '@optimizely/optimizely-sdk/lib/core/odp/odp_segment_manager'; -import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/core/odp/optimizely_segment_option'; +import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk'; const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local file +const logLevel = 'info'; // adjust as you needed; 'debug' needed later +const bugBashLog = (message: string) => { + console.log(`%c๐Ÿ[BUG BASH] - ${message}`, "color: orange; font-size: 20px;"); +}; export const App: React.FC = () => { const [featureKey, setFeatureKey] = useState('some_key'); - const [isSegmentsFetched, setIsSegmentsFetched] = useState(null); const [readyResult, setReadyResult] = useState(); const [enableDecision, setEnableDecision] = useState(false); + const optimizelyClient = createInstance({ sdkKey, logLevel }); + + const handleReadyResult = async (res: OptimizelyReturnType) => { + const userContext = optimizelyClient?.userContext; + if (userContext) { + bugBashLog(`_qualifiedSegments: ${optimizelyClient['userContext']['_qualifiedSegments'] as string}`); + } else { + bugBashLog(`userContext is null`); + } + + if (userId) { + bugBashLog(`userId: ${userId}`); + } + + const currentVuid = localStorage.getItem('optimizely-vuid'); + if (currentVuid) { + bugBashLog(`vuid: ${currentVuid}`); + } + + setReadyResult(res); + }; + /* โฌ‡๏ธ Tests are below this line โฌ‡๏ธ */ - // 1. console should show two qualified segments and a viud - const optimizelyClient = createInstance({ sdkKey }); - const [userId] = useState('matjaz-user-1'); - const prepareClient = () => { - optimizelyClient.onReady().then(async (res: any) => { - setReadyResult(res); - setIsSegmentsFetched(true); - }); - }; + /* 1. console [BUG BASH ๐Ÿ] should show two qualified segments and a viud */ + // const [userId] = useState('matjaz-user-1'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; - // 2. console should show three qualified segments and the same viud - // const optimizelyClient = createInstance({ sdkKey }); + /* 2. console should now show three qualified segments and the same viud */ // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // 3. console should show no qualified segments and the same viud - // const optimizelyClient = createInstance({ sdkKey }); + /* 3. console should show now show no qualified segments and the same vuid */ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // 4. console should show no qualified segments and the same viud + /* 4. console should show no qualified segments and the same vuid */ // const [userId] = useState(null); - // const optimizelyClient = createInstance({ sdkKey }); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // 5. the network tab zaious call should be sending the vuid_xxxxx as the vuid and there shouldnt be a fs_userid sent + /* 5. the network tab has graphql calls + click the latest one and inspect the Payload + there should be a `vuid: vuid_xxxxx` as the vuid and there should not be a fs_userid sent */ // const [userId] = useState('vuid_overridden'); - // const optimizelyClient = createInstance({ sdkKey }); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // 6. the network tab should show 2 graphql calls - // const [userId] = useState('matjaz-user-3'); - // const optimizelyClient = createInstance({ sdkKey }); - // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); - // }; - // useEffect(() => { - // const callSegments = async () => { - // if (readyResult?.success) { - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); - // await optimizelyClient.fetchQualifiedSegments(); - // } - // }; - // callSegments(); - // }, [readyResult?.success]); + /* 6. the network tab should show 2 graphql calls */ + const [userId] = useState('matjaz-user-3'); + const prepareClient = () => { + optimizelyClient.onReady().then(handleReadyResult); + }; + useEffect(() => { + const callSegments = async () => { + if (readyResult?.success) { + await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); + await optimizelyClient.fetchQualifiedSegments(); + } + }; + callSegments(); + }, [readyResult?.success]); // 7. the network tab should show 2 graphql calls // const [userId] = useState('matjaz-user-3'); - // const optimizelyClient = createInstance({ sdkKey }); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // }); @@ -106,8 +107,7 @@ export const App: React.FC = () => { // 8. there should be an error for the first call to fetchQualifiedSegments the second call should work fine // const [userId] = useState('random-user-id'); // const prepareClient = () => { - // console.log('optimizelyClient'); - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -115,10 +115,9 @@ export const App: React.FC = () => { // }; // 9. fetch should return error in the console, for segment fetch - // const optimizelyClient = createInstance({ sdkKey }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -127,7 +126,7 @@ export const App: React.FC = () => { // 10. odp network error // const optimizelyClient = createInstance({ - // logLevel: 'debug', + // logLevel, // sdkKey, // datafileOptions: { // urlTemplate: 'https://httpstat.us/521?sdkKey=%s', @@ -135,7 +134,7 @@ export const App: React.FC = () => { // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -150,9 +149,8 @@ export const App: React.FC = () => { // }, // }); // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -168,7 +166,7 @@ export const App: React.FC = () => { // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -178,12 +176,9 @@ export const App: React.FC = () => { // 13. call decide for a segment user is not a part of hence user should not qualify, // later make the user part of the segment and call decide again to check if user qualifies - // const optimizelyClient = createInstance({ - // sdkKey, - // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: any) => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setFeatureKey('test_feature_1') // setIsSegmentsFetched(true); @@ -202,9 +197,6 @@ export const App: React.FC = () => {

Bug Bash Output

Please open your browser's "Developer tools" (Ctrl-Shift-I) for Console output

-            
{`Is segments fetched for user '${userId}': ${isSegmentsFetched ? 'Yes' : 'No'} `}

-            
UserID: {optimizelyClient.user.id === null ? 'null' : optimizelyClient.user.id}

-            
VUID: {localStorage.getItem('optimizely-vuid')}

             {enableDecision && featureKey && }
@@ -237,7 +229,9 @@ function Decision({ userId, featureKey }: { userId: string; featureKey: string } return (

- {`Flag ${ decision.enabled ? 'on' : 'off'}. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ + {`Flag ${ + decision.enabled ? 'on' : 'off' + }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ decision.ruleKey }`}

From f88d1296d7dc24f9f08c8880b6213296c226aa8a Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Wed, 16 Aug 2023 18:55:04 +0000 Subject: [PATCH 32/54] Better doc & UI + Refactors --- bug-bash/app/src/App.css | 5 -- bug-bash/app/src/App.tsx | 139 ++++++++++++++++++--------------- bug-bash/app/src/App.types.tsx | 6 -- bug-bash/app/src/index.css | 1 - 4 files changed, 75 insertions(+), 76 deletions(-) delete mode 100644 bug-bash/app/src/App.types.tsx diff --git a/bug-bash/app/src/App.css b/bug-bash/app/src/App.css index 6a92df1f..027945e4 100644 --- a/bug-bash/app/src/App.css +++ b/bug-bash/app/src/App.css @@ -3,9 +3,4 @@ margin: 0 auto; padding: 2rem; text-align: center; -} - -pre { - /* monospaced text*/ - font-family: monospace; } \ No newline at end of file diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 4e768a05..341b6620 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -1,6 +1,5 @@ import React, { useEffect, useState } from 'react'; import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; -import { OptimizelyReturnType } from './App.types'; import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk'; @@ -8,14 +7,15 @@ const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local f const logLevel = 'info'; // adjust as you needed; 'debug' needed later const bugBashLog = (message: string) => { - console.log(`%c๐Ÿ[BUG BASH] - ${message}`, "color: orange; font-size: 20px;"); + console.log(`%c๐Ÿ[BUG BASH] - ${message}`, 'color: orange; font-size: 20px;'); }; export const App: React.FC = () => { const [featureKey, setFeatureKey] = useState('some_key'); const [readyResult, setReadyResult] = useState(); const [enableDecision, setEnableDecision] = useState(false); - const optimizelyClient = createInstance({ sdkKey, logLevel }); + // Using let here because we need to reassign the client in some tests + let optimizelyClient = createInstance({ sdkKey, logLevel }); const handleReadyResult = async (res: OptimizelyReturnType) => { const userContext = optimizelyClient?.userContext; @@ -33,114 +33,124 @@ export const App: React.FC = () => { if (currentVuid) { bugBashLog(`vuid: ${currentVuid}`); } - + setReadyResult(res); }; /* โฌ‡๏ธ Tests are below this line โฌ‡๏ธ */ - /* 1. console [BUG BASH ๐Ÿ] should show two qualified segments and a viud */ + /* Open the Developer Tools > Console tab + [BUG BASH ๐Ÿ] items should show two qualified segments and a viud */ // const [userId] = useState('matjaz-user-1'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* 2. console should now show three qualified segments and the same viud */ + /* The Console tab should now show three qualified segments and the same viud */ // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* 3. console should show now show no qualified segments and the same vuid */ + /* The Console tab should now show no qualified segments and the same vuid */ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* 4. console should show no qualified segments and the same vuid */ + /* The Console tab should show no qualified segments and the same vuid */ // const [userId] = useState(null); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* 5. the network tab has graphql calls - click the latest one and inspect the Payload - there should be a `vuid: vuid_xxxxx` as the vuid and there should not be a fs_userid sent */ + /* Open the Network tab. + Look for graphql calls that are POST requests (you can ignore the OPTIONS calls) + Click the latest one and inspect the Payload + There should be a `vuid: vuid_xxxxx` as the vuid and there should not be a fs_userid sent */ // const [userId] = useState('vuid_overridden'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* 6. the network tab should show 2 graphql calls */ - const [userId] = useState('matjaz-user-3'); - const prepareClient = () => { - optimizelyClient.onReady().then(handleReadyResult); - }; - useEffect(() => { - const callSegments = async () => { - if (readyResult?.success) { - await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); - await optimizelyClient.fetchQualifiedSegments(); - } - }; - callSegments(); - }, [readyResult?.success]); - - // 7. the network tab should show 2 graphql calls + /* In the Network tab, there should be 1 graphql POST calls since we're using the cache */ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; // useEffect(() => { - // const callSegments = async () => { + // (async () => { // if (readyResult?.success) { - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + // await optimizelyClient.fetchQualifiedSegments(); // await optimizelyClient.fetchQualifiedSegments(); // } - // }; - // callSegments(); + // })(); // }, [readyResult?.success]); - // 8. there should be an error for the first call to fetchQualifiedSegments the second call should work fine - // const [userId] = useState('random-user-id'); + /* Now the Network tab should show 2 identical graphql POSTs since we're resetting the cache */ + // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; + // useEffect(() => { + // (async () => { + // if (readyResult?.success) { + // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); + // await optimizelyClient.fetchQualifiedSegments(); + // } + // })(); + // }, [readyResult?.success]); - // 9. fetch should return error in the console, for segment fetch - // const [userId] = useState('matjaz-user-2'); + /* Again, in the Network tab should show 2 graphql calls since we're ignoring the cache */ + // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; + // useEffect(() => { + // (async () => { + // if (readyResult?.success) { + // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + // await optimizelyClient.fetchQualifiedSegments(); + // } + // })(); + // }, [readyResult?.success]); + + /* There should be an error for the first call to fetchQualifiedSegments the second call should work fine + because we have a stored VUID that has segments */ + // const [userId] = useState('random-user-id'); + // const prepareClient = () => { + // // not using handleReadyResult here because we want to test the error // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + // setReadyResult(res); // }); // }; - // 10. odp network error - // const optimizelyClient = createInstance({ - // logLevel, - // sdkKey, - // datafileOptions: { - // urlTemplate: 'https://httpstat.us/521?sdkKey=%s', - // }, - // }); + /* 9. fetch should return error in the console, for segment fetch */ // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + // setReadyResult(res); // }); // }; + /* 10. Testing ODP network error. You should see a status 521 in the Console & Network tabs */ + optimizelyClient = createInstance({ + logLevel, + sdkKey, + datafileOptions: { + urlTemplate: 'https://httpstat.us/521?sdkKey=%s', + }, + }); + const [userId] = useState('matjaz-user-2'); + const prepareClient = () => { + optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { + await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + setReadyResult(res); + }); + }; + // 11. segment api timeout error // const optimizelyClient = createInstance({ // sdkKey, @@ -152,7 +162,6 @@ export const App: React.FC = () => { // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); - // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); // }); // }; @@ -168,7 +177,6 @@ export const App: React.FC = () => { // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); - // setIsSegmentsFetched(true); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); // }); // }; @@ -181,7 +189,6 @@ export const App: React.FC = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setReadyResult(res); // setFeatureKey('test_feature_1') - // setIsSegmentsFetched(true); // setEnableDecision(true); // }); // }; @@ -194,11 +201,9 @@ export const App: React.FC = () => { {readyResult?.success && ( <> -

Bug Bash Output

-

Please open your browser's "Developer tools" (Ctrl-Shift-I) for Console output

- 
-            {enableDecision && featureKey && }
-
+

Bug Bash

+

Please open your browser's "Developer tools" (Ctrl-Shift-I) for Console, Network, & Application tabs

+ 
{enableDecision && featureKey && }
)} {readyResult && !readyResult.success && ( @@ -238,4 +243,10 @@ function Decision({ userId, featureKey }: { userId: string; featureKey: string } ); } +export type OptimizelyReturnType = { + success: boolean; + reason?: string; + message?: string; +}; + export default App; diff --git a/bug-bash/app/src/App.types.tsx b/bug-bash/app/src/App.types.tsx deleted file mode 100644 index 6ca0b06f..00000000 --- a/bug-bash/app/src/App.types.tsx +++ /dev/null @@ -1,6 +0,0 @@ -export type OptimizelyReturnType = { - success: boolean; - reason?: string; - message?: string; -}; - \ No newline at end of file diff --git a/bug-bash/app/src/index.css b/bug-bash/app/src/index.css index 207cac5c..9f02e8ad 100644 --- a/bug-bash/app/src/index.css +++ b/bug-bash/app/src/index.css @@ -17,7 +17,6 @@ body { margin: 10px; display: flex; - place-items: center; min-width: 320px; min-height: 100vh; } From dc4485b0cce7cb3e49ca37be3440013d21e90aad Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 18 Aug 2023 14:13:12 +0000 Subject: [PATCH 33/54] Move Decision; Finish refactor existing tests --- bug-bash/app/src/App.tsx | 109 ++++++++++++---------------------- bug-bash/app/src/Decision.tsx | 34 +++++++++++ 2 files changed, 72 insertions(+), 71 deletions(-) create mode 100644 bug-bash/app/src/Decision.tsx diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 341b6620..a5c9159a 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -1,7 +1,9 @@ import React, { useEffect, useState } from 'react'; import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; -import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk'; +import { OdpOptions } from '@optimizely/optimizely-sdk/dist/shared_types'; +import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/shared_types'; +import Decision from './Decision'; const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local file const logLevel = 'info'; // adjust as you needed; 'debug' needed later @@ -119,10 +121,9 @@ export const App: React.FC = () => { because we have a stored VUID that has segments */ // const [userId] = useState('random-user-id'); // const prepareClient = () => { - // // not using handleReadyResult here because we want to test the error // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // setReadyResult(res); + // handleReadyResult(res); // }); // }; @@ -131,67 +132,59 @@ export const App: React.FC = () => { // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // setReadyResult(res); + // handleReadyResult(res); // }); // }; - /* 10. Testing ODP network error. You should see a status 521 in the Console & Network tabs */ - optimizelyClient = createInstance({ - logLevel, - sdkKey, - datafileOptions: { - urlTemplate: 'https://httpstat.us/521?sdkKey=%s', - }, - }); - const [userId] = useState('matjaz-user-2'); - const prepareClient = () => { - optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - setReadyResult(res); - }); - }; + /* Testing ODP network error. You should see a status 521 in the Console & Network + tabs when an ODP function is called. + + Monkey patch XMLHttpRequest's open function to make a call to a "down" ODP endpoint + */ + // const originalOpen = XMLHttpRequest.prototype.open; + // XMLHttpRequest.prototype.open = function(method:string, url:string, async:boolean) { + // url = url.includes('api.zaius.com') ? 'https://httpstat.us/521' : url; + // originalOpen.call(this, method, url, async); + // }; + // const [userId] = useState('matjaz-user-2'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; - // 11. segment api timeout error - // const optimizelyClient = createInstance({ + /* Simulate segment API timeout. Expect to see error about the audience fetching */ + // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // segmentsApiTimeout: 1, + // segmentsApiTimeout: 10, // too fast timeout // }, // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // 12. should work fine for proper timeout value - // const optimizelyClient = createInstance({ + /* Should work fine for proper timeout value */ + // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // segmentsApiTimeout: 100000, + // segmentsApiTimeout: 5_000, // reasonable timeout // }, // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; - // useEffect(prepareClient, []); - // 13. call decide for a segment user is not a part of hence user should not qualify, - // later make the user part of the segment and call decide again to check if user qualifies - // const [userId] = useState('matjaz-user-2'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // setReadyResult(res); - // setFeatureKey('test_feature_1') - // setEnableDecision(true); - // }); - // }; + /* Call decide for a segment user is not a part of hence user should not qualify, + later make the user part of the segment and call decide again to check if user qualifies */ + const [userId] = useState('matjaz-user-2'); + const prepareClient = () => { + optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { + setFeatureKey('test_feature_1') + setEnableDecision(true); + handleReadyResult(res); + }); + }; /* โฌ†๏ธ Tests are above this line โฌ†๏ธ */ @@ -217,33 +210,7 @@ export const App: React.FC = () => { ); }; -function Decision({ userId, featureKey }: { userId: string; featureKey: string }) { - const [decision, clientReady] = useDecision(featureKey, {}, { overrideUserId: userId }); - - if (!clientReady) { - return <>; - } - - const variationKey = decision.variationKey; - - if (variationKey === null) { - console.log(' decision error: ', decision['reasons']); - } - - const sortMethod = decision.variables['sort_method']; - - return ( -

- {`Flag ${ - decision.enabled ? 'on' : 'off' - }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ - decision.ruleKey - }`} -

- ); -} - -export type OptimizelyReturnType = { +type OptimizelyReturnType = { success: boolean; reason?: string; message?: string; diff --git a/bug-bash/app/src/Decision.tsx b/bug-bash/app/src/Decision.tsx new file mode 100644 index 00000000..75fdf745 --- /dev/null +++ b/bug-bash/app/src/Decision.tsx @@ -0,0 +1,34 @@ +import { useDecision } from '@optimizely/react-sdk'; +import React from 'react'; + +interface DecisionProps { + userId: string; + featureKey: string; +} + +export const Decision: React.FC = ({ userId, featureKey }) => { + const [decision, clientReady] = useDecision(featureKey, {}, { overrideUserId: userId }); + + if (!clientReady) { + return <>; + } + + const variationKey = decision.variationKey; + if (variationKey === null) { + console.log('Decision error: ', decision['reasons']); + } + + const sortMethod = decision.variables['sort_method']; + + return ( +

+ {`Flag ${ + decision.enabled ? 'on' : 'off' + }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ + decision.ruleKey + }`} +

+ ); +}; + +export default Decision; \ No newline at end of file From 381c42a9b3ba55beabeae4f38553d587a657d3fb Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 18 Aug 2023 14:58:52 +0000 Subject: [PATCH 34/54] Add more tests based on spreadsheet\ --- bug-bash/app/src/App.tsx | 74 +++++++++++++++++++++++++++++----------- 1 file changed, 54 insertions(+), 20 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index a5c9159a..0b7f4e20 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -11,6 +11,7 @@ const logLevel = 'info'; // adjust as you needed; 'debug' needed later const bugBashLog = (message: string) => { console.log(`%c๐Ÿ[BUG BASH] - ${message}`, 'color: orange; font-size: 20px;'); }; + export const App: React.FC = () => { const [featureKey, setFeatureKey] = useState('some_key'); const [readyResult, setReadyResult] = useState(); @@ -127,19 +128,18 @@ export const App: React.FC = () => { // }); // }; - /* 9. fetch should return error in the console, for segment fetch */ - // const [userId] = useState('matjaz-user-2'); + /* Try a different SDK Key that has ODP integratino OFF */ + // optimizelyClient = createInstance({ sdkKey: 'Dp4dLTSVkoP8VhYkdb4Z4', logLevel: 'debug' }); + // const [userId] = useState(null); // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // handleReadyResult(res); - // }); + // optimizelyClient.onReady().then(handleReadyResult); // }; /* Testing ODP network error. You should see a status 521 in the Console & Network tabs when an ODP function is called. Monkey patch XMLHttpRequest's open function to make a call to a "down" ODP endpoint + https://httpstat.us/521 gives a 521 status code but you can choose others to test (https://httpstat.us/ for details) */ // const originalOpen = XMLHttpRequest.prototype.open; // XMLHttpRequest.prototype.open = function(method:string, url:string, async:boolean) { @@ -155,7 +155,7 @@ export const App: React.FC = () => { // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // segmentsApiTimeout: 10, // too fast timeout + // segmentsApiTimeout: 10, // too fast timeout 10 or reasonable timeout 5_000 // }, // }); // const [userId] = useState('matjaz-user-2'); @@ -163,11 +163,56 @@ export const App: React.FC = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* Should work fine for proper timeout value */ + /* Call decide for a segment user is not a part of hence user should not qualify. + Later make the user part of the segment and call decide again to check if user qualifies + */ + // const [userId] = useState('matjaz-user-2'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { + // setFeatureKey('test_feature_1'); // flag1 or flag2 in the AAT SDK project then try again + // setEnableDecision(true); + // handleReadyResult(res); + // }); + // }; + + /* Test Promise version of fetchQualifiedSegments */ + // const [userId] = useState('matjaz-user-2'); + // const prepareClient = () => { + // optimizelyClient.onReady().then((res: OptimizelyReturnType) => { + // setFeatureKey('flag2'); + // setEnableDecision(true); + // optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); + // }); + // }; + + /* Cannot test isQualifiedFor since userContext is not exposed (only user) + You have been testing a hacky way to view the qualified segments by accessing the private property in + handleReadyResult (NOT recommended) + */ + + /* createUserContext() is done implicity in the React SDK so we cannot test it here */ + + /* React SDK Omits the getVuid(). We've been getting it from localStorage.getItem('optimizely-vuid') for browsers */ + + /* Test other ODP segments and events settings including Odp disabled + disabled?: boolean; + segmentsCache?: ICache; // probably too hard to test + segmentsCacheSize?: number; + segmentsCacheTimeout?: number; + segmentsApiTimeout?: number; + segmentsRequestHandler?: RequestHandler; // probably too hard to test + segmentManager?: IOdpSegmentManager; // probably too hard to test + eventFlushInterval?: number; + eventBatchSize?: number; + eventQueueSize?: number; + eventApiTimeout?: number; + eventRequestHandler?: RequestHandler; // probably too hard to test + eventManager?: IOdpEventManager; // probably too hard to test + */ // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // segmentsApiTimeout: 5_000, // reasonable timeout + // segmentsCacheSize: 1, // }, // }); // const [userId] = useState('matjaz-user-2'); @@ -175,17 +220,6 @@ export const App: React.FC = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* Call decide for a segment user is not a part of hence user should not qualify, - later make the user part of the segment and call decide again to check if user qualifies */ - const [userId] = useState('matjaz-user-2'); - const prepareClient = () => { - optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - setFeatureKey('test_feature_1') - setEnableDecision(true); - handleReadyResult(res); - }); - }; - /* โฌ†๏ธ Tests are above this line โฌ†๏ธ */ useEffect(prepareClient, []); From c55cb442da53ca90db83453649ec78a0b593bde3 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 18 Aug 2023 15:46:46 +0000 Subject: [PATCH 35/54] Add sendOdpEvent tests --- bug-bash/app/src/App.tsx | 80 ++++++++++++++++++++++++++++++++++++---- 1 file changed, 72 insertions(+), 8 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 0b7f4e20..557b7017 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -4,6 +4,7 @@ import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/rea import { OdpOptions } from '@optimizely/optimizely-sdk/dist/shared_types'; import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/shared_types'; import Decision from './Decision'; +import { OdpEvent } from '@optimizely/optimizely-sdk/lib/core/odp/odp_event'; const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local file const logLevel = 'info'; // adjust as you needed; 'debug' needed later @@ -181,7 +182,7 @@ export const App: React.FC = () => { // optimizelyClient.onReady().then((res: OptimizelyReturnType) => { // setFeatureKey('flag2'); // setEnableDecision(true); - // optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); + // optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); // }); // }; @@ -189,12 +190,12 @@ export const App: React.FC = () => { You have been testing a hacky way to view the qualified segments by accessing the private property in handleReadyResult (NOT recommended) */ - + /* createUserContext() is done implicity in the React SDK so we cannot test it here */ /* React SDK Omits the getVuid(). We've been getting it from localStorage.getItem('optimizely-vuid') for browsers */ - /* Test other ODP segments and events settings including Odp disabled + /* Test other ODP segments settings including Odp disabled disabled?: boolean; segmentsCache?: ICache; // probably too hard to test segmentsCacheSize?: number; @@ -202,9 +203,63 @@ export const App: React.FC = () => { segmentsApiTimeout?: number; segmentsRequestHandler?: RequestHandler; // probably too hard to test segmentManager?: IOdpSegmentManager; // probably too hard to test - eventFlushInterval?: number; - eventBatchSize?: number; - eventQueueSize?: number; + */ + // optimizelyClient = createInstance({ + // sdkKey, + // odpOptions: { + // segmentsCacheSize: 1, + // }, + // }); + // const [userId] = useState('matjaz-user-2'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; + + /* Test sending ODP events. + View the Network tab and look for zaius.gif calls and inspect the Query String Parameters + */ + // const [userId] = useState('matjaz-user-3'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(() => { + // // optimizelyClient.sendOdpEvent( + // // 'fullstack', // action + // // 'bug_bash', // type + // // new Map([['fs_user_id', 'fsUserA']]), // identifiers + // // new Map([['test_key', 'test_value']]), // data; test with various data types + // // ); + // // optimizelyClient.sendOdpEvent(''); // error; shouldn't see associated zaius.gif call + // // optimizelyClient.sendOdpEvent(null); // error + // // optimizelyClient.sendOdpEvent(undefined); // error + // }); + // }; + + /* Test when ODP endpoint is down + You can ignore OPTIONS or "preflight" requests focusing on xhr GET + */ + // const originalOpen = XMLHttpRequest.prototype.open; + // XMLHttpRequest.prototype.open = function(method: string, url: string, async: boolean) { + // url = + // url.includes('jumbe.zaius.com') && !url.includes('httpstat.us') + // ? `https://httpstat.us/521?original_url=${url}` + // : url; + // originalOpen.call(this, method, url, async); + // }; + // const [userId] = useState('matjaz-user-3'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(() => { + // optimizelyClient.sendOdpEvent( // feel free to add the loop from below + // 'fullstack', + // 'bug_bash', + // new Map([['fs_user_id', 'fsUserB']]), + // new Map([['test_count', 1]]) + // ); + // }); + // }; + + /* Test other ODP events settings + eventFlushInterval?: number; // queuing in a browser is not supported + eventBatchSize?: number; // queuing in a browser is not supported + eventQueueSize?: number; // queuing in a browser is not supported eventApiTimeout?: number; eventRequestHandler?: RequestHandler; // probably too hard to test eventManager?: IOdpEventManager; // probably too hard to test @@ -212,12 +267,21 @@ export const App: React.FC = () => { // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // segmentsCacheSize: 1, + // eventFlushInterval: 1, // }, // }); // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { - // optimizelyClient.onReady().then(handleReadyResult); + // optimizelyClient.onReady().then(() => { + // for (let i = 0; i < 10; i++) { + // optimizelyClient.sendOdpEvent( + // 'fullstack', + // 'bug_bash', + // new Map([['fs_user_id', 'fsUserC']]), + // new Map([['test_count', i]]) + // ); + // } + // }); // }; /* โฌ†๏ธ Tests are above this line โฌ†๏ธ */ From 5a0c9c85fb05af2f278d6ef62a1a86f45d4711bb Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 18 Aug 2023 16:00:58 +0000 Subject: [PATCH 36/54] Last bits of documentation --- bug-bash/app/src/App.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 557b7017..b2ff0668 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -45,10 +45,10 @@ export const App: React.FC = () => { /* Open the Developer Tools > Console tab [BUG BASH ๐Ÿ] items should show two qualified segments and a viud */ - // const [userId] = useState('matjaz-user-1'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(handleReadyResult); - // }; + const [userId] = useState('matjaz-user-1'); + const prepareClient = () => { + optimizelyClient.onReady().then(handleReadyResult); + }; /* The Console tab should now show three qualified segments and the same viud */ // const [userId] = useState('matjaz-user-2'); @@ -165,7 +165,8 @@ export const App: React.FC = () => { // }; /* Call decide for a segment user is not a part of hence user should not qualify. - Later make the user part of the segment and call decide again to check if user qualifies + Later make the user part of the segment and call decide again to check if user + Look for results in the HTML page instead of the developer tools */ // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { @@ -284,6 +285,8 @@ export const App: React.FC = () => { // }); // }; + /* You should be seeing `client_initialized` & 'identified' implied events in the Network tab throughout your testing */ + /* โฌ†๏ธ Tests are above this line โฌ†๏ธ */ useEffect(prepareClient, []); From 659e93605d8fb5a1cc4c7b425d214fe91edda9ab Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 19:40:16 +0000 Subject: [PATCH 37/54] Update to use js sdk 5.0.0-beta4 --- package.json | 2 +- yarn.lock | 43 ++++++++++--------------------------------- 2 files changed, 11 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index ed875297..0f30ad1b 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,7 @@ "access": "public" }, "dependencies": { - "@optimizely/optimizely-sdk": "^5.0.0-beta2", + "@optimizely/optimizely-sdk": "^5.0.0-beta4", "hoist-non-react-statics": "^3.3.0", "prop-types": "^15.6.2", "utility-types": "^2.1.0 || ^3.0.0" diff --git a/yarn.lock b/yarn.lock index 9cc64334..0a88d26a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -535,38 +535,15 @@ "@jridgewell/resolve-uri" "^3.0.3" "@jridgewell/sourcemap-codec" "^1.4.10" -"@optimizely/js-sdk-datafile-manager@^0.9.5": - version "0.9.5" - resolved "https://registry.yarnpkg.com/@optimizely/js-sdk-datafile-manager/-/js-sdk-datafile-manager-0.9.5.tgz#c1fa25a4bbdabe97929c72895ca2a48e28047a34" - integrity sha512-O4ujr1nBBAQBtx8YoKNpzzaEZgsE+aU4dxubT17ePqv/YVUWE+JOY21tSRrqZy/BlbbyzL+ElT8hrGB5ZzVoIQ== +"@optimizely/optimizely-sdk@^5.0.0-beta4": + version "5.0.0-beta4" + resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta4.tgz#0e7a670f79a59227eb57d96c9c431d1b24b5a76d" + integrity sha512-NFWjNEp0ruHLU75kkMDT4cJwrXXA5SUeut+8Fhda/FgXLuOiuVYLxKDMuB74SaXIFprxcZjRUnaSj9NcsJK0nQ== dependencies: - "@optimizely/js-sdk-logging" "^0.3.1" - "@optimizely/js-sdk-utils" "^0.4.0" - decompress-response "^4.2.1" - -"@optimizely/js-sdk-logging@^0.3.1": - version "0.3.1" - resolved "https://registry.npmjs.org/@optimizely/js-sdk-logging/-/js-sdk-logging-0.3.1.tgz" - integrity sha512-K71Jf283FP0E4oXehcXTTM3gvgHZHr7FUrIsw//0mdJlotHJT4Nss4hE0CWPbBxO7LJAtwNnO+VIA/YOcO4vHg== - dependencies: - "@optimizely/js-sdk-utils" "^0.4.0" - -"@optimizely/js-sdk-utils@^0.4.0": - version "0.4.0" - resolved "https://registry.npmjs.org/@optimizely/js-sdk-utils/-/js-sdk-utils-0.4.0.tgz" - integrity sha512-QG2oytnITW+VKTJK+l0RxjaS5VrA6W+AZMzpeg4LCB4Rn4BEKtF+EcW/5S1fBDLAviGq/0TLpkjM3DlFkJ9/Gw== - dependencies: - uuid "^3.3.2" - -"@optimizely/optimizely-sdk@^5.0.0-beta2": - version "5.0.0-beta2" - resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta2.tgz#83eb7ea3fb94ad6e75263c1493f219d3cfff0595" - integrity sha512-UnA5Nk1ZbmpsJoHt2uizJ+Rb0qx6Jrt2+g9rPguzbkr1HMFDiK1apod8+9NVzB98SroXSA+dHTlBc+OAVp7m4w== - dependencies: - "@optimizely/js-sdk-datafile-manager" "^0.9.5" decompress-response "^4.2.1" json-schema "^0.4.0" murmurhash "^2.0.1" + ua-parser-js "^1.0.35" uuid "^8.3.2" "@rollup/plugin-commonjs@^16.0.0": @@ -4675,6 +4652,11 @@ typescript@^4.7.4: resolved "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz" integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ== +ua-parser-js@^1.0.35: + version "1.0.35" + resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-1.0.35.tgz#c4ef44343bc3db0a3cbefdf21822f1b1fc1ab011" + integrity sha512-fKnGuqmTBnIE+/KXSzCn4db8RTigUzw1AN0DmdU6hJovUTbYJKyqj+8Mt1c4VfRDnOVJnENmfYkIPZ946UrSAA== + uglify-js@^3.4.9: version "3.16.3" resolved "https://registry.npmjs.org/uglify-js/-/uglify-js-3.16.3.tgz" @@ -4743,11 +4725,6 @@ use@^3.1.0: resolved "https://registry.npmjs.org/utility-types/-/utility-types-3.10.0.tgz" integrity sha512-O11mqxmi7wMKCo6HKFt5AhO4BwY3VV68YU07tgxfz8zJTIxr4BpsezN49Ffwy9j3ZpwwJp4fkRwjRzq3uWE6Rg== -uuid@^3.3.2: - version "3.4.0" - resolved "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz" - integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A== - uuid@^8.3.0, uuid@^8.3.2: version "8.3.2" resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2" From 8d91b301c22edbe56553bc5933cc868c0254f30e Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 19:40:53 +0000 Subject: [PATCH 38/54] WIP test updates --- bug-bash/app/src/App.tsx | 60 +++++++++++++++++++++++----------------- bug-bash/setup.sh | 2 +- 2 files changed, 35 insertions(+), 27 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index b2ff0668..483b14bb 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -6,11 +6,11 @@ import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/shared_t import Decision from './Decision'; import { OdpEvent } from '@optimizely/optimizely-sdk/lib/core/odp/odp_event'; -const sdkKey = import.meta.env.VITE_SDK_KEY as string; // update in .env.local file -const logLevel = 'info'; // adjust as you needed; 'debug' needed later +const sdkKey = import.meta.env.VITE_SDK_KEY as string; // ๐Ÿ’กupdate in .env.local file +const logLevel = 'debug'; const bugBashLog = (message: string) => { - console.log(`%c๐Ÿ[BUG BASH] - ${message}`, 'color: orange; font-size: 20px;'); + console.log(`%c๐Ÿž[BUG BASH] - ${message}`, 'color: orange; font-size: 20px;'); }; export const App: React.FC = () => { @@ -44,25 +44,32 @@ export const App: React.FC = () => { /* โฌ‡๏ธ Tests are below this line โฌ‡๏ธ */ /* Open the Developer Tools > Console tab - [BUG BASH ๐Ÿ] items should show two qualified segments and a viud */ - const [userId] = useState('matjaz-user-1'); - const prepareClient = () => { - optimizelyClient.onReady().then(handleReadyResult); - }; + [BUG BASH] items should show 2 qualified segments and a viud */ + // const [userId] = useState('matjaz-user-1'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; - /* The Console tab should now show three qualified segments and the same viud */ - // const [userId] = useState('matjaz-user-2'); + /* After a few minutes from the above test, fill in the VUID as the userid. + The Console tab should now show the same qualified segments and previous userid. + The Network graphql POST calls should have passed `query {customer(vuid : "vuid_f22c526c1e93406f82294d41e6a")` + instead of `fs_user_id` + + Try deleting the vuid by going to Application tab > Local Storage (left pane) > http://127.0.0.1:5173/ entry then + delete the optimizely-vuid entry in the middle pane then refresh the page + */ + // const [userId] = useState('vuid_f22c526c1e93406f82294d41e6a'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* The Console tab should now show no qualified segments and the same vuid */ + /* The Console tab should show empty qualified segments and the same vuid */ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* The Console tab should show no qualified segments and the same vuid */ + /* The Console tab should not show qualified segments and USER_NOT_READY error since React requires userId for usercontext */ // const [userId] = useState(null); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); @@ -77,30 +84,31 @@ export const App: React.FC = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; - /* In the Network tab, there should be 1 graphql POST calls since we're using the cache */ + /* In the Network tab, Clear the network output using the ๐Ÿšซ button. + Make a small change to this file, then look for the number of graphql POST calls.*/ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; // useEffect(() => { // (async () => { - // if (readyResult?.success) { + // if (readyResult?.success) { // await optimizelyClient.fetchQualifiedSegments(); // await optimizelyClient.fetchQualifiedSegments(); // } // })(); // }, [readyResult?.success]); - /* Now the Network tab should show 2 identical graphql POSTs since we're resetting the cache */ - // const [userId] = useState('matjaz-user-3'); + /* Now the Network tab should show 2 identical graphql POSTs since we're resetting the cache */ + // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; // useEffect(() => { // (async () => { // if (readyResult?.success) { - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); - // await optimizelyClient.fetchQualifiedSegments(); + // await optimizelyClient.fetchQualifiedSegments(); + // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.RESET_CACHE]); // } // })(); // }, [readyResult?.success]); @@ -113,21 +121,21 @@ export const App: React.FC = () => { // useEffect(() => { // (async () => { // if (readyResult?.success) { + // await optimizelyClient.fetchQualifiedSegments(); // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // await optimizelyClient.fetchQualifiedSegments(); // } // })(); // }, [readyResult?.success]); /* There should be an error for the first call to fetchQualifiedSegments the second call should work fine because we have a stored VUID that has segments */ - // const [userId] = useState('random-user-id'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - // handleReadyResult(res); - // }); - // }; + const [userId] = useState('random-user-id'); + const prepareClient = () => { + optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { + await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + handleReadyResult(res); + }); + }; /* Try a different SDK Key that has ODP integratino OFF */ // optimizelyClient = createInstance({ sdkKey: 'Dp4dLTSVkoP8VhYkdb4Z4', logLevel: 'debug' }); diff --git a/bug-bash/setup.sh b/bug-bash/setup.sh index 71f04b2d..7a6012bf 100644 --- a/bug-bash/setup.sh +++ b/bug-bash/setup.sh @@ -11,7 +11,7 @@ npm install --save --silent ../../ # Prompt for SDK key echo -echo "\033[1;38;2;0;55;255mPlease enter your SDK key: \033[0m\c" +echo "\033[1;38;2;0;55;255mPlease enter your SDK key (use TbrfRLeKvLyWGusqANoeR for AAT): \033[0m\c" read sdk_key # Check if .env.local file exists and contains SDK_KEY entry From 1f26f392a6715d65c1bd8e1eb359db613e973b7a Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 19:56:52 +0000 Subject: [PATCH 39/54] Update path to logging due to re-organized JS SDK --- src/Provider.tsx | 4 ++-- src/autoUpdate.ts | 4 ++-- src/hooks.ts | 4 ++-- src/logOnlyEventDispatcher.spec.ts | 4 ++-- src/logOnlyEventDispatcher.ts | 4 ++-- 5 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/Provider.tsx b/src/Provider.tsx index b26485de..593c90b1 100644 --- a/src/Provider.tsx +++ b/src/Provider.tsx @@ -1,5 +1,5 @@ /** - * Copyright 2022, Optimizely + * Copyright 2022-2023 Optimizely * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -15,7 +15,7 @@ */ import * as React from 'react'; import { UserAttributes } from '@optimizely/optimizely-sdk'; -import { getLogger } from '@optimizely/js-sdk-logging'; +import { getLogger } from '@optimizely/optimizely-sdk/dist/modules/logging'; import { OptimizelyContextProvider } from './Context'; import { ReactSDKClient } from './client'; diff --git a/src/autoUpdate.ts b/src/autoUpdate.ts index 31954da5..f7a87735 100644 --- a/src/autoUpdate.ts +++ b/src/autoUpdate.ts @@ -1,5 +1,5 @@ /** - * Copyright 2020, Optimizely + * Copyright 2020, 2023 Optimizely * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -14,7 +14,7 @@ * limitations under the License. */ import { enums } from '@optimizely/optimizely-sdk'; -import { LoggerFacade } from '@optimizely/js-sdk-logging'; +import { LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; import { ReactSDKClient } from './client'; diff --git a/src/hooks.ts b/src/hooks.ts index 50b82424..60a8d4df 100644 --- a/src/hooks.ts +++ b/src/hooks.ts @@ -1,5 +1,5 @@ /** - * Copyright 2018-2019, 2022, Optimizely + * Copyright 2018-2019, 2022-2023 Optimizely * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -16,7 +16,7 @@ import { useCallback, useContext, useEffect, useState, useRef } from 'react'; import { UserAttributes, OptimizelyDecideOption } from '@optimizely/optimizely-sdk'; -import { getLogger, LoggerFacade } from '@optimizely/js-sdk-logging'; +import { getLogger, LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; import { setupAutoUpdateListeners } from './autoUpdate'; import { ReactSDKClient, VariableValuesObject, OnReadyResult } from './client'; diff --git a/src/logOnlyEventDispatcher.spec.ts b/src/logOnlyEventDispatcher.spec.ts index b07d3540..85a6b9c8 100644 --- a/src/logOnlyEventDispatcher.spec.ts +++ b/src/logOnlyEventDispatcher.spec.ts @@ -1,9 +1,9 @@ -jest.mock('@optimizely/js-sdk-logging', () => ({ +jest.mock('@optimizely/optimizely-sdk/dist/modules/logging', () => ({ getLogger: jest.fn().mockReturnValue({ debug: jest.fn() }), })); import logOnlyEventDispatcher from './logOnlyEventDispatcher'; -import * as logging from '@optimizely/js-sdk-logging'; +import * as logging from '@optimizely/optimizely-sdk/dist/modules/logging'; const logger = logging.getLogger('ReactSDK'); diff --git a/src/logOnlyEventDispatcher.ts b/src/logOnlyEventDispatcher.ts index b3974226..fb8bf6f4 100644 --- a/src/logOnlyEventDispatcher.ts +++ b/src/logOnlyEventDispatcher.ts @@ -1,5 +1,5 @@ /** - * Copyright 2019, Optimizely + * Copyright 2019, 2023 Optimizely * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -15,7 +15,7 @@ */ import * as optimizely from '@optimizely/optimizely-sdk'; -import * as logging from '@optimizely/js-sdk-logging'; +import * as logging from '@optimizely/optimizely-sdk/dist/modules/logging'; const logger = logging.getLogger('ReactSDK'); From 4ca21b6d7fc767b51ab8334ae8887c5f249091d6 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 19:57:18 +0000 Subject: [PATCH 40/54] Update bug bash to package-lock.json --- bug-bash/app/package-lock.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/bug-bash/app/package-lock.json b/bug-bash/app/package-lock.json index 10b2143a..1062013e 100644 --- a/bug-bash/app/package-lock.json +++ b/bug-bash/app/package-lock.json @@ -30,7 +30,7 @@ "version": "2.9.2", "license": "Apache-2.0", "dependencies": { - "@optimizely/optimizely-sdk": "^5.0.0-beta2", + "@optimizely/optimizely-sdk": "^5.0.0-beta4", "hoist-non-react-statics": "^3.3.0", "prop-types": "^15.6.2", "utility-types": "^2.1.0 || ^3.0.0" From 9f4c00c0d7b037d43d928a266e7c0175ecf2c894 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 20:36:26 +0000 Subject: [PATCH 41/54] =?UTF-8?q?Add=20@types/uuid=20=F0=9F=A4=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + yarn.lock | 5 +++++ 2 files changed, 6 insertions(+) diff --git a/package.json b/package.json index 0f30ad1b..a5b36e70 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ }, "dependencies": { "@optimizely/optimizely-sdk": "^5.0.0-beta4", + "@types/uuid": "^9.0.2", "hoist-non-react-statics": "^3.3.0", "prop-types": "^15.6.2", "utility-types": "^2.1.0 || ^3.0.0" diff --git a/yarn.lock b/yarn.lock index 0a88d26a..ab36133d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -808,6 +808,11 @@ dependencies: "@types/jest" "*" +"@types/uuid@^9.0.2": + version "9.0.2" + resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-9.0.2.tgz#ede1d1b1e451548d44919dc226253e32a6952c4b" + integrity sha512-kNnC1GFBLuhImSnV7w4njQkUiJi0ZXUycu1rUaouPqiKlXkh77JKgdRnTAp1x5eBwcIwbtI+3otwzuIDEuDoxQ== + "@types/yargs-parser@*": version "21.0.0" resolved "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.0.tgz" From ec875cdfed070599ca2e8365db27127edb149e6e Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 20:36:59 +0000 Subject: [PATCH 42/54] Use /lib/ instead of /dist/ from JS SDK --- src/Provider.tsx | 2 +- src/autoUpdate.ts | 2 +- src/hooks.ts | 2 +- src/logOnlyEventDispatcher.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/Provider.tsx b/src/Provider.tsx index 593c90b1..cf416ce6 100644 --- a/src/Provider.tsx +++ b/src/Provider.tsx @@ -15,7 +15,7 @@ */ import * as React from 'react'; import { UserAttributes } from '@optimizely/optimizely-sdk'; -import { getLogger } from '@optimizely/optimizely-sdk/dist/modules/logging'; +import { getLogger } from '@optimizely/optimizely-sdk/lib/modules/logging'; import { OptimizelyContextProvider } from './Context'; import { ReactSDKClient } from './client'; diff --git a/src/autoUpdate.ts b/src/autoUpdate.ts index f7a87735..7484aeff 100644 --- a/src/autoUpdate.ts +++ b/src/autoUpdate.ts @@ -14,7 +14,7 @@ * limitations under the License. */ import { enums } from '@optimizely/optimizely-sdk'; -import { LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; +import { LoggerFacade } from '@optimizely/optimizely-sdk/lib/modules/logging'; import { ReactSDKClient } from './client'; diff --git a/src/hooks.ts b/src/hooks.ts index 60a8d4df..05c6d85b 100644 --- a/src/hooks.ts +++ b/src/hooks.ts @@ -16,7 +16,7 @@ import { useCallback, useContext, useEffect, useState, useRef } from 'react'; import { UserAttributes, OptimizelyDecideOption } from '@optimizely/optimizely-sdk'; -import { getLogger, LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; +import { getLogger, LoggerFacade } from '@optimizely/optimizely-sdk/lib/modules/logging'; import { setupAutoUpdateListeners } from './autoUpdate'; import { ReactSDKClient, VariableValuesObject, OnReadyResult } from './client'; diff --git a/src/logOnlyEventDispatcher.ts b/src/logOnlyEventDispatcher.ts index fb8bf6f4..b3ad347f 100644 --- a/src/logOnlyEventDispatcher.ts +++ b/src/logOnlyEventDispatcher.ts @@ -15,7 +15,7 @@ */ import * as optimizely from '@optimizely/optimizely-sdk'; -import * as logging from '@optimizely/optimizely-sdk/dist/modules/logging'; +import * as logging from '@optimizely/optimizely-sdk/lib/modules/logging'; const logger = logging.getLogger('ReactSDK'); From 03f4779c4a95e42957505acca5e13fb8350d887a Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Tue, 22 Aug 2023 20:50:38 +0000 Subject: [PATCH 43/54] Reset for other bashers --- bug-bash/app/src/App.tsx | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 483b14bb..0eb9c443 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -45,10 +45,10 @@ export const App: React.FC = () => { /* Open the Developer Tools > Console tab [BUG BASH] items should show 2 qualified segments and a viud */ - // const [userId] = useState('matjaz-user-1'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(handleReadyResult); - // }; + const [userId] = useState('matjaz-user-1'); + const prepareClient = () => { + optimizelyClient.onReady().then(handleReadyResult); + }; /* After a few minutes from the above test, fill in the VUID as the userid. The Console tab should now show the same qualified segments and previous userid. @@ -129,13 +129,13 @@ export const App: React.FC = () => { /* There should be an error for the first call to fetchQualifiedSegments the second call should work fine because we have a stored VUID that has segments */ - const [userId] = useState('random-user-id'); - const prepareClient = () => { - optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { - await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); - handleReadyResult(res); - }); - }; + // const [userId] = useState('random-user-id'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { + // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); + // handleReadyResult(res); + // }); + // }; /* Try a different SDK Key that has ODP integratino OFF */ // optimizelyClient = createInstance({ sdkKey: 'Dp4dLTSVkoP8VhYkdb4Z4', logLevel: 'debug' }); From 47460efed4a9f466f37c342e74cb1285b5be4eef Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Wed, 23 Aug 2023 19:48:33 +0000 Subject: [PATCH 44/54] Add more documentation --- bug-bash/app/src/App.tsx | 36 ++++++++++++++++++++++-------------- 1 file changed, 22 insertions(+), 14 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 0eb9c443..84543c39 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -129,7 +129,7 @@ export const App: React.FC = () => { /* There should be an error for the first call to fetchQualifiedSegments the second call should work fine because we have a stored VUID that has segments */ - // const [userId] = useState('random-user-id'); + // const [userId] = useState('random-user-change-me-every-time'); // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -137,7 +137,7 @@ export const App: React.FC = () => { // }); // }; - /* Try a different SDK Key that has ODP integratino OFF */ + /* Try a different SDK Key that has ODP integration OFF. You'll need to refresh your page*/ // optimizelyClient = createInstance({ sdkKey: 'Dp4dLTSVkoP8VhYkdb4Z4', logLevel: 'debug' }); // const [userId] = useState(null); // const prepareClient = () => { @@ -149,18 +149,19 @@ export const App: React.FC = () => { Monkey patch XMLHttpRequest's open function to make a call to a "down" ODP endpoint https://httpstat.us/521 gives a 521 status code but you can choose others to test (https://httpstat.us/ for details) + Use https://httpstat.us/408?sleep=20000 to have the connection timeout after 20 seconds */ // const originalOpen = XMLHttpRequest.prototype.open; // XMLHttpRequest.prototype.open = function(method:string, url:string, async:boolean) { - // url = url.includes('api.zaius.com') ? 'https://httpstat.us/521' : url; + // url = url.includes('api.zaius.com') ? 'https://httpstat.us/521' : url; // originalOpen.call(this, method, url, async); // }; // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); - // }; + // }; - /* Simulate segment API timeout. Expect to see error about the audience fetching */ + /* Simulate segment API timeout. Expect to see error about the audience fetching too fast then update to a reasonable timeout*/ // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { @@ -174,7 +175,7 @@ export const App: React.FC = () => { /* Call decide for a segment user is not a part of hence user should not qualify. Later make the user part of the segment and call decide again to check if user - Look for results in the HTML page instead of the developer tools + Look for results in the HTML page or filter your Console output for DECISION_SERVICE */ // const [userId] = useState('matjaz-user-2'); // const prepareClient = () => { @@ -202,7 +203,8 @@ export const App: React.FC = () => { /* createUserContext() is done implicity in the React SDK so we cannot test it here */ - /* React SDK Omits the getVuid(). We've been getting it from localStorage.getItem('optimizely-vuid') for browsers */ + /* React SDK Omits the getVuid(). We've been getting it from localStorage.getItem('optimizely-vuid') for browsers + otherwise it's not available for non-browser contexts (react native uses asyncstorage)*/ /* Test other ODP segments settings including Odp disabled disabled?: boolean; @@ -212,6 +214,8 @@ export const App: React.FC = () => { segmentsApiTimeout?: number; segmentsRequestHandler?: RequestHandler; // probably too hard to test segmentManager?: IOdpSegmentManager; // probably too hard to test + + You'll be looking at the Console tab; filter to "cache" */ // optimizelyClient = createInstance({ // sdkKey, @@ -226,16 +230,18 @@ export const App: React.FC = () => { /* Test sending ODP events. View the Network tab and look for zaius.gif calls and inspect the Query String Parameters + Also review the Console tab */ // const [userId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(() => { - // // optimizelyClient.sendOdpEvent( - // // 'fullstack', // action - // // 'bug_bash', // type - // // new Map([['fs_user_id', 'fsUserA']]), // identifiers - // // new Map([['test_key', 'test_value']]), // data; test with various data types - // // ); + // /* Uncomment each of the following individually to test scenarios of ODP event data*/ + // optimizelyClient.sendOdpEvent( + // 'fullstack', // action + // 'bug_bash', // type + // new Map([['fs_user_id', 'fsUserA']]), // identifiers; feel free to remove the data from here `new Map()` or edit the key-values + // new Map([['test_key', 'test_value']]), // data; test with various data types + // ); // // optimizelyClient.sendOdpEvent(''); // error; shouldn't see associated zaius.gif call // // optimizelyClient.sendOdpEvent(null); // error // // optimizelyClient.sendOdpEvent(undefined); // error @@ -266,6 +272,7 @@ export const App: React.FC = () => { // }; /* Test other ODP events settings + disabled?: boolean eventFlushInterval?: number; // queuing in a browser is not supported eventBatchSize?: number; // queuing in a browser is not supported eventQueueSize?: number; // queuing in a browser is not supported @@ -276,7 +283,8 @@ export const App: React.FC = () => { // optimizelyClient = createInstance({ // sdkKey, // odpOptions: { - // eventFlushInterval: 1, + // disabled: true, + // eventFlushInterval: 10, // }, // }); // const [userId] = useState('matjaz-user-2'); From 04dc93f25d0d36c74808b2262d44264e2ddde3b7 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 25 Aug 2023 14:39:14 +0000 Subject: [PATCH 45/54] Upgrade vulnerable tough-cookie to v4.1.3 --- package.json | 1 + yarn.lock | 33 +++++++++++++++++++++++++++++++++ 2 files changed, 34 insertions(+) diff --git a/package.json b/package.json index a5b36e70..0245fc48 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "@types/uuid": "^9.0.2", "hoist-non-react-statics": "^3.3.0", "prop-types": "^15.6.2", + "tough-cookie": "4.1.3", "utility-types": "^2.1.0 || ^3.0.0" }, "peerDependencies": { diff --git a/yarn.lock b/yarn.lock index ab36133d..99ab0b9d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3835,6 +3835,11 @@ punycode@^2.1.0, punycode@^2.1.1: resolved "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz" integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== +querystringify@^2.1.1: + version "2.2.0" + resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.2.0.tgz#3345941b4153cb9d082d8eee4cda2016a9aef7f6" + integrity sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ== + react-dom@^18.2.0: version "18.2.0" resolved "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz" @@ -3944,6 +3949,11 @@ require-main-filename@^2.0.0: resolved "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz" integrity sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg== +requires-port@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff" + integrity sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ== + resolve-cwd@^3.0.0: version "3.0.0" resolved "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-3.0.0.tgz" @@ -4563,6 +4573,16 @@ to-regex@^3.0.1, to-regex@^3.0.2: regex-not "^1.0.2" safe-regex "^1.1.0" +tough-cookie@4.1.3: + version "4.1.3" + resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.3.tgz#97b9adb0728b42280aa3d814b6b999b2ff0318bf" + integrity sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw== + dependencies: + psl "^1.1.33" + punycode "^2.1.1" + universalify "^0.2.0" + url-parse "^1.5.3" + tough-cookie@^4.0.0: version "4.0.0" resolved "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.0.0.tgz" @@ -4692,6 +4712,11 @@ universalify@^0.1.0, universalify@^0.1.2: resolved "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz" integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg== +universalify@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.2.0.tgz#6451760566fa857534745ab1dde952d1b1761be0" + integrity sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg== + unset-value@^1.0.0: version "1.0.0" resolved "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz" @@ -4720,6 +4745,14 @@ urix@^0.1.0: resolved "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz" integrity sha512-Am1ousAhSLBeB9cG/7k7r2R0zj50uDRlZHPGbazid5s9rlF1F/QKYObEKSIunSjIOkJZqwRRLpvewjEkM7pSqg== +url-parse@^1.5.3: + version "1.5.10" + resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.10.tgz#9d3c2f736c1d75dd3bd2be507dcc111f1e2ea9c1" + integrity sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ== + dependencies: + querystringify "^2.1.1" + requires-port "^1.0.0" + use@^3.1.0: version "3.1.1" resolved "https://registry.npmjs.org/use/-/use-3.1.1.tgz" From 07b779e1e071773ebdf230b2b8aeaa83ca243864 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 25 Aug 2023 20:34:44 +0000 Subject: [PATCH 46/54] Add "repository" field to package.json Thanks @iamstarkov --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 0245fc48..d613364b 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "2.9.2", "description": "React SDK for Optimizely Feature Experimentation, Optimizely Full Stack (legacy), and Optimizely Rollouts", "homepage": "https://github.com/optimizely/react-sdk", + "repository": "https://github.com/optimizely/react-sdk", "license": "Apache-2.0", "module": "dist/react-sdk.es.js", "types": "dist/index.d.ts", From c997ba25cab4d637d4e8b669fafbde12a7846964 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Mon, 28 Aug 2023 15:52:19 +0000 Subject: [PATCH 47/54] Add `useContext` documentation from... @raphaeleidus in #165 --- README.md | 38 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) diff --git a/README.md b/README.md index 9b072593..78f3f523 100644 --- a/README.md +++ b/README.md @@ -286,6 +286,44 @@ const WrappedMyComponent = withOptimizely(MyComp); **_Note:_** The `optimizely` client object provided via `withOptimizely` is automatically associated with the `user` prop passed to the ancestor `OptimizelyProvider` - the `id` and `attributes` from that `user` object will be automatically forwarded to all appropriate SDK method calls. So, there is no need to pass the `userId` or `attributes` arguments when calling methods of the `optimizely` client object, unless you wish to use _different_ `userId` or `attributes` than those given to `OptimizelyProvider`. +## `useContext` + +Any component under the `` can access the Optimizely `ReactSDKClient` via the `OptimizelyContext` with `useContext`. + +_arguments_ +- `OptimizelyContext : React.Context` The Optimizely context initialized in a parent component (or App). + +_returns_ +- Wrapped object: + - `optimizely : ReactSDKClient` The client object which was passed to the `OptimizelyProvider` + - `isServerSide : boolean` Value that was passed to the `OptimizelyProvider` + - `timeout : number | undefined` The timeout which was passed to the `OptimizelyProvider` + +### Example + +```jsx +import React, { useContext } from 'react'; +import { OptimizelyContext } from '@optimizely/react-sdk'; + +function MyComponent() { + const { optimizely, isServerSide, timeout } = useContext(OptimizelyContext); + const decision = optimizely.decide('my-feature'); + const onClick = () => { + optimizely.track('signup-clicked'); + // rest of your click handling code + }; + return ( + <> + { decision.enabled &&

My feature is enabled

} + { !decision.enabled &&

My feature is disabled

} + { decision.variationKey === 'control-variation' &&

Current Variation

} + { decision.variationKey === 'experimental-variation' &&

Better Variation

} + + + ); +} +``` + ### Tracking Use the `withOptimizely` HoC for tracking. From 0cc6b3d42921d17642350fc48b31f942645022cf Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Mon, 28 Aug 2023 15:54:26 +0000 Subject: [PATCH 48/54] Add EOF lines --- .gitignore | 2 +- .vscode/settings.json | 2 +- bug-bash/.gitattributes | 2 +- bug-bash/app/src/App.css | 2 +- bug-bash/app/src/Decision.tsx | 2 +- bug-bash/app/src/index.css | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/.gitignore b/.gitignore index ddb1a126..98ffa792 100644 --- a/.gitignore +++ b/.gitignore @@ -7,4 +7,4 @@ lib dist/ build/ .rpt2_cache -.env \ No newline at end of file +.env diff --git a/.vscode/settings.json b/.vscode/settings.json index 0eb9c9d0..909ee3f0 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,4 +6,4 @@ }, "jest.jestCommandLine": "./node_modules/.bin/jest", "jest.autoRevealOutput": "on-exec-error" -} \ No newline at end of file +} diff --git a/bug-bash/.gitattributes b/bug-bash/.gitattributes index 526c8a38..dfdb8b77 100644 --- a/bug-bash/.gitattributes +++ b/bug-bash/.gitattributes @@ -1 +1 @@ -*.sh text eol=lf \ No newline at end of file +*.sh text eol=lf diff --git a/bug-bash/app/src/App.css b/bug-bash/app/src/App.css index 027945e4..902778b7 100644 --- a/bug-bash/app/src/App.css +++ b/bug-bash/app/src/App.css @@ -3,4 +3,4 @@ margin: 0 auto; padding: 2rem; text-align: center; -} \ No newline at end of file +} diff --git a/bug-bash/app/src/Decision.tsx b/bug-bash/app/src/Decision.tsx index 75fdf745..8665dd36 100644 --- a/bug-bash/app/src/Decision.tsx +++ b/bug-bash/app/src/Decision.tsx @@ -31,4 +31,4 @@ export const Decision: React.FC = ({ userId, featureKey }) => { ); }; -export default Decision; \ No newline at end of file +export default Decision; diff --git a/bug-bash/app/src/index.css b/bug-bash/app/src/index.css index 9f02e8ad..b87458ee 100644 --- a/bug-bash/app/src/index.css +++ b/bug-bash/app/src/index.css @@ -24,4 +24,4 @@ body { h1 { font-size: 3.2em; line-height: 1.1; -} \ No newline at end of file +} From 0e595495d0e9550eefe63289325f46f8a6671e20 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 15:04:36 +0000 Subject: [PATCH 49/54] Remove React.StrictMode --- bug-bash/app/src/main.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/bug-bash/app/src/main.tsx b/bug-bash/app/src/main.tsx index 3d7150da..a4d5ce7e 100644 --- a/bug-bash/app/src/main.tsx +++ b/bug-bash/app/src/main.tsx @@ -1,10 +1,7 @@ -import React from 'react' import ReactDOM from 'react-dom/client' import App from './App.tsx' import './index.css' ReactDOM.createRoot(document.getElementById('root')!).render( - - , ) From 4ebbb4349f0372931dfb532a96cff4c0ab1457d3 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 15:05:35 +0000 Subject: [PATCH 50/54] Remove Vite icon ref --- bug-bash/app/index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/bug-bash/app/index.html b/bug-bash/app/index.html index e4b78eae..1bd99ac0 100644 --- a/bug-bash/app/index.html +++ b/bug-bash/app/index.html @@ -2,7 +2,6 @@ - Vite + React + TS From 814d54e2bffe99fe6a2957b5b17b61a1c79b3fd1 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 18:52:10 +0000 Subject: [PATCH 51/54] Add decision button to change userId --- bug-bash/app/src/App.tsx | 60 +++++++++++++++++++++-------------- bug-bash/app/src/Decision.tsx | 36 ++++++++++++++++----- 2 files changed, 64 insertions(+), 32 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 84543c39..7bc7b40e 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -45,10 +45,10 @@ export const App: React.FC = () => { /* Open the Developer Tools > Console tab [BUG BASH] items should show 2 qualified segments and a viud */ - const [userId] = useState('matjaz-user-1'); - const prepareClient = () => { - optimizelyClient.onReady().then(handleReadyResult); - }; + // const [userId, setUserId] = useState('matjaz-user-1'); + // const prepareClient = () => { + // optimizelyClient.onReady().then(handleReadyResult); + // }; /* After a few minutes from the above test, fill in the VUID as the userid. The Console tab should now show the same qualified segments and previous userid. @@ -58,19 +58,19 @@ export const App: React.FC = () => { Try deleting the vuid by going to Application tab > Local Storage (left pane) > http://127.0.0.1:5173/ entry then delete the optimizely-vuid entry in the middle pane then refresh the page */ - // const [userId] = useState('vuid_f22c526c1e93406f82294d41e6a'); + // const [userId, setUserId] = useState('vuid_f22c526c1e93406f82294d41e6a'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; /* The Console tab should show empty qualified segments and the same vuid */ - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; /* The Console tab should not show qualified segments and USER_NOT_READY error since React requires userId for usercontext */ - // const [userId] = useState(null); + // const [userId, setUserId] = useState(null); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -79,14 +79,14 @@ export const App: React.FC = () => { Look for graphql calls that are POST requests (you can ignore the OPTIONS calls) Click the latest one and inspect the Payload There should be a `vuid: vuid_xxxxx` as the vuid and there should not be a fs_userid sent */ - // const [userId] = useState('vuid_overridden'); + // const [userId, setUserId] = useState('vuid_overridden'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; /* In the Network tab, Clear the network output using the ๐Ÿšซ button. Make a small change to this file, then look for the number of graphql POST calls.*/ - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -100,7 +100,7 @@ export const App: React.FC = () => { // }, [readyResult?.success]); /* Now the Network tab should show 2 identical graphql POSTs since we're resetting the cache */ - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -114,7 +114,7 @@ export const App: React.FC = () => { // }, [readyResult?.success]); /* Again, in the Network tab should show 2 graphql calls since we're ignoring the cache */ - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -129,7 +129,7 @@ export const App: React.FC = () => { /* There should be an error for the first call to fetchQualifiedSegments the second call should work fine because we have a stored VUID that has segments */ - // const [userId] = useState('random-user-change-me-every-time'); + // const [userId, setUserId] = useState('random-user-change-me-every-time'); // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // await optimizelyClient.fetchQualifiedSegments([OptimizelySegmentOption.IGNORE_CACHE]); @@ -139,7 +139,7 @@ export const App: React.FC = () => { /* Try a different SDK Key that has ODP integration OFF. You'll need to refresh your page*/ // optimizelyClient = createInstance({ sdkKey: 'Dp4dLTSVkoP8VhYkdb4Z4', logLevel: 'debug' }); - // const [userId] = useState(null); + // const [userId, setUserId] = useState(null); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -156,7 +156,7 @@ export const App: React.FC = () => { // url = url.includes('api.zaius.com') ? 'https://httpstat.us/521' : url; // originalOpen.call(this, method, url, async); // }; - // const [userId] = useState('matjaz-user-2'); + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -168,7 +168,7 @@ export const App: React.FC = () => { // segmentsApiTimeout: 10, // too fast timeout 10 or reasonable timeout 5_000 // }, // }); - // const [userId] = useState('matjaz-user-2'); + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -176,8 +176,8 @@ export const App: React.FC = () => { /* Call decide for a segment user is not a part of hence user should not qualify. Later make the user part of the segment and call decide again to check if user Look for results in the HTML page or filter your Console output for DECISION_SERVICE - */ - // const [userId] = useState('matjaz-user-2'); + */ + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(async (res: OptimizelyReturnType) => { // setFeatureKey('test_feature_1'); // flag1 or flag2 in the AAT SDK project then try again @@ -187,14 +187,26 @@ export const App: React.FC = () => { // }; /* Test Promise version of fetchQualifiedSegments */ - // const [userId] = useState('matjaz-user-2'); + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then((res: OptimizelyReturnType) => { // setFeatureKey('flag2'); // setEnableDecision(true); // optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); // }); - // }; + // }; + + /* Test changing a user that is enabled matjaz-user-1 to a disabled matjaz-user-3 + Look for a button on the HTML. + */ + const [userId, setUserId] = useState('matjaz-user-1'); + const prepareClient = () => { + optimizelyClient.onReady().then((res: OptimizelyReturnType) => { + setFeatureKey('flag2'); + setEnableDecision(true); + optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); + }); + }; /* Cannot test isQualifiedFor since userContext is not exposed (only user) You have been testing a hacky way to view the qualified segments by accessing the private property in @@ -223,7 +235,7 @@ export const App: React.FC = () => { // segmentsCacheSize: 1, // }, // }); - // const [userId] = useState('matjaz-user-2'); + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(handleReadyResult); // }; @@ -232,7 +244,7 @@ export const App: React.FC = () => { View the Network tab and look for zaius.gif calls and inspect the Query String Parameters Also review the Console tab */ - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(() => { // /* Uncomment each of the following individually to test scenarios of ODP event data*/ @@ -259,7 +271,7 @@ export const App: React.FC = () => { // : url; // originalOpen.call(this, method, url, async); // }; - // const [userId] = useState('matjaz-user-3'); + // const [userId, setUserId] = useState('matjaz-user-3'); // const prepareClient = () => { // optimizelyClient.onReady().then(() => { // optimizelyClient.sendOdpEvent( // feel free to add the loop from below @@ -287,7 +299,7 @@ export const App: React.FC = () => { // eventFlushInterval: 10, // }, // }); - // const [userId] = useState('matjaz-user-2'); + // const [userId, setUserId] = useState('matjaz-user-2'); // const prepareClient = () => { // optimizelyClient.onReady().then(() => { // for (let i = 0; i < 10; i++) { @@ -313,7 +325,7 @@ export const App: React.FC = () => { <>

Bug Bash

Please open your browser's "Developer tools" (Ctrl-Shift-I) for Console, Network, & Application tabs

- 
{enableDecision && featureKey && }
+ 
{enableDecision && featureKey && }
)} {readyResult && !readyResult.success && ( diff --git a/bug-bash/app/src/Decision.tsx b/bug-bash/app/src/Decision.tsx index 8665dd36..f0e2e506 100644 --- a/bug-bash/app/src/Decision.tsx +++ b/bug-bash/app/src/Decision.tsx @@ -4,9 +4,10 @@ import React from 'react'; interface DecisionProps { userId: string; featureKey: string; + setUserId: React.Dispatch>; } -export const Decision: React.FC = ({ userId, featureKey }) => { +export const Decision: React.FC = ({ userId, featureKey, setUserId }) => { const [decision, clientReady] = useDecision(featureKey, {}, { overrideUserId: userId }); if (!clientReady) { @@ -20,14 +21,33 @@ export const Decision: React.FC = ({ userId, featureKey }) => { const sortMethod = decision.variables['sort_method']; + const matjaz = { + enabled: 'matjaz-user-1', + disabled: 'matjaz-user-3', + } + const handleClick = () => { + setUserId(userId === matjaz.enabled ? matjaz.disabled : matjaz.enabled); + }; + return ( -

- {`Flag ${ - decision.enabled ? 'on' : 'off' - }. User number ${userId} saw flag variation: ${variationKey} and got products sorted by: ${sortMethod} config variable as part of flag rule: ${ - decision.ruleKey - }`} -

+ <> +
+ {`Flag ${ + decision.enabled ? 'on' : 'off' + }. User id '${userId}' saw flag variation '${variationKey}' and got products sorted by '${sortMethod}' config variable as part of flag rule '${ + decision.ruleKey + }'`} +
+ + {Object.values(matjaz).includes(userId) && ( +
+ Some testing will need to toggle users + +
+ )} + ); }; From 566775891594563b79fe29ad0e9efbccddb5e525 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 18:56:54 +0000 Subject: [PATCH 52/54] Remove variationKey validation --- bug-bash/app/src/Decision.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/bug-bash/app/src/Decision.tsx b/bug-bash/app/src/Decision.tsx index f0e2e506..93c471fb 100644 --- a/bug-bash/app/src/Decision.tsx +++ b/bug-bash/app/src/Decision.tsx @@ -1,3 +1,4 @@ +import { ConsoleLogHandler } from '@optimizely/optimizely-sdk/dist/modules/logging'; import { useDecision } from '@optimizely/react-sdk'; import React from 'react'; @@ -14,11 +15,6 @@ export const Decision: React.FC = ({ userId, featureKey, setUserI return <>; } - const variationKey = decision.variationKey; - if (variationKey === null) { - console.log('Decision error: ', decision['reasons']); - } - const sortMethod = decision.variables['sort_method']; const matjaz = { @@ -34,7 +30,7 @@ export const Decision: React.FC = ({ userId, featureKey, setUserI
{`Flag ${ decision.enabled ? 'on' : 'off' - }. User id '${userId}' saw flag variation '${variationKey}' and got products sorted by '${sortMethod}' config variable as part of flag rule '${ + }. User id '${userId}' saw flag variation '${decision.variationKey}' and got products sorted by '${sortMethod}' config variable as part of flag rule '${ decision.ruleKey }'`}
From 4cd67ed562989b846c9286328e47dc2dc1752b58 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 19:09:47 +0000 Subject: [PATCH 53/54] Upgrade to JS SDK 5.0.0-beta5 --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index d613364b..92de8453 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ "access": "public" }, "dependencies": { - "@optimizely/optimizely-sdk": "^5.0.0-beta4", + "@optimizely/optimizely-sdk": "5.0.0-beta5", "@types/uuid": "^9.0.2", "hoist-non-react-statics": "^3.3.0", "prop-types": "^15.6.2", diff --git a/yarn.lock b/yarn.lock index 99ab0b9d..fc16a08a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -535,10 +535,10 @@ "@jridgewell/resolve-uri" "^3.0.3" "@jridgewell/sourcemap-codec" "^1.4.10" -"@optimizely/optimizely-sdk@^5.0.0-beta4": - version "5.0.0-beta4" - resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta4.tgz#0e7a670f79a59227eb57d96c9c431d1b24b5a76d" - integrity sha512-NFWjNEp0ruHLU75kkMDT4cJwrXXA5SUeut+8Fhda/FgXLuOiuVYLxKDMuB74SaXIFprxcZjRUnaSj9NcsJK0nQ== +"@optimizely/optimizely-sdk@5.0.0-beta5": + version "5.0.0-beta5" + resolved "https://registry.yarnpkg.com/@optimizely/optimizely-sdk/-/optimizely-sdk-5.0.0-beta5.tgz#67ac961be3d1269d2774ec758659d42a3e763e38" + integrity sha512-xQ1Lv306d9xQoK/vr0o4Wpn53gJNVUeJVi8N90NinDYjtFPsXasdWEFNXNN+qH678VmdpBsPPKLg/5olLoFrKg== dependencies: decompress-response "^4.2.1" json-schema "^0.4.0" From 3a958b8cae5c9628f369a612b22aa176d018ef94 Mon Sep 17 00:00:00 2001 From: Mike Chu Date: Fri, 1 Sep 2023 19:09:58 +0000 Subject: [PATCH 54/54] Fix references to remove /lib --- bug-bash/app/src/App.tsx | 28 +++++++++++++--------------- src/Provider.tsx | 2 +- src/autoUpdate.ts | 2 +- src/hooks.ts | 3 ++- src/logOnlyEventDispatcher.ts | 2 +- 5 files changed, 18 insertions(+), 19 deletions(-) diff --git a/bug-bash/app/src/App.tsx b/bug-bash/app/src/App.tsx index 7bc7b40e..0d15b825 100644 --- a/bug-bash/app/src/App.tsx +++ b/bug-bash/app/src/App.tsx @@ -1,10 +1,8 @@ import React, { useEffect, useState } from 'react'; import { createInstance, OptimizelyProvider, useDecision } from '@optimizely/react-sdk'; -import { OdpOptions } from '@optimizely/optimizely-sdk/dist/shared_types'; -import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk/lib/shared_types'; +import { OptimizelySegmentOption } from '@optimizely/optimizely-sdk'; import Decision from './Decision'; -import { OdpEvent } from '@optimizely/optimizely-sdk/lib/core/odp/odp_event'; const sdkKey = import.meta.env.VITE_SDK_KEY as string; // ๐Ÿ’กupdate in .env.local file const logLevel = 'debug'; @@ -45,10 +43,10 @@ export const App: React.FC = () => { /* Open the Developer Tools > Console tab [BUG BASH] items should show 2 qualified segments and a viud */ - // const [userId, setUserId] = useState('matjaz-user-1'); - // const prepareClient = () => { - // optimizelyClient.onReady().then(handleReadyResult); - // }; + const [userId, setUserId] = useState('matjaz-user-1'); + const prepareClient = () => { + optimizelyClient.onReady().then(handleReadyResult); + }; /* After a few minutes from the above test, fill in the VUID as the userid. The Console tab should now show the same qualified segments and previous userid. @@ -199,14 +197,14 @@ export const App: React.FC = () => { /* Test changing a user that is enabled matjaz-user-1 to a disabled matjaz-user-3 Look for a button on the HTML. */ - const [userId, setUserId] = useState('matjaz-user-1'); - const prepareClient = () => { - optimizelyClient.onReady().then((res: OptimizelyReturnType) => { - setFeatureKey('flag2'); - setEnableDecision(true); - optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); - }); - }; + // const [userId, setUserId] = useState('matjaz-user-1'); + // const prepareClient = () => { + // optimizelyClient.onReady().then((res: OptimizelyReturnType) => { + // setFeatureKey('flag2'); + // setEnableDecision(true); + // optimizelyClient.fetchQualifiedSegments().then(() => handleReadyResult(res)); + // }); + // }; /* Cannot test isQualifiedFor since userContext is not exposed (only user) You have been testing a hacky way to view the qualified segments by accessing the private property in diff --git a/src/Provider.tsx b/src/Provider.tsx index cf416ce6..3c0f6fe8 100644 --- a/src/Provider.tsx +++ b/src/Provider.tsx @@ -15,7 +15,7 @@ */ import * as React from 'react'; import { UserAttributes } from '@optimizely/optimizely-sdk'; -import { getLogger } from '@optimizely/optimizely-sdk/lib/modules/logging'; +import { getLogger } from '@optimizely/optimizely-sdk'; import { OptimizelyContextProvider } from './Context'; import { ReactSDKClient } from './client'; diff --git a/src/autoUpdate.ts b/src/autoUpdate.ts index 7484aeff..21dfa5e2 100644 --- a/src/autoUpdate.ts +++ b/src/autoUpdate.ts @@ -14,9 +14,9 @@ * limitations under the License. */ import { enums } from '@optimizely/optimizely-sdk'; -import { LoggerFacade } from '@optimizely/optimizely-sdk/lib/modules/logging'; import { ReactSDKClient } from './client'; +import { LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; interface AutoUpdate { ( diff --git a/src/hooks.ts b/src/hooks.ts index 05c6d85b..4647259f 100644 --- a/src/hooks.ts +++ b/src/hooks.ts @@ -16,7 +16,8 @@ import { useCallback, useContext, useEffect, useState, useRef } from 'react'; import { UserAttributes, OptimizelyDecideOption } from '@optimizely/optimizely-sdk'; -import { getLogger, LoggerFacade } from '@optimizely/optimizely-sdk/lib/modules/logging'; +import { getLogger } from '@optimizely/optimizely-sdk'; +import { LoggerFacade } from '@optimizely/optimizely-sdk/dist/modules/logging'; import { setupAutoUpdateListeners } from './autoUpdate'; import { ReactSDKClient, VariableValuesObject, OnReadyResult } from './client'; diff --git a/src/logOnlyEventDispatcher.ts b/src/logOnlyEventDispatcher.ts index b3ad347f..4525aca5 100644 --- a/src/logOnlyEventDispatcher.ts +++ b/src/logOnlyEventDispatcher.ts @@ -15,7 +15,7 @@ */ import * as optimizely from '@optimizely/optimizely-sdk'; -import * as logging from '@optimizely/optimizely-sdk/lib/modules/logging'; +import * as logging from '@optimizely/optimizely-sdk'; const logger = logging.getLogger('ReactSDK');