[full-ci] Enhancement: Show text file icon for empty text files

changelog/unreleased/enhancement-show-txt-icon-for-empty-txt-files

@@ -0,0 +1,5 @@
+Enhancement: Show text file icon for empty text files
+
+We've changed the thumbnail of almost empty text files to the regular text icon.
+
+https://github.com/owncloud/web/pull/8057

packages/web-app-files/src/components/FilesList/ResourceTable.vue

@@ -56,7 +56,7 @@
           :resource="item"
           :is-path-displayed="getArePathsDisplayed(item)"
           :parent-folder-name-default="getDefaultParentFolderName(item)"
-          :is-thumbnail-displayed="areThumbnailsDisplayed"
+          :is-thumbnail-displayed="shouldDisplayThumbnails(item)"
           :is-extension-displayed="areFileExtensionsShown"
           :is-resource-clickable="isResourceClickable(item.id)"
           :folder-link="folderLink(item)"
@@ -185,6 +185,7 @@ import Rename from '../../mixins/actions/rename'
 import { defineComponent, PropType } from 'vue'
 import { Resource } from 'web-client'
 import { ClipboardActions } from '../../helpers/clipboardActions'
+import { isResourceTxtFileAlmostEmpty } from '../../helpers/resources'
 import { ShareTypes } from 'web-client/src/helpers/share'
 import { createLocationSpaces, createLocationShares } from '../../router'
 import { formatDateFromJSDate, formatRelativeDateFromJSDate } from 'web-pkg/src/helpers'
@@ -553,6 +554,9 @@ export default defineComponent({
       }
       return this.clipboardResources.some((r) => r.id === resource.id)
     },
+    shouldDisplayThumbnails(item) {
+      return this.areThumbnailsDisplayed && !isResourceTxtFileAlmostEmpty(item)
+    },
     isLatestSelectedItem(item) {
       return item.id === this.latestSelectedId
     },

packages/web-app-files/src/components/Search/Preview.vue

@@ -23,7 +23,8 @@
 import MixinFileActions from '../../mixins/fileActions'
 import { VisibilityObserver } from 'web-pkg/src/observer'
 import { ImageDimension, ImageType } from '../../constants'
-import { loadPreview } from 'web-pkg/src/helpers/preview'
+import { isResourceTxtFileAlmostEmpty } from '../../helpers/resources'
+import { loadPreview } from 'web-pkg/src/helpers'
 import debounce from 'lodash-es/debounce'
 import Vue from 'vue'
 import { mapGetters, mapState } from 'vuex'
@@ -116,7 +117,10 @@ export default defineComponent({
       return this.$gettext('Personal')
     },
     displayThumbnails() {
-      return !this.configuration?.options?.disablePreviews
+      return (
+        !this.configuration?.options?.disablePreviews &&
+        !isResourceTxtFileAlmostEmpty(this.resource)
+      )
     },
     folderLink() {
       return this.createFolderLink(this.resource.path, this.resource.fileId)

packages/web-app-files/src/helpers/resources.ts

@@ -43,6 +43,11 @@ export function attachIndicators(resource, sharesTree) {
   return (resource.indicators = getIndicators(resource, sharesTree))
 }
 
+export function isResourceTxtFileAlmostEmpty(resource: Resource): boolean {
+  const mimeType = resource.mimeType || ''
+  return mimeType.startsWith('text/') && (resource.size as number) < 30
+}
+
 /**
  * Transforms given shares into a resource format and returns only their unique occurences
  * @param {Array} shares Shares to be transformed into unique resources

packages/web-client/tests/unit/helpers/resource/resource.spec.ts

@@ -4,6 +4,7 @@ import {
   extractNameWithoutExtension
 } from '../../../../src/helpers/resource'
 import { Resource } from 'web-client'
+import { isResourceTxtFileAlmostEmpty } from 'web-app-files/src/helpers/resources'
 
 describe('extractDomSelector', () => {
   it.each([
@@ -74,4 +75,26 @@ describe('filterResources', () => {
       expect(extractExtensionFromFile(resource as Resource)).toEqual('')
     })
   })
+  describe('isResourceTxtFileAlmostEmpty', () => {
+    it('return true for resources smaller 30 bytes', () => {
+      expect(isResourceTxtFileAlmostEmpty({ mimeType: 'text/plain', size: 20 } as Resource)).toBe(
+        true
+      )
+    })
+    it('return false for resources larger 30 bytes', () => {
+      expect(isResourceTxtFileAlmostEmpty({ mimeType: 'text/plain', size: 35 } as Resource)).toBe(
+        false
+      )
+    })
+    it('return false for resources that are not text', () => {
+      expect(
+        isResourceTxtFileAlmostEmpty({ mimeType: 'application/json', size: 35 } as Resource)
+      ).toBe(false)
+    })
+    it('return false for resources that have undefined mimeType', () => {
+      expect(isResourceTxtFileAlmostEmpty({ mimeType: undefined, size: 35 } as Resource)).toBe(
+        false
+      )
+    })
+  })
 })