diff --git a/package.json b/package.json
index d4b9957cd..de1535d64 100644
--- a/package.json
+++ b/package.json
@@ -122,6 +122,7 @@
     "react-joyride": "^2.5.3",
     "react-redux": "^8.0.5",
     "react-router-last-location": "^2.0.1",
+    "semver": "^7.5.4",
     "showdown": "^2.1.0"
   },
   "packageManager": "yarn@3.3.0"
diff --git a/src/app/utils/utils.ts b/src/app/utils/utils.ts
index dc968df5a..8ef96e278 100644
--- a/src/app/utils/utils.ts
+++ b/src/app/utils/utils.ts
@@ -19,6 +19,8 @@ import { ISortBy, SortByDirection } from '@patternfly/react-table';
 import _ from 'lodash';
 import { useHistory } from 'react-router-dom';
 import { BehaviorSubject, Observable } from 'rxjs';
+import semverGt from 'semver/functions/gt';
+import semverValid from 'semver/functions/valid';
 import { getFromLocalStorage } from './LocalStorage';
 
 const SECOND_MILLIS = 1000;
@@ -242,46 +244,9 @@ export const getActiveTab = <T>(search: string, key: string, supportedTabs: T[],
 
 export const clickOutside = () => document.body.click();
 
-export interface SemVer {
-  major: number;
-  minor: number;
-  patch: number;
-}
-
-// https://semver.org/#is-there-a-suggested-regular-expression-regex-to-check-a-semver-string
-export const semverRegex =
-  /^(0|[1-9]\d*)\.(0|[1-9]\d*)\.(0|[1-9]\d*)(?:-((?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*)(?:\.(?:0|[1-9]\d*|\d*[a-zA-Z-][0-9a-zA-Z-]*))*))?(?:\+([0-9a-zA-Z-]+(?:\.[0-9a-zA-Z-]+)*))?$/;
-
-export const getSemVer = (str: string): SemVer | undefined => {
-  const matched = str.match(semverRegex);
-  if (matched) {
-    const [_, major, minor, patch] = matched;
-    return {
-      major: Number(major),
-      minor: Number(minor),
-      patch: Number(patch),
-    };
-  }
-  return undefined;
-};
-
-const convert = (ver: SemVer) => ver.major * 100 + ver.minor * 10 + ver.patch;
-
-export const compareSemVer = (ver1: SemVer, ver2: SemVer): number => {
-  const _ver1 = convert(ver1);
-  const _ver2 = convert(ver2);
-  return _ver1 > _ver2 ? 1 : _ver1 < _ver2 ? -1 : 0;
-};
-
-export const isAssetNew = (currVerStr: string) => {
-  const oldVer = getSemVer(getFromLocalStorage('ASSET_VERSION', '0.0.0'));
-  const currVer = getSemVer(currVerStr);
-
-  if (!currVer) {
-    throw new Error(`Invalid asset version: ${currVer}`);
-  }
-  // Invalid (old) version is ignored.
-  return !oldVer || compareSemVer(currVer, oldVer) > 0;
+export const isAssetNew = (currVer: string) => {
+  const oldVer: string = getFromLocalStorage('ASSET_VERSION', '0.0.0');
+  return !semverValid(oldVer) || semverGt(currVer, oldVer);
 };
 
 export const utf8ToBase32 = (str: string): string => {
diff --git a/yarn.lock b/yarn.lock
index 8709bdf13..077179b18 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4124,6 +4124,7 @@ __metadata:
     rimraf: ^4.1.2
     rxjs: ^7.8.0
     selenium-webdriver: ^4.10.0
+    semver: ^7.5.4
     showdown: ^2.1.0
     style-loader: ^3.3.1
     svg-url-loader: ^8.0.0
@@ -12057,6 +12058,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"semver@npm:^7.5.4":
+  version: 7.5.4
+  resolution: "semver@npm:7.5.4"
+  dependencies:
+    lru-cache: ^6.0.0
+  bin:
+    semver: bin/semver.js
+  checksum: 12d8ad952fa353b0995bf180cdac205a4068b759a140e5d3c608317098b3575ac2f1e09182206bf2eb26120e1c0ed8fb92c48c592f6099680de56bb071423ca3
+  languageName: node
+  linkType: hard
+
 "send@npm:0.18.0":
   version: 0.18.0
   resolution: "send@npm:0.18.0"