diff --git a/src/components/PhotoSwipe/PhotoSwipe.tsx b/src/components/PhotoSwipe/PhotoSwipe.tsx
index 92a455e7a..96b2e5b13 100644
--- a/src/components/PhotoSwipe/PhotoSwipe.tsx
+++ b/src/components/PhotoSwipe/PhotoSwipe.tsx
@@ -26,6 +26,7 @@ import {
     changeFileName,
     downloadFile,
     formatDateTime,
+    splitFilenameAndExtension,
     updateExistingFilePubMetadata,
 } from 'utils/file';
 import { Col, Form, FormCheck, FormControl } from 'react-bootstrap';
@@ -293,10 +294,8 @@ function RenderFileName({
 }) {
     const originalTitle = file?.metadata.title;
     const [isInEditMode, setIsInEditMode] = useState(false);
-    const [originalFileName, extension] = originalTitle?.split('.', 2) ?? [
-        undefined,
-        undefined,
-    ];
+    const [originalFileName, extension] =
+        splitFilenameAndExtension(originalTitle);
     const [filename, setFilename] = useState(originalFileName);
     const openEditMode = () => setIsInEditMode(true);
     const closeEditMode = () => setIsInEditMode(false);
diff --git a/src/utils/file/index.ts b/src/utils/file/index.ts
index 221fda554..5ea88f252 100644
--- a/src/utils/file/index.ts
+++ b/src/utils/file/index.ts
@@ -240,6 +240,16 @@ export function fileExtensionWithDot(filename) {
     else return filename.substr(lastDotPosition);
 }
 
+export function splitFilenameAndExtension(filename): [string, string] {
+    const lastDotPosition = filename.lastIndexOf('.');
+    if (lastDotPosition === -1) return [filename, null];
+    else
+        return [
+            filename.substr(0, lastDotPosition),
+            filename.substr(lastDotPosition + 1),
+        ];
+}
+
 export function generateStreamFromArrayBuffer(data: Uint8Array) {
     return new ReadableStream({
         async start(controller: ReadableStreamDefaultController) {