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 = ref(""); const version: Ref = ref(""); const router = useRouter(); - const diskSpace: Ref = ref(""); + const diskSpace: Ref = 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 { 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); + }); }); });