Merge branch 'main' into merge-upstream

.github/workflows/build.yml

@@ -0,0 +1,53 @@
+name: build
+
+on:
+  release:
+    types: [created]
+  push:
+    branches:
+      - "**"
+
+concurrency:
+  group: ${{ github.workflow }}-${{ startsWith(github.ref, 'refs/tags/v') && 'release' || github.ref }}
+  cancel-in-progress: ${{ github.ref != 'refs/heads/main' && !startsWith(github.ref, 'refs/tags/v') }}
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: read
+    env:
+      AWS_DEFAULT_REGION: eu-west-1
+      PRODUCTION_CLOUDFRONT_DISTRIBUTION_ID: NOT_YET
+      STAGING_CLOUDFRONT_DISTRIBUTION_ID: E37K3V5Y65XQIX
+      REVIEW_CLOUDFRONT_DISTRIBUTION_ID: E3KUGPF02I4CJ4
+      VITE_FOUNDATION_BUILD: ${{ github.repository_owner == 'microbit-foundation' }}
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: 'npm'
+          registry-url: "https://npm.pkg.github.com"
+      - run: npm ci
+      - run: npm install --no-save @microbit-foundation/[email protected] @microbit-foundation/[email protected] @microbit-foundation/npm-package-versioner@2
+        if: github.repository_owner == 'microbit-foundation'
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - run: npx update-ci-version
+      - run: node ./bin/print-ci-env.cjs >> $GITHUB_ENV
+      - run: npm run test
+      - run: npm run check
+      - run: npx prettier --check src
+      - run: npm run build
+      - run: npx website-deploy-aws
+        if: github.repository_owner == 'microbit-foundation' && (env.STAGE == 'REVIEW' || success())
+        env:
+          AWS_ACCESS_KEY_ID: ${{ secrets.WEB_DEPLOY_ML_AWS_ACCESS_KEY_ID }}
+          AWS_SECRET_ACCESS_KEY: ${{ secrets.WEB_DEPLOY_ML_AWS_SECRET_ACCESS_KEY }}
+      - run: npx invalidate-cloudfront-distribution
+        if: github.repository_owner == 'microbit-foundation' && (env.STAGE == 'REVIEW' || success())
+        env:
+          AWS_ACCESS_KEY_ID: ${{ secrets.WEB_DEPLOY_ML_AWS_ACCESS_KEY_ID }}
+          AWS_SECRET_ACCESS_KEY: ${{ secrets.WEB_DEPLOY_ML_AWS_SECRET_ACCESS_KEY }}

bin/print-ci-env.cjs

@@ -0,0 +1,23 @@
+#!/usr/bin/env node
+
+const ref = process.env.GITHUB_REF;
+let stage;
+if (ref === 'refs/heads/main') {
+  stage = 'STAGING';
+} else if (ref.startsWith('refs/tags/v')) {
+  stage = 'PRODUCTION';
+} else {
+  stage = 'REVIEW';
+}
+
+process.env.STAGE = stage;
+// STAGE must be defined before this is imported
+const { bucketName, bucketPrefix } = require('../deployment.cjs');
+const baseUrl = !bucketPrefix ? '/' : `/${bucketPrefix}/`;
+const fullUrl = `https://${bucketName}${baseUrl}`;
+
+console.log(`STAGE=${stage}`);
+console.log(`VITE_STAGE=${stage}`);
+console.log(`BASE_URL=${baseUrl}`);
+// This can be used for og:url and similar. Not quite right for review domain but we don't really care.
+console.log(`VITE_FULL_URL=${fullUrl}`);

deployment.cjs

