Tweak the non-desktop platforms text (#198)

Author: microbit-matt-hillsdon

src/messages/ui.en.json

@@ -244,7 +244,7 @@
   "connectMB.transferHex.altText": "animation of dragging a hex file from the downloads folder onto the micro:bit drive or device listed in the file explorer",
 
   "compatibility.platform.notSupported": "The tool is not supported on your current platform.",
-  "compatibility.platform.notSupported.joinDesktop": "Join us on desktop.",
+  "compatibility.platform.notSupported.joinDesktop": "Please use Google Chrome or Microsoft Edge on a computer.",
   "compatibility.webgl.notSupported": "WebGL not available. Enable WebGL to see 3D data view.",
 
   "loading": "loading",

src/router/paths.ts

@@ -6,6 +6,7 @@
 
 import { writable, Writable, get, derived } from 'svelte/store';
 import type { MessageFormatter } from '../i18n';
+import { appName } from '../script/environment';
 export const Paths = {
   HOME: '/',
   PLAYGROUND: 'playground',
@@ -31,7 +32,6 @@ export function navigate(path: PathType) {
   currentPathPrivate.set(path);
 }
 
-const appName = 'micro:bit machine learning tool';
 export const getTitle = (path: PathType, t: MessageFormatter) => {
   switch (path) {
     case '/': {

src/script/environment.ts

@@ -4,6 +4,8 @@
  * SPDX-License-Identifier: MIT
  */
 
+export const appName = 'micro:bit machine learning tool';
+
 // See CI & package.json scripts.
 export const version = import.meta.env.VITE_VERSION || 'local';
 export type Stage = 'local' | 'review' | 'staging' | 'production';

src/views/IncompatiblePlatformView.svelte

@@ -6,11 +6,12 @@
 
 <script>
   import { t } from '../i18n';
+  import { appName } from '../script/environment';
 </script>
 
 <div class="h-screen w-screen bg-secondary flex flex-col justify-center items-center">
   <p class="mb-4 text-secondarytext font-extrabold text-5xl">
-    {'ML-Machine'}
+    {appName}
   </p>
   <p class="text-primarytext text-center mb-2">
     {$t('compatibility.platform.notSupported')}