fix(app): fix various install and version issues (#14926)

Fixes various ongoing issues building versions into the system. This is
a follow-on to #14844 (61b1371)

- vite `define` config the way we do it does not hang the defined values
off of props of `global` explicitly (or maybe us injecting
`'globalThis'` into `global` breaks it) so use them as true globals,
altering the way they're accessed and the way they're declared in the
typings.
- i guess you don't actually have to do type imports in the top level
typings? removing the type import of the ipc bridge in the app-shell and
app-shell-odd global.d.ts fixed that issue. don't know why
- the ESM import for the script that updates the releases.json was wrong
which breaks some update stuff

## Testing
This is a bit annoying to test.

You _must_ test this on a compiled app package. You _cannot_ test this
on a dev build.
On a compiled app package,
- [x] the version should display in the settings tab of the app
- [x] you shouldn't have warnings about `include` on undefined in your
app logs
- [ ] you should get robot update prompts when you use an
internal-release build and connect to a robot running 1.3 or previous;
you should get robot update prompts when you use a release build and
connect to a robot running 7.2.1 or previous (note: couldn't test this
in time but the rest of it works)
- [x] the help menu should have a bugs url that works (the "report an
issue" button; it should pop a browser tab)
- [x] the help menu should say "View Opentrons App Logs" or "View
Opentrons OT-3 App Logs" as the variant demands
- [x] it should NOT say "View App Logs". that means the package name
wasn't properly interpolated.

I haven't dev-tested the second part because on my home setup making a
full compiled app package is broken for some reason, and you can't
actually run the node side in dev
This once more,
Closes EXEC-385 
Closes RQA-2579

app-shell-odd/src/config/__fixtures__/index.ts

@@ -11,11 +11,13 @@ import type {
   ConfigV21,
 } from '@opentrons/app/src/redux/config/types'
 
+const PKG_VERSION: string = _PKG_VERSION_
+
 export const MOCK_CONFIG_V12: ConfigV12 = {
   version: 12,
   devtools: false,
   reinstallDevtools: false,
-  update: { channel: _PKG_VERSION_.includes('beta') ? 'beta' : 'latest' },
+  update: { channel: PKG_VERSION.includes('beta') ? 'beta' : 'latest' },
   log: { level: { file: 'debug', console: 'info' } },
   ui: {
     width: 1024,

app-shell-odd/src/config/migrate.ts

@@ -22,11 +22,12 @@ import type {
 
 const CONFIG_VERSION_LATEST = 21 // update this after each config version bump
 
+const PKG_VERSION: string = _PKG_VERSION_
 export const DEFAULTS_V12: ConfigV12 = {
   version: 12,
   devtools: false,
   reinstallDevtools: false,
-  update: { channel: _PKG_VERSION_.includes('beta') ? 'beta' : 'latest' },
+  update: { channel: PKG_VERSION.includes('beta') ? 'beta' : 'latest' },
   log: { level: { file: 'debug', console: 'info' } },
   ui: {
     width: 1024,

app-shell-odd/src/update.ts

@@ -14,15 +14,15 @@ import type { ReleaseSetUrls } from './system-update/types'
 
 const log = createLogger('update')
 
+const OPENTRONS_PROJECT: string = _OPENTRONS_PROJECT_
+
 export const FLEX_MANIFEST_URL =
-  // @ts-expect-error can't get TS to recognize global.d.ts
-  global._OPENTRONS_PROJECT_ &&
-  // @ts-expect-error can't get TS to recognize global.d.ts
-  global._OPENTRONS_PROJECT_.includes('robot-stack')
+  OPENTRONS_PROJECT && OPENTRONS_PROJECT.includes('robot-stack')
     ? 'https://builds.opentrons.com/ot3-oe/releases.json'
     : 'https://ot3-development.builds.opentrons.com/ot3-oe/releases.json'
 
-let LATEST_OT_SYSTEM_VERSION = _PKG_VERSION_
+const PKG_VERSION = _PKG_VERSION_
+let LATEST_OT_SYSTEM_VERSION = PKG_VERSION
 
 const channelFinder = (version: string, channel: string): boolean => {
   // return the latest alpha/beta if a user subscribes to alpha/beta updates
@@ -60,7 +60,7 @@ export const updateLatestVersion = (): Promise<string> => {
         })
         .find(verson => channelFinder(verson, channel))
       const changed = LATEST_OT_SYSTEM_VERSION !== latestAvailableVersion
-      LATEST_OT_SYSTEM_VERSION = latestAvailableVersion ?? _PKG_VERSION_
+      LATEST_OT_SYSTEM_VERSION = latestAvailableVersion ?? PKG_VERSION
       if (changed) {
         log.info(
           `Update: latest version available from ${FLEX_MANIFEST_URL} is ${latestAvailableVersion}`
@@ -80,7 +80,7 @@ export const getLatestVersion = (): string => {
   return LATEST_OT_SYSTEM_VERSION
 }
 
-export const getCurrentVersion = (): string => _PKG_VERSION_
+export const getCurrentVersion = (): string => PKG_VERSION
 
 export const isUpdateAvailable = (): boolean =>
   getLatestVersion() !== getCurrentVersion()

app-shell-odd/typings/global.d.ts

@@ -1,11 +1,4 @@
-import type { IpcRenderer } from 'electron'
-
 declare global {
-  const _PKG_VERSION_: string
-  const _PKG_PRODUCT_NAME_: string
-  const _PKG_BUGS_URL_: string
-  const _OPENTRONS_PROJECT_: string
-
   namespace NodeJS {
     export interface Global {
       APP_SHELL_REMOTE: {
@@ -14,3 +7,8 @@ declare global {
     }
   }
 }
+
+declare const _PKG_VERSION_: string
+declare const _PKG_PRODUCT_NAME_: string
+declare const _PKG_BUGS_URL_: string
+declare const _OPENTRONS_PROJECT_: string

app-shell/src/menu.ts

@@ -5,6 +5,9 @@ import type { MenuItemConstructorOptions } from 'electron'
 
 import { LOG_DIR } from './log'
 
+const PRODUCT_NAME: string = _PKG_PRODUCT_NAME_
+const BUGS_URL: string = _PKG_BUGS_URL_
+
 // file or application menu
 const firstMenu: MenuItemConstructorOptions = {
   role: process.platform === 'darwin' ? 'appMenu' : 'fileMenu',
@@ -27,8 +30,7 @@ const helpMenu: MenuItemConstructorOptions = {
       },
     },
     {
-      // @ts-expect-error can't get TS to recognize global.d.ts
-      label: `View ${global._PKG_PRODUCT_NAME_} App Logs`,
+      label: `View ${PRODUCT_NAME} App Logs`,
       click: () => {
         shell.openPath(LOG_DIR)
       },
@@ -37,8 +39,7 @@ const helpMenu: MenuItemConstructorOptions = {
       label: 'Report an Issue',
       click: () => {
         // eslint-disable-next-line @typescript-eslint/no-floating-promises
-        // @ts-expect-error can't get TS to recognize global.d.ts
-        shell.openExternal(global._PKG_BUGS_URL_)
+        shell.openExternal(BUGS_URL)
       },
     },
   ],

app-shell/src/robot-update/constants.ts

@@ -4,6 +4,8 @@ import type { UpdateManifestUrls } from './types'
 import type { RobotUpdateTarget } from '@opentrons/app/src/redux/robot-update/types'
 import { CURRENT_VERSION } from '../update'
 
+const OPENTRONS_PROJECT: string = _OPENTRONS_PROJECT_
+
 const UPDATE_MANIFEST_URLS_RELEASE = {
   ot2: 'https://builds.opentrons.com/ot2-br/releases.json',
   flex: 'https://builds.opentrons.com/ot3-oe/releases.json',
@@ -15,8 +17,7 @@ const UPDATE_MANIFEST_URLS_INTERNAL_RELEASE = {
 }
 
 export const getUpdateManifestUrls = (): UpdateManifestUrls =>
-  // @ts-expect-error can't get TS to recognize global.d.ts
-  global._OPENTRONS_PROJECT_.includes('robot-stack')
+  OPENTRONS_PROJECT.includes('robot-stack')
     ? UPDATE_MANIFEST_URLS_RELEASE
     : UPDATE_MANIFEST_URLS_INTERNAL_RELEASE
 

app-shell/typings/global.d.ts

@@ -1,8 +1,9 @@
 /* eslint-disable no-var */
 declare global {
-  var _PKG_VERSION_: string
-  var _PKG_PRODUCT_NAME_: string
-  var _PKG_BUGS_URL_: string
-  var _OPENTRONS_PROJECT_: string
   var APP_SHELL_REMOTE: { ipcRenderer: IpcRenderer; [key: string]: any }
 }
+
+declare const _PKG_VERSION_: string
+declare const _PKG_PRODUCT_NAME_: string
+declare const _PKG_BUGS_URL_: string
+declare const _OPENTRONS_PROJECT_: string

app/src/App/Navbar.tsx

@@ -28,6 +28,7 @@ import { NAV_BAR_WIDTH } from './constants'
 import type { RouteProps } from './types'
 
 const SALESFORCE_HELP_LINK = 'https://support.opentrons.com/s/'
+const PROJECT: string = _OPENTRONS_PROJECT_
 
 const NavbarLink = styled(NavLink)`
   color: ${COLORS.white};
@@ -128,7 +129,7 @@ export function Navbar({ routes }: { routes: RouteProps[] }): JSX.Element {
         alignSelf={ALIGN_STRETCH}
       >
         <LogoImg
-          src={global._OPENTRONS_PROJECT_ === 'ot3' ? logoSvgThree : logoSvg}
+          src={PROJECT === 'ot3' ? logoSvgThree : logoSvg}
           alt="opentrons logo"
         />
         {navRoutes.map(({ name, navLinkTo }: RouteProps) => (

app/src/redux/shell/index.ts

@@ -5,4 +5,4 @@ export * from './update'
 export * from './is-ready/actions'
 export * from './is-ready/selectors'
 
-export const CURRENT_VERSION: string = (global as any)._PKG_VERSION_
+export const CURRENT_VERSION: string = _PKG_VERSION_

app/typings/global.d.ts

@@ -1,6 +1,4 @@
 declare const global: typeof globalThis & {
-  _PKG_VERSION_: string
-  _OPENTRONS_PROJECT_: string
   APP_SHELL_REMOTE: {
     // sa 02-02-2024 any typing this because importing the IpcRenderer type
     // from electron makes this ambient type declaration a module instead of
@@ -9,3 +7,6 @@ declare const global: typeof globalThis & {
     [key: string]: any
   }
 }
+
+declare const _PKG_VERSION_: string
+declare const _OPENTRONS_PROJECT_: string

scripts/update-releases-json.js

@@ -4,8 +4,6 @@ const fs = require('fs/promises')
 
 // Updates a releases historical manifest with a release's version.
 
-const versionFinder = require('./git-version.mjs')
-
 const parseArgs = require('./deploy/lib/parseArgs')
 const USAGE =
   '\nUsage:\n node ./scripts/update-releases-json <releases-json-path> <project> <artifact-dir> <url-base>'
@@ -63,6 +61,7 @@ async function main() {
   }
   console.log(`Updating ${releasesPath} with artifacts from ${artifactDirPath}`)
   const releasesData = await readOrDefaultReleases(releasesPath)
+  const versionFinder = await import('./git-version.mjs')
   const version = await versionFinder.versionForProject(project)
   console.log(`Adding data for ${version}`)
   releasesData.production[version] = {

setup-vitest.ts

@@ -10,6 +10,9 @@ vi.mock('./app/src/redux/shell/remote')
 
 process.env.OT_PD_VERSION = 'fake_PD_version'
 global._PKG_VERSION_ = 'test environment'
+global._OPENTRONS_PROJECT_ = 'robotics'
+global._PKG_PRODUCT_NAME_ = 'test product'
+global._PKG_BUGS_URL_ = 'http://bugs.contoso.com'
 
 afterEach(() => {
   cleanup()