diff --git a/changelog/unreleased/bugfix-load-only-supported-thumbnails b/changelog/unreleased/bugfix-load-only-supported-thumbnails
new file mode 100644
index 00000000000..f0903b6f5eb
--- /dev/null
+++ b/changelog/unreleased/bugfix-load-only-supported-thumbnails
@@ -0,0 +1,6 @@
+Bugfix: Load only supported thumbnails (configurable)
+
+We've fixed a bug where web was trying to load thumbnails for files that are not supported.
+Due to configurable values, we avoid unnecessary requests.
+
+https://github.com/owncloud/web/pull/7474
diff --git a/config/config.json.sample-ocis b/config/config.json.sample-ocis
index 4ec0934d259..f438ea946b1 100644
--- a/config/config.json.sample-ocis
+++ b/config/config.json.sample-ocis
@@ -23,5 +23,13 @@
       "id": "settings",
       "path": "https://localhost:9200/settings.js"
     }
-  ]
+  ],
+  "options" : {
+    "previewFileMimeTypes" : [
+      "image/gif",
+      "image/png",
+      "image/jpeg",
+      "text/plain"
+    ]
+  }
 }
diff --git a/dev/docker/ocis.web.config.json b/dev/docker/ocis.web.config.json
index d564335f617..a1b3b0298c6 100644
--- a/dev/docker/ocis.web.config.json
+++ b/dev/docker/ocis.web.config.json
@@ -16,7 +16,13 @@
       "shares": {
         "showAllOnLoad": true
       }
-    }
+    },
+    "previewFileMimeTypes": [
+      "image/gif",
+      "image/png",
+      "image/jpeg",
+      "text/plain"
+    ]
   },
   "apps": [
     "files",
diff --git a/docs/getting-started.md b/docs/getting-started.md
index 09e7a840bb4..f5eb8c928f2 100644
--- a/docs/getting-started.md
+++ b/docs/getting-started.md
@@ -47,7 +47,7 @@ variables of the user object to come up with a user specific home path. This use
 substring of a value of the authenticated user. Examples are `/Shares`, `/{{.Id}}` and `/{{substr 0 3 .Id}}/{{.Id}`.
 - `options.disablePreviews` Set this option to `true` to disable previews in all the different file listing views. The only list view that is not affected
   by this is the trash bin, as that doesn't allow showing previews at all.
-- `options.previewFileExtensions` Specifies which filetypes will be previewed in the ui. For example to only preview jpg and txt files set this option to `["jpg", "txt"]`.
+- `options.previewFileMimeTypes` Specifies which mimeTypes will be previewed in the ui. For example to only preview jpg and text files set this option to `["image/jpeg", "text/plain"]`.
 - `options.disableFeedbackLink` Set this option to `true` to disable the feedback link in the topbar. Keeping it enabled (value `false` or absence of the option)
   allows ownCloud to get feedback from your user base through a dedicated survey website.
 - `options.feedbackLink` This accepts an object with the following optional fields to customize the feedback link in the topbar:
diff --git a/packages/web-app-files/src/index.js b/packages/web-app-files/src/index.js
index aa4fba86f2b..ae855b0f13a 100644
--- a/packages/web-app-files/src/index.js
+++ b/packages/web-app-files/src/index.js
@@ -136,12 +136,12 @@ export default {
         }
       ])
     )
-    // FIXME: Remove mock data
+    // FIXME: Use capability data only as soon as available
     thumbnailService.initialize(
       get(store, 'getters.capabilities.files.thumbnail', {
         enabled: true,
         version: 'v0.1',
-        supportedMimeTypes: ['image/png', 'image/jpg', 'image/jpeg', 'image/gif', 'text/plain']
+        supportedMimeTypes: store.getters.configuration?.options?.previewFileMimeTypes || []
       })
     )
   }
diff --git a/packages/web-app-files/src/services/thumbnail.ts b/packages/web-app-files/src/services/thumbnail.ts
index aa7b6dcab61..ad495486ecd 100644
--- a/packages/web-app-files/src/services/thumbnail.ts
+++ b/packages/web-app-files/src/services/thumbnail.ts
@@ -21,6 +21,10 @@ export class ThumbnailService {
   }
 
   public isMimetypeSupported(mimeType: string, onlyImages = false) {
+    if (!this.supportedMimeTypes.length) {
+      return true
+    }
+
     const mimeTypes = this.getSupportedMimeTypes(onlyImages ? 'image/' : null)
     return mimeTypes.includes(mimeType)
   }
diff --git a/packages/web-app-files/src/store/actions.ts b/packages/web-app-files/src/store/actions.ts
index ce6fd1e5b0a..2578f97418f 100644
--- a/packages/web-app-files/src/store/actions.ts
+++ b/packages/web-app-files/src/store/actions.ts
@@ -19,6 +19,7 @@ import { ShareTypes } from 'web-client/src/helpers/share'
 import { sortSpaceMembers } from '../helpers/space'
 import get from 'lodash-es/get'
 import { ClipboardActions } from '../helpers/clipboardActions'
+import { thumbnailService } from '../services'
 
 const allowSharePermissions = (getters) => {
   return get(getters, `capabilities.files_sharing.resharing`, true)
@@ -749,10 +750,7 @@ export default {
   },
 
   async loadPreview({ commit, rootGetters }, { resource, isPublic, dimensions, type }) {
-    if (
-      rootGetters.previewFileExtensions.length &&
-      !rootGetters.previewFileExtensions.includes(resource.extension.toLowerCase())
-    ) {
+    if (!thumbnailService.available || !thumbnailService.isMimetypeSupported(resource.mimeType)) {
       return
     }
 
diff --git a/packages/web-runtime/src/store/config.js b/packages/web-runtime/src/store/config.js
index 10cb3e31210..e5c7f29632b 100644
--- a/packages/web-runtime/src/store/config.js
+++ b/packages/web-runtime/src/store/config.js
@@ -52,7 +52,7 @@ const state = {
         showAllOnLoad: false
       }
     },
-    previewFileExtensions: [],
+    previewFileMimeTypes: [],
     runningOnEos: false,
     cernFeatures: false,
     sharingRecipientsPerPage: 200
@@ -110,9 +110,9 @@ const getters = {
   configuration: (state) => {
     return state
   },
-  previewFileExtensions: (state) => {
-    const extensions = state.options.previewFileExtensions
-    return (Array.isArray(extensions) ? extensions : [])
+  previewFileMimeTypes: (state) => {
+    const mimeTypes = state.options.previewFileMimeTypes
+    return (Array.isArray(mimeTypes) ? mimeTypes : [])
       .filter(Boolean)
       .map((ext) => ext.toLowerCase())
   },