From 49fd2ae326dce09b12fe8303965e5346e5fbf28c Mon Sep 17 00:00:00 2001
From: mkslofstra <mariska-karina@hotmail.com>
Date: Tue, 22 Oct 2024 11:25:38 +0200
Subject: [PATCH] fix: #811 correct typing on diskspace and check for NaN

---
 ui/src/App.vue                      |  6 +++---
 ui/src/api/api.ts                   |  4 ++--
 ui/src/helpers/utils.ts             |  4 ++--
 ui/tests/unit/helpers/utils.spec.ts | 10 ++++++++++
 4 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/ui/src/App.vue b/ui/src/App.vue
index 26a3b792e..f4f4e31a1 100644
--- a/ui/src/App.vue
+++ b/ui/src/App.vue
@@ -39,7 +39,7 @@ import { defineComponent, onMounted, ref, Ref } from "vue";
 import { getPrincipal, getVersion, logout, getFreeDiskSpace, getPermissions } from "@/api/api";
 import { useRouter } from "vue-router";
 import { ApiError } from "@/helpers/errors";
-import { diskSpaceBelowThreshold, convertBytes } from "@/helpers/utils";
+import { diskSpaceBelowThreshold, convertBytes, isEmpty } from "@/helpers/utils";
 
 export default defineComponent({
   name: "ArmadilloPortal",
@@ -55,7 +55,7 @@ export default defineComponent({
     const username: Ref<string> = ref("");
     const version: Ref<string> = ref("");
     const router = useRouter();
-    const diskSpace: Ref<string> = ref("");
+    const diskSpace: Ref<number> = ref(NaN);
 
     onMounted(() => {
       loadUser();
@@ -121,7 +121,7 @@ export default defineComponent({
     },
     diskSpaceMessage() {
       return `Disk space low (${
-        this.diskSpace === "" ? "" : convertBytes(this.diskSpace)
+        isEmpty(this.diskSpace) ? "" : convertBytes(this.diskSpace)
       } remaining). Saving workspaces may not be possible and users risk losing workspace data. Either allocate more space or remove saved workspaces.`;
     },
   },
diff --git a/ui/src/api/api.ts b/ui/src/api/api.ts
index 629472648..47a6868e2 100644
--- a/ui/src/api/api.ts
+++ b/ui/src/api/api.ts
@@ -323,8 +323,8 @@ export async function createLinkFile(
   return postJson(`/storage/projects/${viewProject}/objects/link`, data);
 }
 
-export async function getFreeDiskSpace() {
+export async function getFreeDiskSpace(): Promise<number> {
   return get("/actuator/metrics/disk.free").then((data) => {
-    return data.measurements[0].value;
+    return Number(data.measurements[0].value);
   });
 }
diff --git a/ui/src/helpers/utils.ts b/ui/src/helpers/utils.ts
index 9c4278ff2..86a71e011 100644
--- a/ui/src/helpers/utils.ts
+++ b/ui/src/helpers/utils.ts
@@ -216,12 +216,12 @@ export function encodeUriComponent(component: string) {
 }
 
 export function diskSpaceBelowThreshold(diskSpace: number): boolean {
-  return diskSpace < 2147483648;
+  return !isEmpty(diskSpace)? diskSpace < 2147483648 : false;
 }
 
 export function isEmpty(variable: any): boolean {
   // function will return true if empty string, empty object or empty array, else false
-  if (variable === undefined || variable === null || variable === '') {
+  if (variable === undefined || variable === null || variable === '' || Number.isNaN(variable)) {
     return true;
   } else if(typeof(variable) === 'object') {
     if (Array.isArray(variable)) {
diff --git a/ui/tests/unit/helpers/utils.spec.ts b/ui/tests/unit/helpers/utils.spec.ts
index e2ac0a9bc..336529657 100644
--- a/ui/tests/unit/helpers/utils.spec.ts
+++ b/ui/tests/unit/helpers/utils.spec.ts
@@ -328,6 +328,11 @@ describe("utils", () => {
       const actual = diskSpaceBelowThreshold(9214748364);
       expect(actual).toEqual(false);
     });
+
+    it("Return false", () => {
+      const actual = diskSpaceBelowThreshold(NaN);
+      expect(actual).toEqual(false);
+    });
   });
 
   describe("isEmpty", () => {
@@ -375,6 +380,11 @@ describe("utils", () => {
       const actual = isEmpty(0);
       expect(actual).toEqual(false);
     });
+
+    it("Returns true when NaN", () => {
+      const actual = isEmpty(NaN);
+      expect(actual).toEqual(true);
+    });
   });
 });