Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: Surface elements (Modals, Contextual Bars) fail to respond when triggered by app submit events #32073

Merged
merged 6 commits into from
Apr 18, 2024

Conversation

AllanPazRibeiro
Copy link
Contributor

@AllanPazRibeiro AllanPazRibeiro commented Mar 26, 2024

Proposed changes (including videos or screenshots)

Purpose:
This PR addresses a specific issue in the app's UI behavior, particularly in the modal and contextual bar interfaces used for updates.

Problem:
Previously, the update modal/contextual bar did not consistently close upon the submission of updates, leading to potential confusion and a disjointed user experience.

Solution:
To resolve this, the PR introduces a refinement in the logic controlling the modal/contextual bar. It now retrieves the interaction type involved in the update process. This enhancement allows the system to accurately determine if and when the modal/contextual bar should close after a submission event.

Issue(s)

Steps to test or reproduce

  1. Install (or create one) an app that updates a modal/contextual
  2. Trigger the action that would update the surface
  3. It should update the surface instead of just closing it

Further comments

Here is an app to test this issue:

test-surface-changes_0.0.1.zip
test-surface-changes_0.0.1-not-compiled.zip

Copy link

changeset-bot bot commented Mar 26, 2024

🦋 Changeset detected

Latest commit: e363e88

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/ui-contexts Major
@rocket.chat/meteor Minor
@rocket.chat/fuselage-ui-kit Major
@rocket.chat/gazzodown Major
@rocket.chat/livechat Patch
@rocket.chat/ui-avatar Major
@rocket.chat/ui-client Major
@rocket.chat/ui-video-conf Major
@rocket.chat/uikit-playground Patch
@rocket.chat/web-ui-registration Major
@rocket.chat/ddp-streamer Patch
@rocket.chat/omnichannel-transcript Patch
@rocket.chat/core-typings Minor
@rocket.chat/rest-typings Minor
@rocket.chat/apps Patch
@rocket.chat/core-services Patch
@rocket.chat/cron Patch
@rocket.chat/model-typings Patch
@rocket.chat/account-service Patch
@rocket.chat/authorization-service 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/models 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

@AllanPazRibeiro AllanPazRibeiro marked this pull request as ready for review March 26, 2024 18:34
@AllanPazRibeiro AllanPazRibeiro requested a review from a team as a code owner March 26, 2024 18:34
Copy link

codecov bot commented Mar 26, 2024

Codecov Report

Attention: Patch coverage is 55.55556% with 16 lines in your changes are missing coverage. Please review.

Project coverage is 55.31%. Comparing base (e90954e) to head (e363e88).

Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff             @@
##           develop   #32073      +/-   ##
===========================================
- Coverage    55.32%   55.31%   -0.01%     
===========================================
  Files         2314     2318       +4     
  Lines        51036    51094      +58     
  Branches     10453    10465      +12     
===========================================
+ Hits         28234    28264      +30     
- Misses       20293    20314      +21     
- Partials      2509     2516       +7     
Flag Coverage Δ
e2e 54.67% <55.55%> (-0.01%) ⬇️
unit 75.30% <ø> (ø)

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

Copy link
Member

@MarcosSpessatto MarcosSpessatto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Asking this, but I'm not sure if it's possible, can we add a UI test to cover this?

.changeset/young-candles-explode.md Outdated Show resolved Hide resolved
apps/meteor/app/ui-message/client/ActionManager.ts Outdated Show resolved Hide resolved
apps/meteor/app/ui-message/client/ActionManager.ts Outdated Show resolved Hide resolved
apps/meteor/client/views/modal/uikit/UiKitModal.tsx Outdated Show resolved Hide resolved
apps/meteor/app/ui-message/client/ActionManager.ts Outdated Show resolved Hide resolved
Copy link
Member

@gabriellsh gabriellsh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Another more general question: You made it so that when the interaction request fails, the modal closes. Is this correct?

If so, how will the user know that the interaction failed? Is there any warning?

apps/meteor/app/ui-message/client/ActionManager.ts Outdated Show resolved Hide resolved
@tassoevan tassoevan marked this pull request as draft March 27, 2024 14:17
@AllanPazRibeiro AllanPazRibeiro marked this pull request as ready for review March 27, 2024 19:39
@AllanPazRibeiro AllanPazRibeiro force-pushed the fix/CORE-138/fixing-the-modal-update-by-app branch from 95c153f to 91ac3f1 Compare March 28, 2024 00:38
@AllanPazRibeiro AllanPazRibeiro marked this pull request as draft March 28, 2024 14:51
@AllanPazRibeiro AllanPazRibeiro force-pushed the fix/CORE-138/fixing-the-modal-update-by-app branch from 91ac3f1 to d7c7487 Compare March 28, 2024 19:10
@tassoevan tassoevan added this to the 6.7 milestone Apr 2, 2024
@tassoevan tassoevan requested review from MarcosSpessatto, gabriellsh and a team April 2, 2024 17:58
@tassoevan tassoevan marked this pull request as ready for review April 2, 2024 17:58
Copy link
Member

