disable set target for lower versions

Author: david-crespo

app/pages/system/UpdatePage.tsx

@@ -9,6 +9,7 @@
 import { differenceInMinutes } from 'date-fns'
 import { useMemo } from 'react'
 import * as R from 'remeda'
+import { lt as semverLt } from 'semver'
 
 import {
   Images24Icon,
@@ -198,7 +199,17 @@ export default function UpdatePage() {
         <CardBlock.Body>
           <ul className="space-y-3">
             {repos.items.map((repo) => {
-              const isTarget = repo.systemVersion === status.targetRelease?.version
+              const targetVersion = status.targetRelease?.version
+              const isTarget = repo.systemVersion === targetVersion
+              // semverLt looks at prerelease meta but not build meta. In prod
+              // it doesn't matter either way because there will be neither. On
+              // dogfood it shouldn't matter because the versions will usually
+              // be the same and with the same prelease meta and only differing
+              // build meta, so semverLt will return false and we don't disable
+              // any. Very important this is
+              const olderThanTarget = targetVersion
+                ? semverLt(repo.systemVersion, targetVersion)
+                : false
               return (
                 <li
                   key={repo.hash}
@@ -249,10 +260,13 @@ export default function UpdatePage() {
                             errorTitle: `Error setting target release to ${repo.systemVersion}`,
                           })
                         }}
-                        // TODO: follow API logic, disabling for older releases.
-                        // Or maybe just have the API tell us by adding a field to
-                        // the TufRepo response type.
-                        disabled={isTarget && 'Already set as target'}
+                        disabled={
+                          isTarget
+                            ? 'Already set as target'
+                            : olderThanTarget
+                              ? 'Cannot set older release as target'
+                              : false
+                        }
                       />
                     </MoreActionsMenu>
                   </div>

package.json

@@ -70,6 +70,7 @@
     "react-stately": "^3.32.2",
     "recharts": "^2.15.1",
     "remeda": "^2.30.0",
+    "semver": "^7.7.3",
     "simplebar-react": "^3.2.6",
     "ts-pattern": "^5.8.0",
     "tslib": "^2.7.0",
@@ -129,7 +130,6 @@
     "prettier": "^3.4.2",
     "prettier-plugin-tailwindcss": "^0.6.14",
     "resize-observer-polyfill": "^1.5.1",
-    "semver": "^7.7.3",
     "tailwindcss": "^4.1.14",
     "tsx": "^4.19.2",
     "type-fest": "^4.33.0",

test/e2e/system-update.e2e.ts

@@ -53,6 +53,8 @@ test('Set target release', async ({ page }) => {
   await page.getByRole('button', { name: '17.0.0 actions' }).click()
   const disabledItem = page.getByRole('menuitem', { name: 'Set as target release' })
   await expect(disabledItem).toBeDisabled()
+  await disabledItem.hover()
+  await expect(page.getByText('Already set as target')).toBeVisible()
   await page.keyboard.press('Escape')
 
   // Upgrade to 18.0.0
@@ -77,6 +79,13 @@ test('Set target release', async ({ page }) => {
 
   const release18 = page.getByRole('listitem').filter({ hasText: '18.0.0' })
   await expect(release18.getByText('Target')).toBeVisible()
+
+  // Set target on 17 should still be disabled, but now for a different reason
+  await page.getByRole('button', { name: '17.0.0 actions' }).click()
+  const setTargetItem = page.getByRole('menuitem', { name: 'Set as target release' })
+  await expect(setTargetItem).toBeDisabled()
+  await setTargetItem.hover()
+  await expect(page.getByText('Cannot set older release as target')).toBeVisible()
 })
 
 test('Cannot downgrade to older release', async ({ page }) => {
@@ -88,23 +97,12 @@ test('Cannot downgrade to older release', async ({ page }) => {
   const release17 = page.getByRole('listitem').filter({ hasText: '17.0.0' })
   await expect(release17.getByText('Target')).toBeVisible()
 
-  // Try to downgrade to 16.0.0
+  // Try to downgrade to 16.0.0 - button should be disabled
   await page.getByRole('button', { name: '16.0.0 actions' }).click()
-  await page.getByRole('menuitem', { name: 'Set as target release' }).click()
-
-  const modal = page.getByRole('dialog', { name: 'Confirm set target release' })
-  await expect(modal).toBeVisible()
-  await expect(
-    modal.getByText('Are you sure you want to set 16.0.0 as the target release?')
-  ).toBeVisible()
-
-  await page.getByRole('button', { name: 'Confirm' }).click()
-
-  // Verify error toast appears
-  await expectToast(
-    page,
-    'Requested target release (16.0.0) must not be older than current target release (17.0.0).'
-  )
+  const setTargetItem = page.getByRole('menuitem', { name: 'Set as target release' })
+  await expect(setTargetItem).toBeDisabled()
+  await setTargetItem.hover()
+  await expect(page.getByText('Cannot set older release as target')).toBeVisible()
 
   // Verify the target release has NOT changed - still 17.0.0
   await expect(page.getByLabel('Properties table')).toContainText('17.0.0')