Merge branch 'experiments' into next

.github/workflows/prod-build.yml

@@ -86,6 +86,7 @@ jobs:
         with:
           repository: mdn/mdn-studio
           path: mdn/mdn-studio
+          lfs: true
           token: ${{ secrets.MDN_STUDIO_PAT }}
 
       # Our usecase is a bit complicated. When the cron schedule runs this workflow,

.github/workflows/stage-build.yml

@@ -86,6 +86,7 @@ jobs:
         with:
           repository: mdn/mdn-studio
           path: mdn/mdn-studio
+          lfs: true
           token: ${{ secrets.MDN_STUDIO_PAT }}
 
       # Our usecase is a bit complicated. When the cron schedule runs this workflow,

.github/workflows/xyz-build.yml

@@ -57,6 +57,7 @@ jobs:
         with:
           repository: mdn/mdn-studio
           path: mdn/mdn-studio
+          lfs: true
           token: ${{ secrets.MDN_STUDIO_PAT }}
 
       - uses: actions/checkout@v4

CHANGELOG.md

@@ -1,5 +1,66 @@
 # Changelog
 
+## [2.35.1](https://github.com/mdn/yari/compare/v2.35.0...v2.35.1) (2023-11-20)
+
+
+### Miscellaneous
+
+* **deps-dev:** bump @playwright/test from 1.39.0 to 1.40.0 ([#10043](https://github.com/mdn/yari/issues/10043)) ([11ce3aa](https://github.com/mdn/yari/commit/11ce3aaff8a9e74fc5b94891950a8afed80f9dd7))
+* **deps-dev:** bump @testing-library/react from 14.1.0 to 14.1.2 ([#10045](https://github.com/mdn/yari/issues/10045)) ([9f2c925](https://github.com/mdn/yari/commit/9f2c92570e450d8cfb55a72e3a9ba28d3e9b4cc4))
+* **deps-dev:** bump eslint from 8.53.0 to 8.54.0 ([#10047](https://github.com/mdn/yari/issues/10047)) ([a572fdf](https://github.com/mdn/yari/commit/a572fdf3a159c32e6d1a0411fe0a0c597b9edf32))
+* **deps-dev:** bump html-validate from 8.7.0 to 8.7.1 ([#10017](https://github.com/mdn/yari/issues/10017)) ([c6baf8b](https://github.com/mdn/yari/commit/c6baf8ba8b0eb31e0b1325c978d7209391020e43))
+* **deps-dev:** bump html-validate from 8.7.1 to 8.7.2 ([#10046](https://github.com/mdn/yari/issues/10046)) ([4686f0b](https://github.com/mdn/yari/commit/4686f0bf94384d1cdda11cd6fa3fe8b06fa88e88))
+* **deps-dev:** bump react-router-dom from 6.18.0 to 6.19.0 ([#10041](https://github.com/mdn/yari/issues/10041)) ([38e6d4a](https://github.com/mdn/yari/commit/38e6d4a80deca95cbe0fa372e79e27a0167f99d4))
+* **deps-dev:** bump the dependencies group in /testing/integration with 1 update ([#10013](https://github.com/mdn/yari/issues/10013)) ([45820f4](https://github.com/mdn/yari/commit/45820f4ef72f42023a183afc37fc8bebf223818e))
+* **deps-dev:** bump ts-loader from 9.5.0 to 9.5.1 ([#10031](https://github.com/mdn/yari/issues/10031)) ([5f86c8f](https://github.com/mdn/yari/commit/5f86c8fc1ec9f0ebd7242abd2b6a0d61a47c9c1a))
+* **deps-dev:** bump ts-loader from 9.5.0 to 9.5.1 in /client/pwa ([#10030](https://github.com/mdn/yari/issues/10030)) ([9a1e3ad](https://github.com/mdn/yari/commit/9a1e3adbc53b68ca6e7ff2bb3ff57b944afcc31a))
+* **deps:** bump [@zip](https://github.com/zip).js/zip.js from 2.7.30 to 2.7.31 in /client/pwa ([#10038](https://github.com/mdn/yari/issues/10038)) ([21226a7](https://github.com/mdn/yari/commit/21226a735c13d0e682bb877fe636883bc3751524))
+* **deps:** bump @mdn/browser-compat-data from 5.3.30 to 5.3.31 ([#10032](https://github.com/mdn/yari/issues/10032)) ([5abb914](https://github.com/mdn/yari/commit/5abb914ae42a952371e410fb291bd06c5c31a571))
+* **deps:** bump @mdn/browser-compat-data from 5.3.31 to 5.4.0 ([#10049](https://github.com/mdn/yari/issues/10049)) ([5d8270b](https://github.com/mdn/yari/commit/5d8270baa046d001f918380cfb6f32978285ef5d))
+* **deps:** bump @vscode/ripgrep from 1.15.6 to 1.15.7 ([#10042](https://github.com/mdn/yari/issues/10042)) ([5affc92](https://github.com/mdn/yari/commit/5affc926f90a3d1b61b48a4e049125def9f06107))
+* **deps:** bump @webref/css from 6.0.0 to 6.7.1 ([#9731](https://github.com/mdn/yari/issues/9731)) ([4a50067](https://github.com/mdn/yari/commit/4a50067efea6b5bb45e1077d2d292dae32322378))
+* **deps:** bump file-type from 18.6.0 to 18.7.0 ([#10014](https://github.com/mdn/yari/issues/10014)) ([26275e2](https://github.com/mdn/yari/commit/26275e2668f66460daa05e004bc60f5d5b712563))
+* **deps:** bump lru-cache from 10.0.1 to 10.0.2 ([#10015](https://github.com/mdn/yari/issues/10015)) ([0afd35c](https://github.com/mdn/yari/commit/0afd35c3faddda3cbfcb9449366925dab0e7ab6c))
+* **deps:** bump lru-cache from 10.0.2 to 10.0.3 ([#10048](https://github.com/mdn/yari/issues/10048)) ([e218e00](https://github.com/mdn/yari/commit/e218e006adc897af67d9d2cdb9eb5af43568c9f7))
+* **deps:** bump openai from 4.17.3 to 4.17.4 ([#10018](https://github.com/mdn/yari/issues/10018)) ([7f707d8](https://github.com/mdn/yari/commit/7f707d85b1df5dc1c9aa9cf12a43422c7638cfde))
+* **deps:** bump openai from 4.17.4 to 4.17.5 ([#10025](https://github.com/mdn/yari/issues/10025)) ([fd2af62](https://github.com/mdn/yari/commit/fd2af62b839dda0ff26e112e14c82688cf35d80e))
+* **deps:** bump openai from 4.17.5 to 4.18.0 ([#10033](https://github.com/mdn/yari/issues/10033)) ([fa87b01](https://github.com/mdn/yari/commit/fa87b014f61ad5b93e0e078c7ed27c5ef97dcb8e))
+* **deps:** bump openai from 4.18.0 to 4.19.0 ([#10035](https://github.com/mdn/yari/issues/10035)) ([48dbc83](https://github.com/mdn/yari/commit/48dbc833d3578a162952c3c8d9dd86a6c9f14e64))
+* **deps:** bump react-markdown from 9.0.0 to 9.0.1 ([#10024](https://github.com/mdn/yari/issues/10024)) ([35532d9](https://github.com/mdn/yari/commit/35532d9a6d320fcf10e38903cfb553c4794d248d))
+* **deps:** bump the dependencies group in /deployer with 1 update ([#10050](https://github.com/mdn/yari/issues/10050)) ([606520e](https://github.com/mdn/yari/commit/606520e3b3b4952daed5490e0c27ad6545d80404))
+* **deps:** bump the dependencies group in /deployer with 2 updates ([#10012](https://github.com/mdn/yari/issues/10012)) ([55e1c7f](https://github.com/mdn/yari/commit/55e1c7f47874ff8c00e2a1b5a5fbe5fe6609a33f))
+* **deps:** bump the sentry group with 2 updates ([#10022](https://github.com/mdn/yari/issues/10022)) ([821327f](https://github.com/mdn/yari/commit/821327f0599ad672652bc46e988049815ab554b2))
+* **deps:** bump web-specs from 2.73.0 to 2.74.0 ([#10023](https://github.com/mdn/yari/issues/10023)) ([4cb364b](https://github.com/mdn/yari/commit/4cb364b64693f01a1172e105713de97222407811))
+* **macros/CSSRef:** add "Using CSS math functions" ([#10026](https://github.com/mdn/yari/issues/10026)) ([d727fd8](https://github.com/mdn/yari/commit/d727fd820a5dd158a5725fee278a28653ad2dab3))
+* **macros/HTTPSidebar:** remove Cookie Security link ([#9654](https://github.com/mdn/yari/issues/9654)) ([4618778](https://github.com/mdn/yari/commit/46187786c61eeda9fb0a10eaa660a60307ab25dd))
+
+## [2.35.0](https://github.com/mdn/yari/compare/v2.34.2...v2.35.0) (2023-11-10)
+
+
+### Features
+
+* **macro-usage-report:** add CSV output format ([#9996](https://github.com/mdn/yari/issues/9996)) ([85e9afa](https://github.com/mdn/yari/commit/85e9afaf136828618945551d99710b2fdbc5c7ee))
+
+
+### Miscellaneous
+
+* **deps-dev:** bump @babel/core from 7.23.2 to 7.23.3 ([#9986](https://github.com/mdn/yari/issues/9986)) ([19c2d93](https://github.com/mdn/yari/commit/19c2d939ba81673bf2bdf0befbb0c584b7890eba))
+* **deps-dev:** bump @babel/eslint-parser from 7.22.15 to 7.23.3 ([#9991](https://github.com/mdn/yari/issues/9991)) ([e96005e](https://github.com/mdn/yari/commit/e96005e97a40d9dc411442d469bdadd35b8c914f))
+* **deps-dev:** bump @babel/preset-env from 7.23.2 to 7.23.3 ([#9987](https://github.com/mdn/yari/issues/9987)) ([2d059c8](https://github.com/mdn/yari/commit/2d059c82d2879aa3b084935deaeec8a9b0d3fb05))
+* **deps-dev:** bump eslint-plugin-n from 16.3.0 to 16.3.1 ([#9999](https://github.com/mdn/yari/issues/9999)) ([4d24433](https://github.com/mdn/yari/commit/4d24433a17762eed5a1994c6a0a231ccf6e65ab3))
+* **deps:** bump @mdn/browser-compat-data from 5.3.29 to 5.3.30 ([#10000](https://github.com/mdn/yari/issues/10000)) ([0d4d603](https://github.com/mdn/yari/commit/0d4d603de9b2ae344370c7adc2819d0182d891a1))
+* **deps:** bump markdown dependencies ([#9980](https://github.com/mdn/yari/issues/9980)) ([49979f1](https://github.com/mdn/yari/commit/49979f19c6d062fd6f725549295b62415f59de19))
+* **deps:** bump mdn-data from 2.2.0 to 2.3.0 ([#9989](https://github.com/mdn/yari/issues/9989)) ([696bd7e](https://github.com/mdn/yari/commit/696bd7ec19dd43ffa0a06ae43ea9c3cf741d64bd))
+* **deps:** bump openai from 4.16.1 to 4.17.0 ([#9990](https://github.com/mdn/yari/issues/9990)) ([7a66c1b](https://github.com/mdn/yari/commit/7a66c1bf664ad340018a0d3a8aa5a98d029c7d05))
+* **deps:** bump openai from 4.17.0 to 4.17.3 ([#9998](https://github.com/mdn/yari/issues/9998)) ([209ef20](https://github.com/mdn/yari/commit/209ef20fe1bc00ced7014c0973fb6c32e4b03755))
+* **deps:** bump the sentry group with 2 updates ([#9983](https://github.com/mdn/yari/issues/9983)) ([e094662](https://github.com/mdn/yari/commit/e094662180d23678189b8f0038331b9fca060d52))
+* **deps:** bump the sentry group with 2 updates ([#9997](https://github.com/mdn/yari/issues/9997)) ([c2264e4](https://github.com/mdn/yari/commit/c2264e41051ff80d01e16b580a8e0c177e9380da))
+* **deps:** bump web-specs from 2.72.0 to 2.73.0 ([#10001](https://github.com/mdn/yari/issues/10001)) ([4afa36d](https://github.com/mdn/yari/commit/4afa36d07bcfc9c54da77cb14d39a2725ca3ec66))
+* **flaws:** exclude /discord from broken-link flaw ([#10007](https://github.com/mdn/yari/issues/10007)) ([c72d8bc](https://github.com/mdn/yari/commit/c72d8bca2fdcab7aecb7ccad6b4ba2e38b62f6a5))
+* **footer:** update Careers link ([#9995](https://github.com/mdn/yari/issues/9995)) ([abc8f4e](https://github.com/mdn/yari/commit/abc8f4eedd1a616bbe6f428eb1687a9ac79cb2c3))
+* **macros/CSSRef:** add Border-radius generator ([#9994](https://github.com/mdn/yari/issues/9994)) ([b499b71](https://github.com/mdn/yari/commit/b499b719bb8ce11011252198127227652d10aa7b))
+* **macros:** delete {spec,spec2,SpecName} macros ([#9982](https://github.com/mdn/yari/issues/9982)) ([4cfbb82](https://github.com/mdn/yari/commit/4cfbb82c173883b46fca945dcaadf1c62d149717))
+
 ## [2.34.2](https://github.com/mdn/yari/compare/v2.34.1...v2.34.2) (2023-11-08)
 
 

client/pwa/package.json

@@ -18,7 +18,7 @@
   "devDependencies": {
     "@types/dexie": "1.3.1",
     "ts-loader": "^9.5.1",
-    "typescript": "^5.2.2",
+    "typescript": "^5.3.2",
     "webpack": "^5.89.0",
     "webpack-cli": "^5.1.4",
     "workers-preview": "^1.0.6"

client/pwa/yarn.lock

@@ -833,10 +833,10 @@ ts-loader@^9.5.1:
     semver "^7.3.4"
     source-map "^0.7.4"
 
-typescript@^5.2.2:
-  version "5.2.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.2.2.tgz#5ebb5e5a5b75f085f22bc3f8460fba308310fa78"
-  integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==
+typescript@^5.3.2:
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.3.2.tgz#00d1c7c1c46928c5845c1ee8d0cc2791031d4c43"
+  integrity sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==
 
 uri-js@^4.2.2:
   version "4.4.1"

client/src/document/index.scss

@@ -741,9 +741,13 @@ pre {
       }
 
       &:checked ~ label {
-        color: var(--text-primary-blue);
+        color: var(--category-color);
         opacity: 1;
       }
+
+      &:checked ~ label:before {
+        background-color: var(--category-color);
+      }
     }
   }
 

client/src/playground/queue/index.scss

@@ -19,7 +19,7 @@
 
     > summary {
       align-items: center;
-      color: var(--text-primary-blue);
+      color: var(--category-color);
       cursor: pointer;
       display: flex;
       padding: 0 1rem;
@@ -38,7 +38,7 @@
       }
 
       > .button.action {
-        --button-color: var(--text-primary-blue);
+        --button-color: var(--category-color);
       }
     }
   }
@@ -124,7 +124,7 @@
           padding: 0 0.5rem;
 
           &:hover {
-            color: var(--text-primary-blue);
+            color: var(--category-color);
             text-decoration: underline;
           }
         }

client/src/playground/queue/index.tsx

@@ -22,7 +22,7 @@ function PQEntry({ id, key, lang }: QueueEntry) {
       <Button
         type="action"
         buttonType="reset"
-        icon="trash"
+        icon="trash-filled"
         onClickHandler={() => {
           uncheck(id);
           window["playQueue"]?.();
@@ -97,7 +97,7 @@ export function PlayQueue({ standalone = false }: { standalone?: boolean }) {
                 window.open(url, "_blank");
               }}
             >
-              PLAY
+              Play
             </Button>
           </div>
         </details>

client/src/plus/ai-help/history.scss

@@ -65,7 +65,7 @@
 
           > a {
             color: var(--text-secondary);
-            mask-image: linear-gradient(to left, transparent, #000 25%);
+            mask-image: linear-gradient(to left, transparent, #000 3ch);
             overflow: hidden;
             white-space: nowrap;
             width: 100%;

client/src/plus/ai-help/history.tsx

@@ -157,26 +157,38 @@ export function AIHelpHistory({
     }
   );
 
-  const firstTopic = data[0];
+  const { chat_id: firstChatId = "", label: firstChatLabel = "" } =
+    data[0] ?? {};
 
   useEffect(() => {
     if (
       !isResponding &&
       messageId &&
-      firstTopic?.chat_id === currentChatId &&
-      firstTopic?.label === ""
+      firstChatId === currentChatId &&
+      firstChatLabel === ""
     ) {
       const update = async () => {
-        await (
-          await fetch(`/api/v1/plus/ai/help/history/summary/${messageId}`, {
+        const res = await fetch(
+          `/api/v1/plus/ai/help/history/summary/${messageId}`,
+          {
             method: "POST",
-          })
-        ).json();
-        mutate();
+          }
+        );
+        if (res.ok) {
+          await res.json();
+          mutate();
+        }
       };
       update();
     }
-  }, [mutate, isResponding, currentChatId, messageId, firstTopic]);
+  }, [
+    mutate,
+    isResponding,
+    currentChatId,
+    messageId,
+    firstChatId,
+    firstChatLabel,
+  ]);
   useEffect(() => {
     mutate();
   }, [lastUpdate, mutate]);

client/src/plus/ai-help/index.scss

@@ -495,15 +495,12 @@
     }
   }
 
-  .ai-help-message-content,
-  .ai-help-history {
-    .button.action.has-icon {
-      // Reduce button icon contrast to make it less prominent.
-      --button-color: var(--icon-secondary);
+  .button.action.has-icon {
+    // Reduce button icon contrast to make it less prominent.
+    --button-color: var(--icon-secondary);
 
-      &:hover {
-        --button-color: var(--icon-primary);
-      }
+    &:hover {
+      --button-color: var(--icon-primary);
     }
   }
 }

client/src/plus/ai-help/index.tsx

@@ -87,18 +87,20 @@ export default function AiHelp() {
             <span>AI Help</span>
           </h1>
           <p>Get answers using generative AI based on MDN content.</p>
-          <a
-            href={
-              user?.isAuthenticated
-                ? "https://survey.alchemer.com/s3/7418589/MDN-AI-Help-Feedback"
-                : "https://survey.alchemer.com/s3/7405739/MDN-AI-Help"
-            }
-            target="_blank"
-            rel="noreferrer noopener"
-            className="feedback-link"
-          >
-            Report Feedback
-          </a>
+          <p>
+            <a
+              href={
+                user?.isAuthenticated
+                  ? "https://survey.alchemer.com/s3/7418589/MDN-AI-Help-Feedback"
+                  : "https://survey.alchemer.com/s3/7405739/MDN-AI-Help"
+              }
+              target="_blank"
+              rel="noreferrer noopener"
+              className="feedback-link"
+            >
+              Report Feedback
+            </a>
+          </p>
         </Container>
         <Container>
           <div className="notecard experimental">
@@ -189,13 +191,13 @@ function AIHelpUserQuestion({ message, submit, nextPrev, siblingCount }) {
         <Button
           icon="return"
           type="action"
-          title="Cancel editing"
+          title="Undo editing"
           onClickHandler={() => {
             setEditing(false);
             setQuestion(message.content);
           }}
         >
-          <span className="visually-hidden">Cancel editing</span>
+          <span className="visually-hidden">Undo editing</span>
         </Button>
       </div>
     </form>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mdn/yari",
-  "version": "2.34.2",
+  "version": "2.35.1",
   "repository": "https://github.com/mdn/yari",
   "license": "MPL-2.0",
   "author": "MDN Web Docs",
@@ -71,10 +71,10 @@
     "@mdn/bcd-utils-api": "^0.0.5",
     "@mdn/browser-compat-data": "^5.4.0",
     "@mozilla/glean": "2.0.5",
-    "@sentry/integrations": "^7.80.1",
-    "@sentry/node": "^7.80.1",
+    "@sentry/integrations": "^7.81.0",
+    "@sentry/node": "^7.81.0",
     "@sentry/react": "^7.80.0",
-    "@stripe/stripe-js": "^2.1.11",
+    "@stripe/stripe-js": "^2.2.0",
     "@use-it/interval": "^1.0.0",
     "@vscode/ripgrep": "^1.15.7",
     "@webref/css": "^6.0.0",
@@ -118,7 +118,7 @@
     "mdn-data": "^2.3.0",
     "open": "^9.1.0",
     "open-editor": "^4.1.1",
-    "openai": "^4.19.0",
+    "openai": "^4.19.1",
     "prism-svelte": "^0.5.0",
     "prismjs": "^1.29.0",
     "react-markdown": "^9.0.1",
@@ -151,18 +151,18 @@
     "@mdn/minimalist": "^2.0.4",
     "@playwright/test": "^1.40.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.11",
-    "@supabase/supabase-js": "^2.38.4",
+    "@supabase/supabase-js": "^2.38.5",
     "@svgr/webpack": "^8.1.0",
-    "@swc/core": "^1.3.96",
+    "@swc/core": "^1.3.99",
     "@testing-library/react": "^14.1.2",
     "@types/async": "^3.2.23",
     "@types/cli-progress": "^3.11.5",
-    "@types/imagemin": "^8.0.4",
-    "@types/jest": "^29.5.8",
+    "@types/imagemin": "^8.0.5",
+    "@types/jest": "^29.5.9",
     "@types/mdast": "^4.0.3",
     "@types/node": "^18.16.6",
-    "@types/react": "^18.2.37",
-    "@types/react-dom": "^18.2.15",
+    "@types/react": "^18.2.38",
+    "@types/react-dom": "^18.2.16",
     "@types/react-modal": "^3.16.3",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",