@@ -0,0 +1,50 @@
+const {
+  createDeploymentDetailsFromOptions,
+} = require('@microbit-foundation/website-deploy-aws-config');
+
+const { s3Config } = createDeploymentDetailsFromOptions({
+  production: {
+    bucket: 'ml.microbit.org',
+    mode: 'root',
+    allowPrerelease: false,
+  },
+  staging: {
+    bucket: 'stage-ml.microbit.org',
+  },
+  review: {
+    bucket: 'review-ml.microbit.org',
+    mode: 'branch-prefix',
+  },
+});
+
+module.exports = {
+  deploymentDir: './dist',
+  ...s3Config,
+  region: 'eu-west-1',
+  removeNonexistentObjects: true,
+  enableS3StaticWebsiteHosting: true,
+  errorDocumentKey: 'index.html',
+  redirects: [],
+  params: {
+    '**/**.html': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+    '**/assets/**': { CacheControl: 'public, max-age=31536000, immutable' },
+    // There's lots in public/ that we'd ideally use the bundler for to improve caching
+    'css/**': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+    'firmware/**': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+    'imgs/**': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+    'sounds/**': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+    'webfonts/**': {
+      CacheControl: 'public, max-age=0, must-revalidate',
+    },
+  },
+};

index.html

@@ -12,8 +12,8 @@
     <title>&#65279;</title>
 
     <link rel="icon" type="image/png" href="/imgs/favicon.png" />
-    <link rel="stylesheet" href="/global.css" />
-    <link rel="stylesheet" href="/all.min.css" />
+    <link rel="stylesheet" href="/css/global.css" />
+    <link rel="stylesheet" href="/css/all.min.css" />
 
     <script
       src="https://shared-assets.microbit.org/common/v1/common.js"

src/App.svelte

@@ -23,6 +23,7 @@
   import BottomPanel from './components/bottom/BottomPanel.svelte';
   import { t } from './i18n';
   import { consent } from './script/stores/complianceStore';
+  import microbitLogoImage from './imgs/microbit-logo.svg';
 
   ConnectionBehaviours.setInputBehaviour(new InputBehaviour());
   ConnectionBehaviours.setOutputBehaviour(new OutputBehaviour());
@@ -50,11 +51,7 @@
 
       <div class="w-full flex flex-col bg-backgrounddark">
         <ControlBar>
-          <img
-            class="mr-8"
-            src="/imgs/microbit-logo.svg"
-            alt="Micro:bit logo"
-            width="150px" />
+          <img class="mr-8" src={microbitLogoImage} alt="Micro:bit logo" width="150px" />
           <h1 class="text-xl font-thin whitespace-nowrap">{$t('content.index.title')}</h1>
           <div class="flex flex-row basis-full justify-end">
             <SelectLanguageControlBarDropdown />

src/__tests__/license-identifiers.test.ts

@@ -12,7 +12,12 @@ import 'jest-expect-message';
 import * as path from 'path';
 
 // Place files you wish to ignore by name in here
-const ignoredFiles: string[] = ['.DS_Store', 'ui.da.json', 'ui.en.json', 'README.md'];
+const ignoredFiles: RegExp[] = [
+  /^\.DS_Store$/,
+  /^ui.[a-z-]+.json$/,
+  /\.(gif|svg|png|jpg|jpeg)$/,
+  /^README.md$/,
+];
 const directoriesToScan = ['./src/', './microbit/v2/source/', './microbit/v1/source/'];
 
 const licenseIdentifierStringSPDX = 'SPDX-License-Identifier:';
@@ -27,12 +32,12 @@ type DirectoryContents = {
   folders: string[];
 };
 
-const readDirectory = (directory: string, ignoreList: string[]): DirectoryContents => {
+const readDirectory = (directory: string, ignoreList: RegExp[]): DirectoryContents => {
   const files: string[] = [];
   const folders: string[] = [];
   const filesRead = fs.readdirSync(directory);
   filesRead.forEach(file => {
-    if (ignoreList.includes(file)) return;
+    if (ignoreList.some(ignoreRegExp => ignoreRegExp.test(file))) return;
     const fileLocation = path.join(directory, file);
     const stats = fs.statSync(fileLocation);
     if (stats.isFile()) {

src/__viteBuildVariants__/ml-machine/windi.config.js

@@ -19,7 +19,7 @@ export default {
         backgroundlight: '#ffffff',
         infolight: '#93c5fd',
         link: '#6c4bc1',
-        warning: '#ffaaaa',
+        warning: '#cd0365',
         disabled: '#8892A3',
         primaryborder: '#E5E7EB',
         infobglight: '#E7E5E4',