Library: Explicitly escape "#" characters in path names #3695

Signed-off-by: Michael Mayer <michael@photoprism.app>

frontend/src/dialog/photo/edit/files.vue

@@ -294,7 +294,10 @@ export default {
       type: Object,
       default: () => {},
     },
-    uid: String,
+    uid: {
+      type: String,
+      default: "",
+    },
   },
   data() {
     return {
@@ -365,8 +368,11 @@ export default {
       }
 
       const name = m.Name;
-      const path = name.substring(0, name.lastIndexOf('/'));
 
+      // "#" chars in path names must be explicitly escaped,
+      // see https://github.com/photoprism/photoprism/issues/3695
+      const path = name.substring(0, name.lastIndexOf('/'))
+        .replaceAll(":", "%3A").replaceAll("#", "%23");
       return this.$router.resolve({ path: '/index/files/' + path }).href;
     },
     downloadFile(file) {

frontend/src/model/folder.js

@@ -145,8 +145,9 @@ export class Folder extends RestModel {
       path = "/" + path;
     }
 
-    // Escape ":" in URL path.
+    // "#" chars in path names must be explicitly escaped,
-    path = path.replaceAll(":", "%3A");
+    // see https://github.com/photoprism/photoprism/issues/3695
+    path = path.replaceAll(":", "%3A").replaceAll("#", "%23");
 
     return Api.get(this.getCollectionResource() + path, options).then((response) => {
       let folders = response.data.folders ? response.data.folders : [];

frontend/src/page/library/browse.vue

@@ -217,7 +217,10 @@ export default {
         // Open Edit Dialog
         Event.publish("dialog.edit", {selection: [model.PhotoUID], album: null, index: 0});
       } else {
-        this.$router.push({path: '/index/files/' + model.Path});
+        // "#" chars in path names must be explicitly escaped,
+        // see https://github.com/photoprism/photoprism/issues/3695
+        const path = model.Path.replaceAll(":", "%3A").replaceAll("#", "%23");
+        this.$router.push({path: '/index/files/' + path});
       }
     },
     downloadFile(index) {