diff --git a/web/apps/photos/src/components/PhotoViewer/index.tsx b/web/apps/photos/src/components/PhotoViewer/index.tsx
index 8e6debf68b..c7383efb13 100644
--- a/web/apps/photos/src/components/PhotoViewer/index.tsx
+++ b/web/apps/photos/src/components/PhotoViewer/index.tsx
@@ -11,11 +11,11 @@ import {
     copyFileToClipboard,
     downloadSingleFile,
     getFileFromURL,
-    isRawFile,
     isSupportedRawFormat,
 } from "utils/file";
 
 import { FILE_TYPE } from "@/media/file-type";
+import { isNonWebImageFileExtension } from "@/media/formats";
 import { lowercaseExtension } from "@/next/file";
 import { FlexWrapper } from "@ente/shared/components/Container";
 import EnteSpinner from "@ente/shared/components/EnteSpinner";
@@ -350,7 +350,8 @@ function PhotoViewer(props: Iprops) {
     function updateShowEditButton(file: EnteFile) {
         const extension = lowercaseExtension(file.metadata.title);
         const isSupported =
-            !isRawFile(extension) || isSupportedRawFormat(extension);
+            !isNonWebImageFileExtension(extension) ||
+            isSupportedRawFormat(extension);
         setShowEditButton(
             file.metadata.fileType === FILE_TYPE.IMAGE && isSupported,
         );
diff --git a/web/apps/photos/src/utils/file/index.ts b/web/apps/photos/src/utils/file/index.ts
index 212b2efd31..862f7b7f23 100644
--- a/web/apps/photos/src/utils/file/index.ts
+++ b/web/apps/photos/src/utils/file/index.ts
@@ -1,4 +1,5 @@
 import { FILE_TYPE } from "@/media/file-type";
+import { isNonWebImageFileExtension } from "@/media/formats";
 import { decodeLivePhoto } from "@/media/live-photo";
 import { lowercaseExtension } from "@/next/file";
 import log from "@/next/log";
@@ -40,20 +41,6 @@ import { isArchivedFile, updateMagicMetadata } from "utils/magicMetadata";
 import { safeFileName } from "utils/native-fs";
 import { writeStream } from "utils/native-stream";
 
-const RAW_FORMATS = [
-    "heic",
-    "rw2",
-    "tiff",
-    "arw",
-    "cr3",
-    "cr2",
-    "raf",
-    "nef",
-    "psd",
-    "dng",
-    "tif",
-];
-
 const SUPPORTED_RAW_FORMATS = [
     "heic",
     "rw2",
@@ -306,9 +293,9 @@ export const getRenderableImage = async (fileName: string, imageBlob: Blob) => {
         );
         const { extension } = fileTypeInfo;
 
-        if (!isRawFile(extension)) {
-            // Either it is not something we know how to handle yet, or
-            // something that the browser already knows how to render.
+        if (!isNonWebImageFileExtension(extension)) {
+            // Either it is something that the browser already knows how to
+            // render, or something we don't even about yet.
             return imageBlob;
         }
 
diff --git a/web/packages/media/formats.ts b/web/packages/media/formats.ts
new file mode 100644
index 0000000000..24d2c7c877
--- /dev/null
+++ b/web/packages/media/formats.ts
@@ -0,0 +1,26 @@
+/**
+ * Image file extensions that we know the browser is unlikely to have native
+ * support for.
+ */
+const nonWebImageFileExtensions = [
+    "heic",
+    "rw2",
+    "tiff",
+    "arw",
+    "cr3",
+    "cr2",
+    "raf",
+    "nef",
+    "psd",
+    "dng",
+    "tif",
+];
+
+/**
+ * Return `true` if {@link extension} is from amongst a known set of image file
+ * extensions that we know that the browser is unlikely to have native support
+ * for. If we want to display such files in the browser, we'll need to convert
+ * them to some other format first.
+ */
+export const isNonWebImageFileExtension = (extension: string) =>
+    nonWebImageFileExtensions.includes(extension.toLowerCase());