@MarcosSpessatto MarcosSpessatto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it be possible to add some UI test to ensure this behavior?

@scuciatto scuciatto removed this from the 6.7 milestone Apr 8, 2024
Copy link
Contributor

dionisio-bot bot commented Apr 8, 2024

Looks like this PR is not ready to merge, because of the following issues:

  • This PR is missing the 'stat: QA assured' label

Please fix the issues and try again

If you have any trouble, please check the PR guidelines

@AllanPazRibeiro
Copy link
Contributor Author

Would it be possible to add some UI test to ensure this behavior?

Maybe, I will need some assistance to add a test in this case, I dont have much knowledge about how to test it, since this needs an app to test it and I don't know how to procced with this test

@KevLehman
Copy link
Contributor

@AllanPazRibeiro maybe you can update the testing app that gets installed when tests are run (at least the API ones, not sure about UI ones, but should be simple to install) to add a modal and check what you did in here 👀

@AllanPazRibeiro AllanPazRibeiro force-pushed the fix/CORE-138/fixing-the-modal-update-by-app branch from 453dd39 to 84bba97 Compare April 8, 2024 20:44
tassoevan
tassoevan previously approved these changes Apr 9, 2024
@AllanPazRibeiro
Copy link
Contributor Author

AllanPazRibeiro commented Apr 10, 2024

Given that I'm encountering specific challenges with app installation through the API (which does not happen within the UI installation), a thorough investigation is necessary to understand the underlying issues. Currently, the application is failing to properly resolve the UI buttons, which requires detailed analysis. Consequently, UI tests will not be included in the current phase. However, I plan to address this in a subsequent PR dedicated to this matter.

Here is the PR for the test app:
RocketChat/Apps.RocketChat.Tester#10

The error:

@rocket.chat/meteor:dsv: W20240410-10:37:34.316(-3)? (STDERR) Error: Failed to call the method  as the app (bc4dd4a1-bf9b-408e-83a4-aba7eba0bf02) lacks the following permissions:
@rocket.chat/meteor:dsv: W20240410-10:37:34.318(-3)? (STDERR) ["ui.registerButtons"]. Declare them in your app.json to fix the issue.
@rocket.chat/meteor:dsv: W20240410-10:37:34.319(-3)? (STDERR) reason: undefined
@rocket.chat/meteor:dsv: W20240410-10:37:34.320(-3)? (STDERR)     at UIActionButtonManager.registerActionButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/managers/UIActionButtonManager.js:13:19)
@rocket.chat/meteor:dsv: W20240410-10:37:34.320(-3)? (STDERR)     at UIExtend.registerButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/accessors/UIExtend.js:10:22)
@rocket.chat/meteor:dsv: W20240410-10:37:34.320(-3)? (STDERR)     at VM2 Wrapper.apply (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/vm2/lib/bridge.js:485:11)
@rocket.chat/meteor:dsv: W20240410-10:37:34.320(-3)? (STDERR)     at G.extendConfiguration (app.js:1:7762)
@rocket.chat/meteor:dsv: W20240410-10:37:34.320(-3)? (STDERR)     at runMicrotasks (<anonymous>)
@rocket.chat/meteor:dsv: W20240410-10:37:34.322(-3)? (STDERR) Error: Failed to call the method  as the app (bc4dd4a1-bf9b-408e-83a4-aba7eba0bf02) lacks the following permissions:
@rocket.chat/meteor:dsv: W20240410-10:37:34.323(-3)? (STDERR) ["ui.registerButtons"]. Declare them in your app.json to fix the issue.
@rocket.chat/meteor:dsv: W20240410-10:37:34.324(-3)? (STDERR) reason: undefined
@rocket.chat/meteor:dsv: W20240410-10:37:34.325(-3)? (STDERR)     at UIActionButtonManager.registerActionButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/managers/UIActionButtonManager.js:13:19)
@rocket.chat/meteor:dsv: W20240410-10:37:34.326(-3)? (STDERR)     at UIExtend.registerButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/accessors/UIExtend.js:10:22)
@rocket.chat/meteor:dsv: W20240410-10:37:34.326(-3)? (STDERR)     at VM2 Wrapper.apply (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/vm2/lib/bridge.js:485:11)
@rocket.chat/meteor:dsv: W20240410-10:37:34.326(-3)? (STDERR)     at G.extendConfiguration (app.js:1:7870)
@rocket.chat/meteor:dsv: W20240410-10:37:34.327(-3)? (STDERR)     at runMicrotasks (<anonymous>)
@rocket.chat/meteor:dsv: W20240410-10:37:34.336(-3)? (STDERR) Error: Failed to call the method  as the app (bc4dd4a1-bf9b-408e-83a4-aba7eba0bf02) lacks the following permissions:
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR) ["ui.registerButtons"]. Declare them in your app.json to fix the issue.
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR) reason: undefined
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR)     at UIActionButtonManager.registerActionButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/managers/UIActionButtonManager.js:13:19)
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR)     at UIExtend.registerButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/accessors/UIExtend.js:10:22)
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR)     at VM2 Wrapper.apply (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/vm2/lib/bridge.js:485:11)
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR)     at G.extendConfiguration (app.js:1:7982)
@rocket.chat/meteor:dsv: W20240410-10:37:34.337(-3)? (STDERR)     at runMicrotasks (<anonymous>)
@rocket.chat/meteor:dsv: W20240410-10:37:34.338(-3)? (STDERR) Error: Failed to call the method  as the app (bc4dd4a1-bf9b-408e-83a4-aba7eba0bf02) lacks the following permissions:
@rocket.chat/meteor:dsv: W20240410-10:37:34.339(-3)? (STDERR) ["ui.registerButtons"]. Declare them in your app.json to fix the issue.
@rocket.chat/meteor:dsv: W20240410-10:37:34.339(-3)? (STDERR) reason: undefined
@rocket.chat/meteor:dsv: W20240410-10:37:34.339(-3)? (STDERR)     at UIActionButtonManager.registerActionButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/managers/UIActionButtonManager.js:13:19)
@rocket.chat/meteor:dsv: W20240410-10:37:34.339(-3)? (STDERR)     at UIExtend.registerButton (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/@rocket.chat/apps-engine/server/accessors/UIExtend.js:10:22)
@rocket.chat/meteor:dsv: W20240410-10:37:34.339(-3)? (STDERR)     at VM2 Wrapper.apply (/Users/allanribeiro/projects/newRocket/Rocket.Chat/apps/meteor/node_modules/vm2/lib/bridge.js:485:11)
@rocket.chat/meteor:dsv: W20240410-10:37:34.340(-3)? (STDERR)     at G.extendConfiguration (app.js:1:8092)
@rocket.chat/meteor:dsv: W20240410-10:37:34.340(-3)? (STDERR)     at runMicrotasks (<anonymous>)

