From ba02ef6ef719b79505aa7e0ded3bee19e97b3c77 Mon Sep 17 00:00:00 2001
From: Anthony Martin <38542602+anthony-c-martin@users.noreply.github.com>
Date: Mon, 20 Jan 2025 11:41:55 -0500
Subject: [PATCH] Fix build issues
---
src/playground/package-lock.json | 70 ++++++++++++++++---------------
src/playground/package.json | 8 ++--
src/playground/src/index.tsx | 16 ++++---
src/playground/src/playground.tsx | 5 ++-
src/playground/src/utils.ts | 11 +++--
5 files changed, 58 insertions(+), 52 deletions(-)
diff --git a/src/playground/package-lock.json b/src/playground/package-lock.json
index c2a48ca4107..c60d4fc3994 100644
--- a/src/playground/package-lock.json
+++ b/src/playground/package-lock.json
@@ -18,22 +18,22 @@
"devDependencies": {
"@eslint/eslintrc": "^3.2.0",
"@eslint/js": "^9.18.0",
- "@types/node": "^22.10.5",
+ "@types/node": "^22.10.7",
"@types/pako": "^2.0.3",
- "@types/react": "^19.0.5",
+ "@types/react": "^19.0.7",
"@types/react-dom": "^19.0.3",
"@types/webpack": "^5.28.5",
"@typescript-eslint/eslint-plugin": "^8.20.0",
"@typescript-eslint/parser": "^8.20.0",
"copy-webpack-plugin": "^12.0.2",
"css-loader": "^7.1.2",
- "eslint": "^9.17.0",
+ "eslint": "^9.18.0",
"eslint-plugin-jest": "^28.11.0",
"eslint-plugin-notice": "^1.0.0",
"globals": "^15.14.0",
"html-webpack-plugin": "^5.6.3",
"monaco-editor-webpack-plugin": "^7.1.0",
- "nerdbank-gitversioning": "^3.7.112",
+ "nerdbank-gitversioning": "^3.7.115",
"style-loader": "^4.0.0",
"ts-loader": "^9.5.2",
"ts-node": "^10.9.2",
@@ -126,10 +126,14 @@
}
},
"node_modules/@eslint/core": {
- "version": "0.9.0",
- "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.9.0.tgz",
- "integrity": "sha512-7ATR9F0e4W85D/0w7cU0SNj7qkAexMG+bAHEZOjo9akvGuhHE2m7umzWzfnpa0XAg5Kxc1BWmtPMV67jJ+9VUg==",
+ "version": "0.10.0",
+ "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.10.0.tgz",
+ "integrity": "sha512-gFHJ+xBOo4G3WRlR1e/3G8A6/KZAH6zcE/hkLRCZTi/B9avAG365QhFA8uOGzTMqgTghpn7/fSnscW++dpMSAw==",
"dev": true,
+ "license": "Apache-2.0",
+ "dependencies": {
+ "@types/json-schema": "^7.0.15"
+ },
"engines": {
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
}
@@ -188,11 +192,13 @@
}
},
"node_modules/@eslint/plugin-kit": {
- "version": "0.2.3",
- "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.2.3.tgz",
- "integrity": "sha512-2b/g5hRmpbb1o4GnTZax9N9m0FXzz9OV42ZzI4rDDMDuHUqigAiQCEWChBWCY4ztAGVRjoWT19v0yMmc5/L5kA==",
+ "version": "0.2.5",
+ "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.2.5.tgz",
+ "integrity": "sha512-lB05FkqEdUg2AA0xEbUz0SnkXT1LcCTa438W4IWTUh4hdOnVbQyOJ81OrDXsJk/LSiJHubgGEFoR5EHq1NsH1A==",
"dev": true,
+ "license": "Apache-2.0",
"dependencies": {
+ "@eslint/core": "^0.10.0",
"levn": "^0.4.1"
},
"engines": {
@@ -808,10 +814,11 @@
"dev": true
},
"node_modules/@types/node": {
- "version": "22.10.5",
- "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.5.tgz",
- "integrity": "sha512-F8Q+SeGimwOo86fiovQh8qiXfFEh2/ocYv7tU5pJ3EXMSSxk1Joj5wefpFK2fHTf/N6HKGSxIDBT9f3gCxXPkQ==",
+ "version": "22.10.7",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.7.tgz",
+ "integrity": "sha512-V09KvXxFiutGp6B7XkpaDXlNadZxrzajcY50EuoLIpQ6WWYCSvf19lVIazzfIzQvhUN2HjX12spLojTnhuKlGg==",
"dev": true,
+ "license": "MIT",
"dependencies": {
"undici-types": "~6.20.0"
}
@@ -849,9 +856,10 @@
"dev": true
},
"node_modules/@types/react": {
- "version": "19.0.5",
- "resolved": "https://registry.npmjs.org/@types/react/-/react-19.0.5.tgz",
- "integrity": "sha512-i4OQzFiqsUCfoBns/KHpz+4QcvfjoCsTUi+mugo3lrSRA3+x0gJVvhZhAJrwLGEqz4EXiFVP4hPnOugx+m2uhg==",
+ "version": "19.0.7",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-19.0.7.tgz",
+ "integrity": "sha512-MoFsEJKkAtZCrC1r6CM8U22GzhG7u2Wir8ons/aCKH6MBdD1ibV24zOSSkdZVUKqN5i396zG5VKLYZ3yaUZdLA==",
+ "license": "MIT",
"dependencies": {
"csstype": "^3.0.2"
}
@@ -861,6 +869,7 @@
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.0.3.tgz",
"integrity": "sha512-0Knk+HJiMP/qOZgMyNFamlIjw9OFCsyC2ZbigmEEyXXixgre6IQpm/4V+r3qH4GC1JPvRJKInw+on2rV6YZLeA==",
"dev": true,
+ "license": "MIT",
"peerDependencies": {
"@types/react": "^19.0.0"
}
@@ -2601,18 +2610,19 @@
"dev": true
},
"node_modules/eslint": {
- "version": "9.17.0",
- "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.17.0.tgz",
- "integrity": "sha512-evtlNcpJg+cZLcnVKwsai8fExnqjGPicK7gnUtlNuzu+Fv9bI0aLpND5T44VLQtoMEnI57LoXO9XAkIXwohKrA==",
+ "version": "9.18.0",
+ "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.18.0.tgz",
+ "integrity": "sha512-+waTfRWQlSbpt3KWE+CjrPPYnbq9kfZIYUqapc0uBXyjTp8aYXZDsUH16m39Ryq3NjAVP4tjuF7KaukeqoCoaA==",
"dev": true,
+ "license": "MIT",
"dependencies": {
"@eslint-community/eslint-utils": "^4.2.0",
"@eslint-community/regexpp": "^4.12.1",
"@eslint/config-array": "^0.19.0",
- "@eslint/core": "^0.9.0",
+ "@eslint/core": "^0.10.0",
"@eslint/eslintrc": "^3.2.0",
- "@eslint/js": "9.17.0",
- "@eslint/plugin-kit": "^0.2.3",
+ "@eslint/js": "9.18.0",
+ "@eslint/plugin-kit": "^0.2.5",
"@humanfs/node": "^0.16.6",
"@humanwhocodes/module-importer": "^1.0.1",
"@humanwhocodes/retry": "^0.4.1",
@@ -2723,15 +2733,6 @@
"url": "https://opencollective.com/eslint"
}
},
- "node_modules/eslint/node_modules/@eslint/js": {
- "version": "9.17.0",
- "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.17.0.tgz",
- "integrity": "sha512-Sxc4hqcs1kTu0iID3kcZDW3JHq2a77HO9P8CP6YEA/FpH3Ll8UXE2r/86Rz9YJLKme39S9vU5OWNjC6Xl0Cr3w==",
- "dev": true,
- "engines": {
- "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
- }
- },
"node_modules/eslint/node_modules/escape-string-regexp": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
@@ -4316,10 +4317,11 @@
"dev": true
},
"node_modules/nerdbank-gitversioning": {
- "version": "3.7.112",
- "resolved": "https://registry.npmjs.org/nerdbank-gitversioning/-/nerdbank-gitversioning-3.7.112.tgz",
- "integrity": "sha512-VItm8CRXDEclu6kzHeaCx5RlsiEGCd+HMQ+sCXF2MvRtgxK4X8JTlEvDclHGW/LKqcQ3JwoVtNlf9rIT8O1flQ==",
+ "version": "3.7.115",
+ "resolved": "https://registry.npmjs.org/nerdbank-gitversioning/-/nerdbank-gitversioning-3.7.115.tgz",
+ "integrity": "sha512-5qDOHT38a+9ZV3IDX1A5i50BIJ3xlz6iAZx4IKjP9t6yMko9cxY6geIuotvFEpJzODex7fRpvYRGUcYQd1jdwQ==",
"dev": true,
+ "license": "MIT",
"bin": {
"nbgv": "main.js",
"nbgv-setversion": "npmVersion.js"
diff --git a/src/playground/package.json b/src/playground/package.json
index 8b8ab6dfbda..0b8ac2a05c7 100644
--- a/src/playground/package.json
+++ b/src/playground/package.json
@@ -16,22 +16,22 @@
"devDependencies": {
"@eslint/eslintrc": "^3.2.0",
"@eslint/js": "^9.18.0",
- "@types/node": "^22.10.5",
+ "@types/node": "^22.10.7",
"@types/pako": "^2.0.3",
- "@types/react": "^19.0.5",
+ "@types/react": "^19.0.7",
"@types/react-dom": "^19.0.3",
"@types/webpack": "^5.28.5",
"@typescript-eslint/eslint-plugin": "^8.20.0",
"@typescript-eslint/parser": "^8.20.0",
"copy-webpack-plugin": "^12.0.2",
"css-loader": "^7.1.2",
- "eslint": "^9.17.0",
+ "eslint": "^9.18.0",
"eslint-plugin-jest": "^28.11.0",
"eslint-plugin-notice": "^1.0.0",
"globals": "^15.14.0",
"html-webpack-plugin": "^5.6.3",
"monaco-editor-webpack-plugin": "^7.1.0",
- "nerdbank-gitversioning": "^3.7.112",
+ "nerdbank-gitversioning": "^3.7.115",
"style-loader": "^4.0.0",
"ts-loader": "^9.5.2",
"ts-node": "^10.9.2",
diff --git a/src/playground/src/index.tsx b/src/playground/src/index.tsx
index 7936d90c394..47e33b38867 100644
--- a/src/playground/src/index.tsx
+++ b/src/playground/src/index.tsx
@@ -1,7 +1,7 @@
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
import { Container, Row, Spinner } from 'react-bootstrap';
import { ApplicationInsights } from '@microsoft/applicationinsights-web';
import 'bootstrap/dist/css/bootstrap.min.css';
@@ -10,15 +10,15 @@ import './index.css';
import { initializeInterop } from './lspInterop';
import { Playground } from './playground';
-ReactDOM.render(
+
+const root = createRoot(document.getElementById('root'));
+root.render(
// Loading spinner while we initialize Blazor
- ,
- document.getElementById('root')
-);
+ );
async function initialize() {
const insights = new ApplicationInsights({
@@ -32,12 +32,10 @@ async function initialize() {
await initializeInterop(self);
- ReactDOM.render(
+ root.render(
,
- document.getElementById('root')
- );
+ );
}
initialize();
\ No newline at end of file
diff --git a/src/playground/src/playground.tsx b/src/playground/src/playground.tsx
index 11a4754495c..8469df8e30b 100644
--- a/src/playground/src/playground.tsx
+++ b/src/playground/src/playground.tsx
@@ -6,7 +6,7 @@ import { Button, ButtonGroup, Col, Container, Dropdown, FormControl, Nav, Navbar
import './playground.css';
import { JsonEditor } from './jsonEditor';
import { BicepEditor } from './bicepEditor';
-import { copyShareLinkToClipboard, handleShareLink } from './utils';
+import { getShareLink, handleShareLink } from './utils';
import { quickstartsPaths, getQuickstartsLink } from './examples';
import { decompile } from './lspInterop';
import { IApplicationInsights } from '@microsoft/applicationinsights-web';
@@ -69,7 +69,8 @@ export const Playground : React.FC = (props) => {
insights.trackEvent({ name: 'copySharedLink' });
setCopied(true);
setTimeout(() => setCopied(false), 2000);
- copyShareLinkToClipboard(bicepContent);
+ const shareLink = getShareLink(bicepContent);
+ navigator.clipboard.writeText(shareLink);
}
const handleDecompileClick = (file: File) => {
diff --git a/src/playground/src/utils.ts b/src/playground/src/utils.ts
index 9d6078222f9..1262e385dcd 100644
--- a/src/playground/src/utils.ts
+++ b/src/playground/src/utils.ts
@@ -18,10 +18,15 @@ export function handleShareLink(onContents: (contents : string | null) => void):
}
}
-export function copyShareLinkToClipboard(content: string): void {
+export function getShareLink(content: string) {
const contentHash = encodeHash(content);
- const shareLink = `https://aka.ms/bicepdemo#${contentHash}`;
- navigator.clipboard.writeText(shareLink);
+ let href = document.location.href;
+ if (href === 'https://azure.github.io/bicep/') {
+ // use aka.ms for the official site
+ href = 'https://aka.ms/bicepdemo';
+ }
+
+ return `${href}#${contentHash}`;
}
function encodeHash(content: string): string {