feat(runtime_config): A way to add static descriptions to config items (

#6624) Ability to document runtime config in-code. This should be used to describe what the option does, while the existing description field may be used to document why the option was set this way. Also get rid of some tech-debt. We were pulling in bootstrap via jsdelivr in the capacity management project. This caused the navbar to change styles when switching to that tab. The other style changes in nav.tsx are there to deal with the now-imported bootstrap.css correctly. ![image](https://github.com/user-attachments/assets/1613c8a2-a3cc-45a1-8a69-a5fddcd5fad2)
getsentry · Dec 9, 2024 · 220e225 · 220e225
1 parent 27a8241
commit 220e225
Show file tree

Hide file tree

Showing 8 changed files with 190 additions and 26 deletions.
diff --git a/snuba/admin/package.json b/snuba/admin/package.json
@@ -27,6 +27,7 @@
     "@types/react": "^18.0.20",
     "@types/react-dom": "^18.2.6",
     "braces": "^3.0.3",
+    "css-loader": "^7.1.2",
     "dayjs": "^1.11.13",
     "jest-dom": "^4.0.0",
     "lowlight": "^2.9.0",
@@ -58,6 +59,7 @@
     "jest-environment-jsdom": "^29.5.0",
     "react-bootstrap": "^2.10.5",
     "resize-observer-polyfill": "^1.5.1",
+    "style-loader": "^4.0.0",
     "ts-jest": "^29.2.5",
     "use-resize-observer": "^9.1.0",
     "webpack": "^5.96.1",

diff --git a/snuba/admin/static/capacity_management/allocation_policy.tsx b/snuba/admin/static/capacity_management/allocation_policy.tsx
@@ -107,12 +107,6 @@ function AllocationPolicyConfigs(props: {
 
   return (
     <>
-      <link
-        rel="stylesheet"
-        href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
-        integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65"
-        crossOrigin="anonymous"
-      />
       <EditConfigModal
         currentlyEditing={currentlyEditing}
         currentConfig={currentConfig}

diff --git a/snuba/admin/static/index.tsx b/snuba/admin/static/index.tsx
@@ -9,6 +9,8 @@ import { NAV_ITEMS } from "SnubaAdmin/data";
 import Client from "SnubaAdmin/api_client";
 import { MantineProvider } from "@mantine/core";
 
+import 'bootstrap/dist/css/bootstrap.min.css';
+
 const containerStyle = {
   display: "flex",
   flexDirection: "column" as const,
@@ -84,7 +86,9 @@ function getTab(locationHash: string): string {
     throw new Error("invalid hash");
   }
 
-  const navItem = NAV_ITEMS.find((item) => "#" + item.id === locationHash);
+  const hash = locationHash.split("/")[0];
+
+  const navItem = NAV_ITEMS.find((item) => "#" + item.id === hash);
 
   if (typeof navItem === "undefined") {
     throw new Error("invalid hash");

diff --git a/snuba/admin/static/nav.tsx b/snuba/admin/static/nav.tsx
@@ -31,16 +31,16 @@ function Nav(props: NavProps) {
         {NAV_ITEMS.map((item) =>
           allowedTools?.includes(item.id) || allowedTools?.includes("all") ? (
             item.id === active ? (
-              <li key={item.id} style={{ color: COLORS.TEXT_DEFAULT }}>
-                <a className="nav-link-active" style={linkStyle}>
+              <li key={item.id} >
+                <a style={{ color: COLORS.TEXT_DEFAULT, ...linkStyle }} className="nav-link-active">
                   {item.display}
                 </a>
               </li>
             ) : (
-              <li key={item.id} style={{ color: COLORS.TEXT_INACTIVE }}>
+              <li key={item.id}>
                 <a
+                  style={{ color: COLORS.TEXT_INACTIVE, ...linkStyle }}
                   className="nav-link"
-                  style={linkStyle}
                   onClick={() => navigate(item.id)}
                 >
                   {item.display}
@@ -69,6 +69,7 @@ const ulStyle = {
 
 const linkStyle = {
   display: "block",
+  textDecoration: "none",
   cursor: "pointer",
   padding: 20,
 };

diff --git a/snuba/admin/static/runtime_config/descriptions.tsx b/snuba/admin/static/runtime_config/descriptions.tsx
@@ -0,0 +1,39 @@
+// static descriptions complementary to dynamic descriptions.
+// write static descriptions here to explain what the option does (and once, for all regions/deployments)
+// write dynamic descriptions in snuba-admin to explain why the option is set the way it is.
+//
+// due to the historically dynamic nature of runtime config,
+// descriptions here can be defined to apply to an arbitrary
+// *regex pattern* of description keys.
+const DESCRIPTIONS: {[key: string]: string} = {
+  'quantized_rebalance_consumer_group_delay_secs__.*': "quantized rebalancing means that during deploys, we try to trigger rebalancing across all pods within a consumer group at the same time. a value of 15 means that pods align their group join/leave activity to some multiple of 15 seconds, by sleeping during startup or shutdown. the setting is suffixed with __foo e.g. meaning the 'foo' consumer group is affected. this refers to de-facto consumer groups, not logical ones. the same concept exists in sentry's python consumers. in snuba, this only affects rust consumers.",
+  "disable_lua_randomize_query_id": "randomize clickhouse queryId to enable simple readthrough cache.",
+  "enable_bypass_cache_referrers": "Any referrer listed in BYPASS_CACHE_REFERRERS under Snuba settings will bypass readthrough cache",
+  "enable_filter_in_select_optimizer": "delete to turn off filter in select optimizer (api parsing)",
+  ".*_ignore_consistent_queries_sample_rate": "Ignore consistent queries to given dataset. This flag should be set to a value between 0 and 1 where 0 means we never ignore any incoming consistent queries and 1 means ignoring all consistent queries.",
+  "generic_metrics_use_case_killswitch": "Add a use case to this list to killswitch its data coming into all generic metrics Snuba consumers. e.g. if you want to turn off the custom use case, this will make sure none of its data gets processed by any Snuba consumer",
+  "http_batch_join_timeout": "PYTHON ONLY: Time in seconds to wait for clickhouse write to complete for consumers. Higher number to start off with.",
+  "ondemand_profiler_hostnames": "This enables profiling for the specified host names ",
+  "optimize_parallel_threads": "number of threads to run the optimize cron job with",
+  "pipeline-delegator-disallow-query-copy": "Disallow copying query objects for referrers",
+  "pipeline_split_rate_limiter": "When running concurrent pipelines with the PipelineDelegator, split the rate limiter name space for each pipeline.",
+  "project_quota_time_percentage": "Controls the project quota limit. A counter class tracks the processing time spent on some task for a project and compares it with this quota",
+  "rate_limit_shard_factor": "How many keys the query rate limiter should shard a set into. More keys means smaller avg redis-set size (therefore faster ops), but more (pipelined) ops. This would be more useful if the rate limiter redis was actually a multi-node redis cluster. Right now we run this code just so it is ready, should we have to scale, and to be able to tweak set size if we have to.",
+  "rate_limit_use_transaction_pipe": "Whether the concurrent rate limiter uses a redis transaction to perform its opertaions, see https://github.com/getsentry/snuba/pull/4965/files",
+  "read_through_cache.disable_lua_scripts_sample_rate": "Percentage of request enabled to use simple readthrough cache",
+  "read_through_cache.short_circuit": "First stage of removing the readthrough cache entirely is disabling and monitoring - Rahul",
+  "retry_duplicate_query_id": "Whether to retry clickhouse queries with a random query id (exactly once) if clickhouse rejected the query before due to the query id already being used. This can be useful in case of redis failover scenarios when we lose query cache.",
+  "run_new_mql_parser": "Feature flag sample rate for running new MQL join parser",
+  "snuba_api_cogs_probability": "Sample rate for logging COGS in the API",
+}
+
+function getDescription(key: string): [string, string] | undefined {
+  if (DESCRIPTIONS[key]) return [key, DESCRIPTIONS[key]];
+  for (const defKey in DESCRIPTIONS) {
+    if (new RegExp(`^${defKey}$`, 'g').test(key)) {
+      return [defKey, `for pattern ${defKey}: ${DESCRIPTIONS[defKey]}`];
+    }
+  }
+}
+
+export { getDescription };
diff --git a/snuba/admin/static/runtime_config/row_data.tsx b/snuba/admin/static/runtime_config/row_data.tsx
@@ -1,6 +1,8 @@
 import React, { ReactNode } from "react";
+import { Popover, OverlayTrigger } from 'react-bootstrap';
 
 import { linkStyle } from "SnubaAdmin/runtime_config/styles";
+import { getDescription } from "SnubaAdmin/runtime_config/descriptions";
 import { EditableTableCell } from "SnubaAdmin/table";
 import {
   ConfigKey,
@@ -25,9 +27,25 @@ function getReadonlyRow(
   showActions: boolean,
   edit: () => void
 ): RowData {
+  const [realKey, staticDescription] = getDescription(key) || [null, "Is missing. Add it to snuba/admin/static/runtime_config/descriptions.tsx?"];
+  const tooltip = (
+    <Popover id="key-description">
+      <Popover.Header>Information</Popover.Header>
+      <Popover.Body>
+        <p><strong><a target="_blank" href={`https://github.com/search?q=repo%3Agetsentry%2Fsnuba%20%2F${realKey || key}%2F&type=code`}>Search codebase for config key</a></strong></p>
+        <p><strong>Static description:</strong> {staticDescription}</p>
+      </Popover.Body>
+    </Popover>
+  );
   return [
-    <code style={{ wordBreak: "break-all" }}>{key}</code>,
-    <code style={{ wordBreak: "break-all" }}>{value}</code>,
+    <OverlayTrigger trigger={["click"]} placement="bottom" overlay={tooltip}>
+      <a id={`config/${key}`} href={`#config/${key}`}>
+        <code style={{ wordBreak: "break-all" }}>
+          {key}
+        </code>
+      </a>
+    </OverlayTrigger>,
+    <code style={{ wordBreak: "break-all", color: "black" }}>{value}</code>,
     description,
     type,
     showActions && (

diff --git a/snuba/admin/webpack.config.js b/snuba/admin/webpack.config.js
@@ -10,6 +10,10 @@ module.exports = (env) => ({
                 use: 'ts-loader',
                 exclude: /node_modules/,
             },
+            {
+                test: /\.css$/i,
+                use: ["style-loader", "css-loader"],
+            },
         ],
     },
     resolve: {
@@ -34,6 +38,7 @@ module.exports = (env) => ({
             // Auth tokens can be obtained from https://sentry.io/settings/account/api/auth-tokens/
             // and need `project:releases` and `org:read` scopes
             authToken: process.env.SENTRY_AUTH_TOKEN,
+            telemetry: false,
         }),
     ],
 })
diff --git a/snuba/admin/yarn.lock b/snuba/admin/yarn.lock
@@ -1347,16 +1347,16 @@
     tslib "^2.4.0"
 
 "@tabler/icons-react@^3.17.0":
-  version "3.17.0"
-  resolved "https://registry.yarnpkg.com/@tabler/icons-react/-/icons-react-3.17.0.tgz#badafce6618f6b8104262538e3f55d34d09c2e29"
-  integrity sha512-Ndm9Htv7KpIU1PYYrzs5EMhyA3aZGcgaxUp9Q1XOxcRZ+I0X+Ub2WS5f4bkRyDdL1s0++k2T9XRgmg2pG113sw==
+  version "3.24.0"
+  resolved "https://registry.yarnpkg.com/@tabler/icons-react/-/icons-react-3.24.0.tgz#854fad7a142ee1dd49a62e59f7eb551eadaa318e"
+  integrity sha512-m9c7TmlcDmKqvZAasG5rv1YvazZDrVEhNdNFa2d1Bzotc0dh+iceFdiZCEcYPDb5UcRyLAMvOaOC9y/5sfMMWw==
   dependencies:
-    "@tabler/icons" "3.17.0"
+    "@tabler/icons" "3.24.0"
 
-"@tabler/icons@3.17.0":
-  version "3.17.0"
-  resolved "https://registry.yarnpkg.com/@tabler/icons/-/icons-3.17.0.tgz#329ca3e4cb533c5a6a61467fe5d6de14a0813020"
-  integrity sha512-sCSfAQ0w93KSnSL7tS08n73CdIKpuHP8foeLMWgDKiZaCs8ZE//N3ytazCk651ZtruTtByI3b+ZDj7nRf+hHvA==
+"@tabler/icons@3.24.0":
+  version "3.24.0"
+  resolved "https://registry.yarnpkg.com/@tabler/icons/-/icons-3.24.0.tgz#a4fd4bbcaa95cea92fa653d427bd298c4d589c5e"
+  integrity sha512-qNis9e90QcdxAGV3wNIeX0Ba2R7ktm0cnqOToKHJfC2kj3fvJwEVLsw63K0/fm7NW8rSZjDSTQRmMnSg8g/wrg==
 
 "@tanstack/[email protected]":
   version "8.8.4"
@@ -2466,6 +2466,25 @@ cross-spawn@^7.0.3:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
+css-loader@^7.1.2:
+  version "7.1.2"
+  resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-7.1.2.tgz#64671541c6efe06b0e22e750503106bdd86880f8"
+  integrity sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==
+  dependencies:
+    icss-utils "^5.1.0"
+    postcss "^8.4.33"
+    postcss-modules-extract-imports "^3.1.0"
+    postcss-modules-local-by-default "^4.0.5"
+    postcss-modules-scope "^3.2.0"
+    postcss-modules-values "^4.0.0"
+    postcss-value-parser "^4.2.0"
+    semver "^7.5.4"
+
+cssesc@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
+  integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
+
 cssom@^0.5.0:
   version "0.5.0"
   resolved "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz"
@@ -3089,6 +3108,11 @@ [email protected]:
   dependencies:
     safer-buffer ">= 2.1.2 < 3.0.0"
 
+icss-utils@^5.0.0, icss-utils@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae"
+  integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==
+
 import-fresh@^3.2.1:
   version "3.3.0"
   resolved "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz"
@@ -4020,7 +4044,7 @@ micromatch@^4.0.0, micromatch@^4.0.4:
   integrity sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==
   dependencies:
     braces "^3.0.3"
-    picomatch "^2.2.3"
+    picomatch "^2.3.1"
 
 [email protected]:
   version "1.52.0"
@@ -4075,6 +4099,11 @@ [email protected]:
   resolved "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz"
   integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
+nanoid@^3.3.7:
+  version "3.3.8"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.8.tgz#b1be3030bee36aaff18bacb375e5cce521684baf"
+  integrity sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==
+
 natural-compare@^1.4.0:
   version "1.4.0"
   resolved "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz"
@@ -4292,12 +4321,12 @@ picocolors@^1.0.0:
   resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
   integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
 
-picocolors@^1.1.0:
+picocolors@^1.1.0, picocolors@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.1.1.tgz#3d321af3eab939b083c8f929a1d12cda81c26b6b"
   integrity sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==
 
-picomatch@^2.0.4, picomatch@^2.2.1:
+picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
   version "2.3.1"
   resolved "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz"
   integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
@@ -4319,6 +4348,56 @@ pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
+postcss-modules-extract-imports@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz#b4497cb85a9c0c4b5aabeb759bb25e8d89f15002"
+  integrity sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==
+
+postcss-modules-local-by-default@^4.0.5:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.1.0.tgz#b0db6bc81ffc7bdc52eb0f84d6ca0bedf0e36d21"
+  integrity sha512-rm0bdSv4jC3BDma3s9H19ZddW0aHX6EoqwDYU2IfZhRN+53QrufTRo2IdkAbRqLx4R2IYbZnbjKKxg4VN5oU9Q==
+  dependencies:
+    icss-utils "^5.0.0"
+    postcss-selector-parser "^7.0.0"
+    postcss-value-parser "^4.1.0"
+
+postcss-modules-scope@^3.2.0:
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz#1bbccddcb398f1d7a511e0a2d1d047718af4078c"
+  integrity sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==
+  dependencies:
+    postcss-selector-parser "^7.0.0"
+
+postcss-modules-values@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz#d7c5e7e68c3bb3c9b27cbf48ca0bb3ffb4602c9c"
+  integrity sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==
+  dependencies:
+    icss-utils "^5.0.0"
+
+postcss-selector-parser@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-7.0.0.tgz#41bd8b56f177c093ca49435f65731befe25d6b9c"
+  integrity sha512-9RbEr1Y7FFfptd/1eEdntyjMwLeghW1bHX9GWjXo19vx4ytPQhANltvVxDggzJl7mnWM+dX28kb6cyS/4iQjlQ==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
+postcss-value-parser@^4.1.0, postcss-value-parser@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
+  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
+
+postcss@^8.4.33:
+  version "8.4.49"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.49.tgz#4ea479048ab059ab3ae61d082190fabfd994fe19"
+  integrity sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.1.1"
+    source-map-js "^1.2.1"
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
@@ -4368,7 +4447,7 @@ prop-types-extra@^1.1.0:
     react-is "^16.3.2"
     warning "^4.0.0"
 
-prop-types@^15.6.2, prop-types@^15.8.1:
+prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:
   version "15.8.1"
   resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz"
   integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -4564,6 +4643,13 @@ randombytes@^2.1.0:
   dependencies:
     safe-buffer "^5.1.0"
 
+react-bootstrap-icons@^1.11.5:
+  version "1.11.5"
+  resolved "https://registry.yarnpkg.com/react-bootstrap-icons/-/react-bootstrap-icons-1.11.5.tgz#9b91a0bf0d5505d92c3574f1f990bb52f36a3ec0"
+  integrity sha512-eOhtFJMUqw98IJcfKJsSMZkFHCeNPTTwXZAe9V9d4mT22ARmbrISxPO9GmtWWuf72zQctLeZMGodX/q6wrbYYg==
+  dependencies:
+    prop-types "^15.7.2"
+
 react-bootstrap@^2.10.5:
   version "2.10.5"
   resolved "https://registry.yarnpkg.com/react-bootstrap/-/react-bootstrap-2.10.5.tgz#2d3416fb4178d0f460ddafbfcab0aebfbbf1cf25"
@@ -4801,7 +4887,7 @@ semver@^6.0.0, semver@^6.3.0:
   resolved "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
-semver@^7.3.4, semver@^7.3.5, semver@^7.6.3:
+semver@^7.3.4, semver@^7.3.5, semver@^7.5.4, semver@^7.6.3:
   version "7.6.3"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.6.3.tgz#980f7b5550bc175fb4dc09403085627f9eb33143"
   integrity sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==
@@ -4856,6 +4942,11 @@ slash@^3.0.0:
   resolved "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
   integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
 
+source-map-js@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.1.tgz#1ce5650fddd87abc099eda37dcff024c2667ae46"
+  integrity sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==
+
 [email protected]:
   version "0.5.13"
   resolved "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz"
@@ -4940,6 +5031,11 @@ strip-json-comments@^3.1.1:
   resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
 
+style-loader@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/style-loader/-/style-loader-4.0.0.tgz#0ea96e468f43c69600011e0589cb05c44f3b17a5"
+  integrity sha512-1V4WqhhZZgjVAVJyt7TdDPZoPBPNHbekX4fWnCJL1yQukhCeZhJySUL+gL9y6sNdN95uEOS83Y55SqHcP7MzLA==
+
 style-mod@^4.0.0, style-mod@^4.1.0:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/style-mod/-/style-mod-4.1.2.tgz#ca238a1ad4786520f7515a8539d5a63691d7bf67"
@@ -5236,6 +5332,11 @@ use-sidecar@^1.1.2:
     detect-node-es "^1.1.0"
     tslib "^2.0.0"
 
+util-deprecate@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
+  integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
+
 uuid@^9.0.0:
   version "9.0.0"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-9.0.0.tgz#592f550650024a38ceb0c562f2f6aa435761efb5"