@AllanPazRibeiro AllanPazRibeiro force-pushed the fix/CORE-138/fixing-the-modal-update-by-app branch from 2be13fe to 5bf30a2 Compare April 10, 2024 16:51
Copy link
Member

@gabriellsh gabriellsh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you change the title of this PR to something more descriptive? Otherwise looking good!

Will there be tests?

apps/meteor/client/views/modal/uikit/UiKitModal.tsx Outdated Show resolved Hide resolved
@AllanPazRibeiro
Copy link
Contributor Author

Can you change the title of this PR to something more descriptive? Otherwise looking good!

Will there be tests?

I need to investigate an issue with the app installation via API before adding the tests, so after that I will add the tests (I already have all the cases and the test work, but the app installation isn't) so once the fix is done from the apps engine I will open a pr to test it properly, so for now it requires a manual test.

@milton-rucks milton-rucks added this to the 6.8 milestone Apr 16, 2024
@AllanPazRibeiro AllanPazRibeiro changed the title fix: fixing the surface update by app fix: fixing the surface (modal, contextual bar) changes by apps Apr 17, 2024
@tassoevan tassoevan added the stat: QA assured Means it has been tested and approved by a company insider label Apr 18, 2024
@AllanPazRibeiro AllanPazRibeiro changed the title fix: fixing the surface (modal, contextual bar) changes by apps fix: Surface elements (Modals, Contextual Bars) fail to respond when triggered by app submit events Apr 18, 2024
@jessicaschelly jessicaschelly added stat: QA assured Means it has been tested and approved by a company insider and removed stat: QA assured Means it has been tested and approved by a company insider labels Apr 18, 2024
@gabriellsh gabriellsh added the stat: ready to merge PR tested and approved waiting for merge label Apr 18, 2024
@kodiakhq kodiakhq bot merged commit c0d54d7 into develop Apr 18, 2024
43 checks passed
@kodiakhq kodiakhq bot deleted the fix/CORE-138/fixing-the-modal-update-by-app branch April 18, 2024 19:39
ggazzo pushed a commit that referenced this pull request Apr 20, 2024
…triggered by app submit events (#32073)

Co-authored-by: Tasso Evangelista <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
stat: QA assured Means it has been tested and approved by a company insider stat: ready to merge PR tested and approved waiting for merge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

9 participants