From 219526e3a2eb39e3e163bbdc45a13df44db7334b Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon.vieille@trinaps.com>
Date: Thu, 2 Mar 2023 19:10:08 +0100
Subject: [PATCH] allow webp image in filemanager

---
 src/core/DependencyInjection/Configuration.php              | 1 +
 .../assets/js/components/file-manager/FileIcon.vue          | 4 ++--
 src/core/Resources/views/file_manager/info.html.twig        | 4 ++--
 .../Resources/views/form/bootstrap_4_form_theme.html.twig   | 6 +++---
 4 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/core/DependencyInjection/Configuration.php b/src/core/DependencyInjection/Configuration.php
index 6999049..e007c9c 100644
--- a/src/core/DependencyInjection/Configuration.php
+++ b/src/core/DependencyInjection/Configuration.php
@@ -15,6 +15,7 @@ class Configuration implements ConfigurationInterface
             'image/jpeg',
             'image/gif',
             'image/svg+xml',
+            'image/webp',
             'video/mp4',
             'audio/mpeg3',
             'audio/x-mpeg-3',
diff --git a/src/core/Resources/assets/js/components/file-manager/FileIcon.vue b/src/core/Resources/assets/js/components/file-manager/FileIcon.vue
index 7854860..c04c6c5 100644
--- a/src/core/Resources/assets/js/components/file-manager/FileIcon.vue
+++ b/src/core/Resources/assets/js/components/file-manager/FileIcon.vue
@@ -19,7 +19,7 @@ Routing.setRoutingData(routes)
 
 const map = {
   'fa fa-file-pdf': ['application/pdf'],
-  'fa fa-file-image': ['image/png', 'image/jpg', 'image/jpeg', 'image/gif'],
+  'fa fa-file-image': ['image/png', 'image/jpg', 'image/jpeg', 'image/gif', 'image/webp'],
   'fa fa-file-audio': ['application/ogg', 'audio/mp3', 'audio/mpeg', 'audio/wav'],
   'fa fa-file-archive': ['application/zip', 'multipart/x-zip', 'application/rar', 'application/x-rar-compressed', 'application/x-zip-compressed', 'application/tar', 'application/x-tar'],
   'fa fa-file-alt': ['application/rtf'],
@@ -53,7 +53,7 @@ export default {
         return
       }
 
-      if (['image/png', 'image/jpg', 'image/jpeg', 'image/gif'].indexOf(this.mime) === -1) {
+      if (['image/png', 'image/jpg', 'image/jpeg', 'image/gif', 'image/webp'].indexOf(this.mime) === -1) {
         this.thumbnail = null
         return
       }
diff --git a/src/core/Resources/views/file_manager/info.html.twig b/src/core/Resources/views/file_manager/info.html.twig
index eefadfe..33a10a4 100644
--- a/src/core/Resources/views/file_manager/info.html.twig
+++ b/src/core/Resources/views/file_manager/info.html.twig
@@ -26,7 +26,7 @@
                     </li>
                 {% endif %}
 
-                {% if splInfo.extension|lower in ['jpeg', 'jpg', 'gif', 'png', 'svg'] %}
+                {% if splInfo.extension|lower in ['jpeg', 'jpg', 'gif', 'png', 'svg', 'webp'] %}
                     <li class="nav-item" role="presentation">
                         <a class="nav-link {% if tab == 'preview' %}active{% endif %}" data-toggle="tab" href="#tab-fm-preview">
                             {{ 'Preview'|trans }}
@@ -117,7 +117,7 @@
                     </div>
                 {% endif %}
 
-                {% if splInfo.extension|lower in ['jpeg', 'jpg', 'gif', 'png', 'svg'] %}
+                {% if splInfo.extension|lower in ['jpeg', 'jpg', 'gif', 'png', 'svg', 'webp'] %}
                     <div class="tab-pane {% if tab == 'preview' %}show active{% endif %}" id="tab-fm-preview">
                         <div class="card">
                             <div class="card-img-top bg-tiles text-center">
diff --git a/src/core/Resources/views/form/bootstrap_4_form_theme.html.twig b/src/core/Resources/views/form/bootstrap_4_form_theme.html.twig
index 976ba6d..6d13df6 100644
--- a/src/core/Resources/views/form/bootstrap_4_form_theme.html.twig
+++ b/src/core/Resources/views/form/bootstrap_4_form_theme.html.twig
@@ -19,7 +19,7 @@
             {% endif %}
 
             {% if value %}
-                {% if fileType in ['auto', 'image'] and value.extension in ['jpeg', 'jpg', 'gif', 'png', 'svg'] %}
+                {% if fileType in ['auto', 'image'] and value.extension in ['jpeg', 'jpg', 'gif', 'png', 'svg', 'webp'] %}
                     <div class="card">
                         <div class="card-img-top bg-tiles text-center">
                             <a href="{{ asset(value.pathname) }}" target="_blank">
@@ -138,14 +138,14 @@
 
         <div class="card">
             {% if value %}
-                {% if value.extension is defined and value.extension in ['jpeg', 'jpg', 'gif', 'png', 'svg'] %}
+                {% if value.extension is defined and value.extension in ['jpeg', 'jpg', 'gif', 'png', 'svg', 'webp'] %}
                     <div class="card-img-top bg-tiles text-center">
                         <a href="{{ asset(value.pathname) }}" target="_blank">
                             <img src="{{ asset(value.pathname) }}" class="img-fluid">
                         </a>
                     </div>
                 {% else %}
-                    {% for extension in ['.jpeg', '.jpg', '.gif', '.png', '.svg'] %}
+                    {% for extension in ['.jpeg', '.jpg', '.gif', '.png', '.svg', '.webp'] %}
                         {% if value ends with extension %}
                             <div class="card-img-top bg-tiles text-center">
                                 <a href="{{ asset(value) }}" target="_blank">