fix: Image gallery moves to older images when clicking on the right arrow button

[matheusbsilva137]

Proposed changes (including videos or screenshots)

• Invert the image gallery's direction so that older images are displayed when clicking on the left arrow button;
• Add e2e tests for the image gallery.

Issue(s)

Steps to test or reproduce

I suggesting using more than 5 images to test so that pagination is applied.

Before:

old-image-gallery.mp4

After:

improved-image-gallery.mp4

Further comments

SUP-419

[changeset-bot]

🦋 Changeset detected

Latest commit: 2a9b750

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 32 packages

Name	Type
@rocket.chat/meteor	Patch
@rocket.chat/core-typings	Patch
@rocket.chat/rest-typings	Patch
@rocket.chat/apps	Patch
@rocket.chat/core-services	Patch
@rocket.chat/cron	Patch
@rocket.chat/fuselage-ui-kit	Patch
@rocket.chat/gazzodown	Patch
@rocket.chat/livechat	Patch
@rocket.chat/model-typings	Patch
@rocket.chat/ui-contexts	Patch
@rocket.chat/account-service	Patch
@rocket.chat/authorization-service	Patch
@rocket.chat/ddp-streamer	Patch
@rocket.chat/omnichannel-transcript	Patch
@rocket.chat/presence-service	Patch
@rocket.chat/queue-worker	Patch
@rocket.chat/stream-hub-service	Patch
@rocket.chat/api-client	Patch
@rocket.chat/license	Patch
@rocket.chat/omnichannel-services	Patch
@rocket.chat/pdf-worker	Patch
@rocket.chat/presence	Patch
rocketchat-services	Patch
@rocket.chat/ddp-client	Patch
@rocket.chat/uikit-playground	Patch
@rocket.chat/models	Patch
@rocket.chat/ui-avatar	Patch
@rocket.chat/ui-client	Patch
@rocket.chat/ui-video-conf	Patch
@rocket.chat/web-ui-registration	Patch
@rocket.chat/instance-status	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 3 lines in your changes missing coverage. Please review.

Project coverage is 56.38%. Comparing base (abebb06) to head (2a9b750).

Additional details and impacted files

@@           Coverage Diff            @@
##           develop   #32106   +/-   ##
========================================
  Coverage    56.37%   56.38%           
========================================
  Files         2437     2433    -4     
  Lines        53770    53724   -46     
  Branches     11082    11075    -7     
========================================
- Hits         30315    30294   -21     
+ Misses       20814    20792   -22     
+ Partials      2641     2638    -3     

Flag	Coverage Δ
e2e	56.07% <0.00%> (+<0.01%)	⬆️
unit	72.21% <ø> (+0.02%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

[dionisio-bot]

Looks like this PR is ready to merge! 🎉
If you have any trouble, please check the PR guidelines

[matheusbsilva137]

FYI I decided to keep the e2e tests serial since the beforeAll process is heavy. It takes more time than the actual tests, so I can't see any real benefits on making the e2e tests parallel in this case
cc @gabriellsh @tiagoevanp

[matheusbsilva137]

The direction: 'rtl' which I had to use to fix animations' direction is causing images to take longer to load for some reason. That's due to an issue on the swiper component (which has been reported here, but it is yet to be fixed)
So I decided to work on another approach (inverting the array instead of using the direction prop) so that we can have animations working properly. Can you please let me know what you think of this new approach? @gabriellsh @MarcosSpessatto

[MarcosSpessatto]

The direction: 'rtl' which I had to use to fix animations' direction is causing images to take longer to load for some reason. That's due to an issue on the swiper component (which has been reported here, but it is yet to be fixed) So I decided to work on another approach (inverting the array instead of using the direction prop) so that we can have animations working properly. Can you please let me know what you think of this new approach? @gabriellsh @MarcosSpessatto

It looks like the issue has been closed and the developers say the bug is not with the lib itself. But since you already provided a solution by reversing the array, LGTM.