Configure Pull Request Preview (#1552)

* infra: make distribution's location adjustable
openscd · Jul 10, 2024 · 19dddc0 · 19dddc0
1 parent ccfa870
commit 19dddc0
Show file tree

Hide file tree

Showing 10 changed files with 299 additions and 243 deletions.
diff --git a/.github/workflows/pr-preview.yml b/.github/workflows/pr-preview.yml
@@ -1,5 +1,6 @@
 name: Deploy PR previews
 
+
 on:
   pull_request:
     types:
@@ -8,9 +9,11 @@ on:
       - synchronize
       - closed
     paths:
-      - "packages/openscd/**"
+      - "packages/**"
 
 concurrency: preview-${{ github.ref }}
+env:
+  PR_NUMBER: ${{ github.event.number }}
 
 jobs:
   deploy-preview:
@@ -25,9 +28,11 @@ jobs:
         run: |
           npm i @nx/nx-linux-x64-gnu
           npm clean-install
-          npm run-script build
+          PUBLIC_URL=open-scd/pr-preview/pr-$PR_NUMBER npm run-script build
 
       - name: Deploy preview
         uses: rossjrw/pr-preview-action@v1
         with:
-          source-dir: packages/openscd/dist
+          source-dir: packages/distribution/build
+          umbrella-dir: pr-preview
+
diff --git a/packages/distribution/index.html b/packages/distribution/index.html
@@ -3,21 +3,36 @@
 
 <head>
   <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
+  <meta name="viewport"
+        content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
   <meta name="Description"
-    content="Open Substation Communication Designer is a bottom-up system configuration tool for projects described using IEC 61850-6 Edition 2 or greater.">
+        content="Open Substation Communication Designer is a bottom-up system configuration tool for projects described using IEC 61850-6 Edition 2 or greater.">
   <base href="/">
 
   <!-- Original URL from Google: https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@300&family=Roboto:wght@300;400;500&display=swap -->
-  <link href="public/google/fonts/roboto-v27.css" rel="stylesheet">
-  <link href="public/google/fonts/roboto-mono-v13.css" rel="stylesheet">
+  <link href="%PUBLIC_URL%/public/google/fonts/roboto-v27.css"
+        rel="stylesheet">
+  <link href="%PUBLIC_URL%/public/google/fonts/roboto-mono-v13.css"
+        rel="stylesheet">
   <!-- Original URL from Google: https://fonts.googleapis.com/css?family=Material+Icons+Outlined&display=block -->
-  <link href="public/google/icons/material-icons-outlined.css" rel="stylesheet">
-  <link href="public/css/normalize.css" rel="stylesheet">
-  <link rel="manifest" href="manifest.json">
-  <link rel="icon" type="image/png" sizes="16x16" href="public/favicon-16x16.png">
-  <link rel="icon" type="image/png" sizes="32x32" href="public/favicon-32x32.png">
-  <link rel="icon" type="image/png" sizes="192x192" href="public/icon-192x192.png">
+  <link href="%PUBLIC_URL%/public/google/icons/material-icons-outlined.css"
+        rel="stylesheet">
+  <link href="%PUBLIC_URL%/public/css/normalize.css"
+        rel="stylesheet">
+  <link rel="manifest"
+        href="%PUBLIC_URL%/manifest.json">
+  <link rel="icon"
+        type="image/png"
+        sizes="16x16"
+        href="%PUBLIC_URL%/public/favicon-16x16.png">
+  <link rel="icon"
+        type="image/png"
+        sizes="32x32"
+        href="%PUBLIC_URL%/public/favicon-32x32.png">
+  <link rel="icon"
+        type="image/png"
+        sizes="192x192"
+        href="%PUBLIC_URL%/public/icon-192x192.png">
 
   <title>OpenSCD</title>
 </head>
@@ -33,7 +48,8 @@
       }
     };
   </script>
-  <script type="module" src="./main.js"></script>
+  <script type="module"
+          src="%PUBLIC_URL%/main.js"></script>
   <script>
     if ('serviceWorker' in navigator)
       navigator.serviceWorker.register('/sw.js');

diff --git a/packages/distribution/snowpack.config.mjs b/packages/distribution/snowpack.config.mjs
@@ -33,4 +33,7 @@ export default {
     '@openscd/open-scd': '../openscd/',
     '@openscd/plugins': '../plugins/',
   },
+  buildOptions: {
+    baseUrl: process.env.PUBLIC_URL || '/',
+  },
 };
diff --git a/packages/openscd/src/addons/History.ts b/packages/openscd/src/addons/History.ts
@@ -51,15 +51,27 @@ const icons = {
 };
 
 function getPluginName(src: string): string {
-  const plugin = <Plugin>(
-    JSON.parse(localStorage.getItem('plugins') ?? '[]').find(
-      (p: Plugin) => p.src === src
-    )
-  );
-  if (!plugin) return src;
-
-  const name = plugin.name;
-  return name || src;
+
+  let storedPluginsString = localStorage.getItem('plugins');
+  if(!storedPluginsString) {
+    storedPluginsString = '[]';
+  }
+
+  const storedPlugins = JSON.parse(storedPluginsString) as Plugin[];
+  const wantedPlugin = storedPlugins.find((p: Plugin) => p.src === src);
+
+  if(!wantedPlugin) {
+    return `pluginnotfound: ${src} in ${storedPluginsString}`;
+  }
+
+  const name = wantedPlugin.name;
+
+  if(!name){
+    return `pluginhasnoname:${src}`;
+  }
+
+  return name;
+
 }
 
 export enum HistoryUIKind {
@@ -403,9 +415,11 @@ export class OscdHistory extends LitElement {
   renderValidatorsIssues(issues: IssueDetail[]): TemplateResult[] {
     if (issues.length === 0) return [html``];
     return [
-      html`<mwc-list-item noninteractive
-        >${getPluginName(issues[0].validatorId)}</mwc-list-item
-      >`,
+      html`
+        <mwc-list-item noninteractive>
+          ${getPluginName(issues[0].validatorId)}
+        </mwc-list-item>
+      `,
       html`<li divider padded role="separator"></li>`,
       ...issues.map(issue => this.renderIssueEntry(issue)),
     ];
@@ -531,12 +545,12 @@ export class OscdHistory extends LitElement {
       </style>
       ${this.renderLogDialog()} ${this.renderHistoryUI()}
       <mwc-dialog id="diagnostic" heading="${get('diag.name')}">
-        <filtered-list id="content" wrapFocus
-          >${this.renderIssues()}</filtered-list
-        >
-        <mwc-button slot="primaryAction" dialogaction="close"
-          >${get('close')}</mwc-button
-        >
+        <filtered-list id="content" wrapFocus>
+          ${this.renderIssues()}
+        </filtered-list>
+        <mwc-button slot="primaryAction" dialogaction="close">
+          ${get('close')}
+        </mwc-button>
       </mwc-dialog>
 
       <mwc-snackbar