NEXT-27720 - Fix missing user avatar media

fixes #3678
shopware · May 6, 2024 · 3b8b2f6 · 3b8b2f6
1 parent 0bb4fb9
commit 3b8b2f6
Show file tree

Hide file tree

Showing 8 changed files with 84 additions and 8 deletions.
diff --git a/changelog/_unreleased/2024-04-22-fix-missing-user-avatar-media.md b/changelog/_unreleased/2024-04-22-fix-missing-user-avatar-media.md
@@ -0,0 +1,15 @@
+---
+title: Fix missing user avatar media
+issue: NEXT-00000
+author: Benjamin Wittwer
+author_email: dev@a-k-f.de
+author_github: akf-bw
+---
+# Core
+* Changed `UserController` to add the missing `avatarMedia` association
+___
+# Administration
+* Changed `sw-profile-index` to load the missing user avatar on page load
+* Changed `sw-users-permissions-user-listing` to add the missing `avatarMedia` association
+* Changed `sw-users-permissions-user-detail` to load the missing user avatar on page load & provide media modal methods
+* Changed `sw-users-permissions-user-detail` twig template to include media modal content
diff --git a/...tration/Resources/app/administration/src/module/sw-profile/page/sw-profile-index/index.js b/...tration/Resources/app/administration/src/module/sw-profile/page/sw-profile-index/index.js
@@ -177,6 +177,10 @@ export default {
         beforeMountComponent() {
             this.userPromise.then((user) => {
                 this.user = user;
+
+                if (this.user.avatarId) {
+                    this.loadMediaItem(this.user.avatarId);
+                }
             });
         },
 
@@ -350,11 +354,15 @@ export default {
             });
         },
 
