fix ui stuff and add test

johnstcn · johnstcn · commit 3a90806618f4 · 2022-08-30T09:33:17.000Z
diff --git a/site/package.json b/site/package.json
@@ -53,7 +53,6 @@
     "react-i18next": "11.18.4",
     "react-markdown": "8.0.3",
     "react-router-dom": "6.3.0",
-    "semver": "^7.3.7",
     "sourcemapped-stacktrace": "1.1.11",
     "swr": "1.3.0",
     "tzdata": "1.0.30",
@@ -82,6 +81,7 @@
     "@types/react": "18.0.15",
     "@types/react-dom": "18.0.6",
     "@types/react-helmet": "6.1.5",
+    "@types/semver": "^7.3.12",
     "@types/superagent": "4.1.15",
     "@types/uuid": "8.3.4",
     "@typescript-eslint/eslint-plugin": "5.31.0",
@@ -113,6 +113,7 @@
     "prettier": "2.7.1",
     "prettier-plugin-organize-imports": "3.0.0",
     "react-hot-loader": "4.13.0",
+    "semver": "^7.3.7",
     "sql-formatter": "8.2.0",
     "style-loader": "3.3.1",
     "ts-jest": "27.1.4",
diff --git a/site/src/components/Resources/Resources.tsx b/site/src/components/Resources/Resources.tsx
@@ -117,6 +117,7 @@ export const Resources: FC<React.PropsWithChildren<ResourcesProps>> = ({
                       <TableCell className={styles.agentColumn}>
                         {agent.name}
                         <div className={styles.agentInfo}>
+                          Version
                           <span
                             className={styles.agentVersion}
                             style={{ color: versionStatus.color }}
diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx
@@ -132,7 +132,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
               getResourcesError={workspaceErrors[WorkspaceErrors.GET_RESOURCES_ERROR]}
               workspace={workspace}
               canUpdateWorkspace={canUpdateWorkspace}
-              buildinfo={buildInfoState.context.buildInfo}
+              buildInfo={buildInfoState.context.buildInfo}
             />
           )}
 
diff --git a/site/src/util/workspace.test.ts b/site/src/util/workspace.test.ts
@@ -3,6 +3,7 @@ import * as TypesGen from "../api/typesGenerated"
 import * as Mocks from "../testHelpers/entities"
 import {
   defaultWorkspaceExtension,
+  getDisplayVersionStatus,
   getDisplayWorkspaceBuildInitiatedBy,
   isWorkspaceDeleted,
   isWorkspaceOn,
@@ -128,4 +129,35 @@ describe("util > workspace", () => {
       expect(getDisplayWorkspaceBuildInitiatedBy(build)).toEqual(initiatedBy)
     })
   })
+
+  describe("getDisplayVersionStatus", () => {
+    const mockTheme = {
+      palette: {
+        text: {
+          secondary: "palette.text.secondary",
+        },
+        primary: {
+          main: "palette.primary.main",
+        },
+        success: {
+          main: "palette.secondary.main",
+        },
+      },
+    }
+    it.each<[string, string, string]>([
+      ["", "", "(unknown)"],
+      ["", "v1.2.3", "(unknown)"],
+      ["v1.2.3", "", "v1.2.3"],
+      ["v1.2.3", "v1.2.3", "v1.2.3"],
+      ["v1.2.3", "v1.2.4", "v1.2.3 (outdated)"],
+      ["v1.2.4", "v1.2.3", "v1.2.4"],
+      ["foo", "bar", "foo"],
+    ])(
+      `getDisplayVersionStatus(theme, %p, %p) returns %p`,
+      (agentVersion, serverVersion, expectedVersion) => {
+        const { version } = getDisplayVersionStatus(mockTheme, agentVersion, serverVersion)
+        expect(version).toEqual(expectedVersion)
+      },
+    )
+  })
 })
diff --git a/site/src/util/workspace.ts b/site/src/util/workspace.ts
@@ -3,9 +3,9 @@ import dayjs from "dayjs"
 import duration from "dayjs/plugin/duration"
 import minMax from "dayjs/plugin/minMax"
 import utc from "dayjs/plugin/utc"
+import semver from "semver"
 import { WorkspaceBuildTransition } from "../api/types"
 import * as TypesGen from "../api/typesGenerated"
-import semver from "semver"
 
 dayjs.extend(duration)
 dayjs.extend(utc)
@@ -97,7 +97,8 @@ export const DisplayWorkspaceBuildStatusLanguage = {
 }
 
 export const DisplayAgentVersionLanguage = {
-  unknown: "(unknown)",
+  unknown: "unknown",
+  outdated: "outdated",
 }
 
 export const getDisplayWorkspaceBuildStatus = (
@@ -217,31 +218,37 @@ export const getDisplayAgentStatus = (
 }
 
 export const getDisplayVersionStatus = (
-  theme: Theme,
+  theme: {
+    palette: {
+      text: {
+        secondary: string
+      }
+      primary: { main: string }
+      success: { main: string }
+    }
+  },
   agentVersion: string,
   serverVersion: string,
 ): {
-    color: string,
-    version: string,
-  } => {
-  if (!semver.valid(serverVersion) || semver.valid(agentVersion)) {
+  color: string
+  version: string
+} => {
+  if (!semver.valid(serverVersion) || !semver.valid(agentVersion)) {
+    return {
+      color: theme.palette.text.secondary,
+      version: `${agentVersion}` || `(${DisplayAgentVersionLanguage.unknown})`,
+    }
+  } else if (semver.lt(agentVersion, serverVersion)) {
     return {
       color: theme.palette.primary.main,
-      version: agentVersion || "(version unknown)",
+      version: `${agentVersion} (${DisplayAgentVersionLanguage.outdated})`,
     }
-  }
-
-  if (semver.lt(agentVersion, serverVersion)) {
+  } else {
     return {
-      color: theme.palette.text.secondary,
-      version: `${agentVersion} (outdated)`,
+      color: theme.palette.success.main,
+      version: agentVersion,
     }
   }
-
-  return {
-    color: theme.palette.success.main,
-    version: agentVersion,
-  }
 }
 
 export const isWorkspaceOn = (workspace: TypesGen.Workspace): boolean => {
diff --git a/site/yarn.lock b/site/yarn.lock
@@ -3330,6 +3330,11 @@
   resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
   integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==
 
+"@types/semver@^7.3.12":
+  version "7.3.12"
+  resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.3.12.tgz#920447fdd78d76b19de0438b7f60df3c4a80bf1c"
+  integrity sha512-WwA1MW0++RfXmCr12xeYOOC5baSC9mSb0ZqCquFzKhcoF4TvHu5MKOuXsncgZcpVFhB1pXd5hZmM0ryAoCp12A==
+
 "@types/serve-index@^1.9.1":
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/@types/serve-index/-/serve-index-1.9.1.tgz#1b5e85370a192c01ec6cec4735cf2917337a6278"
