Fix handling of filename extensions when there is no extension and incorrectly trying to display preview images for folders.

frontend/src/assets/main.css

@@ -91,8 +91,7 @@
   }
   .headermain,
   .menu,
-  .rename-button,
+  .rename-button {
-  .suggest-gallery {
     display: none !important;
   }
   .breadcrumb > a {

frontend/src/repositories/Document.ts

@@ -37,21 +37,24 @@ export class Doc {
     return this.url.replace(/^\/#/, '')
   }
   get img(): boolean {
-    const ext = this.name.split('.').pop()?.toLowerCase() || ''
+    // Folders cannot be images
-    return ['jpg', 'jpeg', 'png', 'gif', 'webp', 'avif', 'heic', 'heif', 'svg'].includes(ext)
+    if (this.dir) return false
+    return ['jpg', 'jpeg', 'png', 'gif', 'webp', 'avif', 'heic', 'heif', 'svg'].includes(this.ext)
   }
   get previewable(): boolean {
+    // Folders cannot be previewable
+    if (this.dir) return false
     if (this.img) return true
-    const ext = this.name.split('.').pop()?.toLowerCase() || ''
     // Not a comprehensive list, but good enough for now
-    return ['mp4', 'mkv', 'webm', 'ogg', 'mp3', 'flac', 'aac', 'pdf'].includes(ext)
+    return ['mp4', 'mkv', 'webm', 'ogg', 'mp3', 'flac', 'aac', 'pdf'].includes(this.ext)
   }
   get previewurl(): string {
     return this.url.replace(/^\/files/, '/preview')
   }
   get ext(): string {
-    const ext = this.name.split('.').pop()
+    const dotIndex = this.name.lastIndexOf('.')
-    return ext ? ext.toLowerCase() : ''
+    if (dotIndex === -1 || dotIndex === this.name.length - 1) return ''
+    return this.name.slice(dotIndex + 1).toLowerCase()
   }
 }
 export type errorEvent = {

frontend/src/utils/index.ts

@@ -50,12 +50,11 @@ export function formatUnixDate(t: number) {
 }
 
 export function getFileExtension(filename: string) {
-  const parts = filename.split('.')
+  const dotIndex = filename.lastIndexOf('.')
-  if (parts.length > 1) {
+  if (dotIndex === -1 || dotIndex === filename.length - 1) {
-    return parts[parts.length - 1]
+    return '' // No extension
-  } else {
-    return '' // No hay extensión
   }
+  return filename.slice(dotIndex + 1)
 }
 interface FileTypes {
   [key: string]: string[]
@@ -68,8 +67,9 @@ const filetypes: FileTypes = {
 }
 
 export function getFileType(name: string): string {
-  const ext = name.split('.').pop()?.toLowerCase()
+  const dotIndex = name.lastIndexOf('.')
-  if (!ext || ext.length === name.length) return 'unknown'
+  if (dotIndex === -1 || dotIndex === name.length - 1) return 'unknown'
+  const ext = name.slice(dotIndex + 1).toLowerCase()
   return Object.keys(filetypes).find(type => filetypes[type].includes(ext)) || 'unknown'
 }
 

frontend/src/views/ExplorerView.vue

@@ -13,10 +13,6 @@
     :path="props.path"
     :documents="documents"
   />
-  <div v-if="!store.prefs.gallery && documents.some(doc => doc.previewable)" class="suggest-gallery">
-    <SvgButton name="eye" taborder=0 @click="() => { store.prefs.gallery = true }"></SvgButton>
-    Gallery View
-  </div>
   <EmptyFolder :documents=documents :path=props.path />
 </template>
 
@@ -93,15 +89,4 @@ watch(documents, (docs) => {
   text-shadow: 0 0 .3rem #000, 0 0 2rem #0008;
   color: var(--accent-color);
 }
-.suggest-gallery p {
-  font-size: 2rem;
-  color: var(--accent-color);
-}
-.suggest-gallery {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
 </style>