fix: scroll to full chat page - EXO-67772

Before this change, when you open the full chat page and scroll outside the chat area, there is a gray border at the bottom of the chat page and there is a scrolling effect when we scroll outside of the conversation area. To resolve this issue, add the hide-shared-layout property as true in the page.xml file to remove the padding added after the containner chat application and remove the padding-bottom added by the PORTLET-FRAGMENT class. After this change, no more gray border and no more scrolling effect outside the chat area.

application/src/main/webapp/index.html

@@ -1,4 +1,9 @@
 <div class="VuetifyApp">
   <div id="chatApplication">
+    <script>
+      require(['SHARED/chatBundle'], function(chatApp) {
+        chatApp.init();
+      });
+    </script>
   </div>
 </div>

application/src/main/webapp/vue-app/components/ExoChatApp.vue

@@ -172,6 +172,7 @@ export default {
     },
   },
   created() {
+    this.removeClassPortal();
     this.showHidePlatformAdminToolbar();
     chatServices.initChatSettings(this.userSettings.username, false,
       userSettings => {
@@ -431,6 +432,10 @@ export default {
       } else {
         return $('#PlatformAdminToolbarContainer').css('display', 'block') && $('#UITopBarContainerParent').css('display', 'block');
       }
+    },
+    removeClassPortal() {
+      const element = document.getElementsByClassName('chatPage')[0];
+      element?.getElementsByClassName('PORTLET-FRAGMENT')[0]?.removeAttribute('class');
     }
   }
 };

extension/src/main/webapp/WEB-INF/conf/chat/portal/global/pages.xml

@@ -28,6 +28,7 @@
       <access-permissions>*:/platform/users;*:/platform/externals</access-permissions>
       <edit-permission>*:/platform/administrators</edit-permission>
       <show-max-window>true</show-max-window>
+      <hide-shared-layout>true</hide-shared-layout>
       <portlet-application>
          <portlet>
             <application-ref>chat</application-ref>