chore(ui): review - WF-141

src/ui/src/components/shared/SharedImgWithFallback.spec.ts

@@ -13,7 +13,7 @@ describe("SharedImgWithFallback", () => {
 		global.fetch = fetch;
 	});
 
-	it("should use the second image", async () => {
+	it("should use the last image because the first two are not valid", async () => {
 		fetch
 			.mockRejectedValueOnce(new Error())
 			.mockResolvedValueOnce({

src/ui/src/components/shared/SharedImgWithFallback.vue

@@ -21,7 +21,7 @@ watch(
 
 		for (const url of urls) {
 			const contentType = await fetchAssetContentType(url);
-			// ensure that the content type is not HTML (the server can responds with a default page)
+			// ensure that the content type is valid and not HTML (the server can responds with a default HTML page)
 			if (!contentType || contentType === "text/html") continue;
 			return (src.value = url);
 		}

src/ui/src/composables/useAssetContentType.spec.ts

@@ -18,7 +18,7 @@ describe(useAssetContentType.name, () => {
 		fetch.mockRejectedValue(new Error());
 		const { fetchAssetContentType } = useAssetContentType();
 
-		expect(await fetchAssetContentType("https://test.com")).toBe(false);
+		expect(await fetchAssetContentType("https://test.com")).toBeUndefined();
 		expect(fetch).toHaveBeenCalledOnce();
 	});
 

src/ui/src/composables/useAssetContentType.ts

@@ -1,4 +1,4 @@
-const cacheUrlContentType = new Map<string, Promise<boolean | string>>();
+const cacheUrlContentType = new Map<string, Promise<undefined | string>>();
 
 /**
  * Do an HTTP `HEAD` call to get the `Content-Type` of an URL. Handle parrallel calls and use a cache mechanism.
@@ -11,10 +11,10 @@ export function useAssetContentType() {
 		// we store the promise instead of the result to handle concurent calls
 		const promise = fetch(url, { method: "HEAD" })
 			.then((r) => {
-				if (!r.ok) return false;
-				return r.headers.get("Content-Type") ?? false;
+				if (!r.ok) return undefined;
+				return r.headers.get("Content-Type") || undefined;
 			})
-			.catch(() => false);
+			.catch(() => undefined);
 
 		cacheUrlContentType.set(url, promise);