-        setMediaItem({ targetId }) {
-            this.mediaRepository.get(targetId).then((response) => {
-                this.avatarMediaItem = response;
+        loadMediaItem(targetId) {
+            this.mediaRepository.get(targetId).then((media) => {
+                this.avatarMediaItem = media;
             });
+        },
+
+        setMediaItem({ targetId }) {
             this.user.avatarId = targetId;
+            this.loadMediaItem(targetId);
         },
 
         onDropMedia(mediaItem) {

diff --git a/...ion/src/module/sw-users-permissions/components/sw-users-permissions-user-listing/index.js b/...ion/src/module/sw-users-permissions/components/sw-users-permissions-user-listing/index.js
@@ -65,6 +65,7 @@ export default {
             }
 
             criteria.addAssociation('aclRoles');
+            criteria.addAssociation('avatarMedia');
 
             return criteria;
         },

diff --git a/...ermissions/page/sw-users-permissions-user-create/sw-users-permissions-user-create.spec.js b/...ermissions/page/sw-users-permissions-user-create/sw-users-permissions-user-create.spec.js
@@ -23,6 +23,9 @@ async function createWrapper(privileges = []) {
                 userService: {
                     getUser: () => Promise.resolve({ data: {} }),
                 },
+                mediaDefaultFolderService: {
+                    getDefaultFolderId: (folder) => Promise.resolve(folder),
+                },
                 userValidationService: {},
                 integrationService: {},
                 repositoryFactory: {

diff --git a/...nistration/src/module/sw-users-permissions/page/sw-users-permissions-user-detail/index.js b/...nistration/src/module/sw-users-permissions/page/sw-users-permissions-user-detail/index.js
@@ -17,6 +17,7 @@ export default {
     inject: [
         'userService',
         'loginService',
+        'mediaDefaultFolderService',
         'userValidationService',
         'integrationService',
         'repositoryFactory',
@@ -59,6 +60,8 @@ export default {
             skeletonItemAmount: 3,
             confirmPasswordModal: false,
             timezoneOptions: [],
+            mediaDefaultFolderId: null,
+            showMediaModal: false,
         };
     },
 
@@ -208,6 +211,14 @@ export default {
                 return;
             }
 
+            this.getMediaDefaultFolderId()
+                .then((id) => {
+                    this.mediaDefaultFolderId = id;
+                })
+                .catch(() => {
+                    this.mediaDefaultFolderId = null;
+                });
+
             this.timezoneOptions = Shopware.Service('timezoneService').getTimezoneOptions();
             const languagePromise = new Promise((resolve) => {
                 Shopware.State.commit('context/setApiLanguageId', this.languageId);
@@ -245,7 +256,7 @@ export default {
                 this.user = user;
 
                 if (this.user.avatarId) {
-                    this.mediaItem = this.user.avatarMedia;
+                    this.loadMediaItem(this.user.avatarId);
                 }
 
                 this.keyRepository = this.repositoryFactory.create(user.accessKeys.entity, this.user.accessKeys.source);
@@ -303,20 +314,42 @@ export default {
             });
         },
 
-        setMediaItem({ targetId }) {
+        loadMediaItem(targetId) {
             this.mediaRepository.get(targetId).then((media) => {
                 this.mediaItem = media;
                 this.user.avatarMedia = media;
-                this.user.avatarId = targetId;
             });
         },
 
+        setMediaItem({ targetId }) {
+            this.user.avatarId = targetId;
+            this.loadMediaItem(targetId);
+        },
+
         onUnlinkLogo() {
             this.mediaItem = null;
             this.user.avatarMedia = null;
             this.user.avatarId = null;
         },
 
+        onDropMedia(mediaItem) {
+            this.setMediaItem({ targetId: mediaItem.id });
+        },
+
+        onOpenMedia() {
+            this.showMediaModal = true;
+        },
+
+        onMediaSelectionChange([mediaEntity]) {
+            this.mediaItem = mediaEntity;
+            this.user.avatarMedia = mediaEntity;
+            this.user.avatarId = mediaEntity.id;
+        },
+
+        getMediaDefaultFolderId() {
+            return this.mediaDefaultFolderService.getDefaultFolderId('user');
+        },
+
         onSearch(value) {
             this.term = value;
             this.clearSelection();

diff --git a/...missions/page/sw-users-permissions-user-detail/sw-users-permissions-user-detail.html.twig b/...missions/page/sw-users-permissions-user-detail/sw-users-permissions-user-detail.html.twig
@@ -135,8 +135,9 @@
                             :allow-multi-select="false"
                             :source-context="user"
                             :disabled="!acl.can('users_and_permissions.editor')"
-                            variant="regular"
                             default-folder="user"
+                            @media-drop="onDropMedia"
+                            @media-upload-sidebar-open="onOpenMedia"
                             @media-upload-remove-image="onUnlinkLogo"
                         />
                         {% endblock %}
@@ -325,6 +326,18 @@
             {% endblock %}
         </sw-card-view>
 
+        <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
+        {% block sw_settings_user_detail_grid_inner_slot_media_modal %}
+        <sw-media-modal-v2
+            v-if="showMediaModal"
+            :allow-multi-select="false"
+            :initial-folder-id="mediaDefaultFolderId"
+            entity-context="user"
+            @modal-close="showMediaModal = false"
+            @media-modal-selection-change="onMediaSelectionChange"
+        />
+        {% endblock %}
+
         <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
         {% block sw_settings_user_detail_grid_inner_slot_delete_modal %}
         <sw-modal

diff --git a/...ermissions/page/sw-users-permissions-user-detail/sw-users-permissions-user-detail.spec.js b/...ermissions/page/sw-users-permissions-user-detail/sw-users-permissions-user-detail.spec.js
@@ -45,6 +45,9 @@ async function createWrapper(privileges = [], options = {
                 userService: {
                     getUser: () => Promise.resolve({ data: {} }),
                 },
+                mediaDefaultFolderService: {
+                    getDefaultFolderId: (folder) => Promise.resolve(folder),
+                },
                 userValidationService: {},
                 integrationService: {},
                 repositoryFactory: {

diff --git a/src/Core/Framework/Api/Controller/UserController.php b/src/Core/Framework/Api/Controller/UserController.php
@@ -53,7 +53,7 @@ public function me(Context $context, Request $request, ResponseFactoryInterface
             throw new ExpectedUserHttpException();
         }
         $criteria = new Criteria([$userId]);
-        $criteria->addAssociation('aclRoles');
+        $criteria->addAssociations(['aclRoles', 'avatarMedia']);
 
         $user = $this->userRepository->search($criteria, $context)->first();
         if (!$user) {