okTurtles / group-income

A decentralized and private (end-to-end encrypted) financial safety net for you and your friends.
https://groupincome.org
GNU Affero General Public License v3.0
331 stars 44 forks source link

Problem dismissing modals in the wrong order #2193

Closed taoeffect closed 4 months ago

taoeffect commented 4 months ago

Problem

https://github.com/user-attachments/assets/98a97269-1cd7-4368-abe0-d681d0fd7efc

A recent PR updated how the modal system works. Here's an example of a problem that still exists. You can reproduce this with the following steps:

  1. Run grunt dev and create a group
  2. Visit the dashboard
  3. Stop grunt dev
  4. Run grunt dev again and wait for the server to be fully running
  5. Refresh the page you had open

Solution

Find and fix the problem, making sure to test thoroughly the existing modals in the group, especially any modals-in-modals, e.g. when the group settings or user settings are up and then a modal is brought up inside of one of those.

In this situation the modal at the top should be dismissed first.

dotmacro commented 4 months ago

2144 is an issue that occurs when two modals are open, so there may be some overlap in solution/testing

SebinSong commented 4 months ago

@taoeffect @dotmacro I'm investigating this issue right now. Normally the modal that is queried later does show on top of the existing one but it's not the case for Prompt.vue due to its z-index set to $zindex_modal + 5. (e.g. LoginModal has been queried after Prompt but Prompt is still placed on the top. But closeModal method in Modal.vue is still working based on the assumption that latest one -> placed on the top.)

This value is actually not incorrect because sometimes the error prompt needs to be shown for the error occurred within another modal e.g.) UserSettings.vue, Group-creation steps modal etc.

The possible solution here will be making it possible to send a target modal name to closeModal method. e.g.) sbp('okTurtles.events/emit', CLOSE_MODAL,'Prompt'). I will send a PR once this work is done and verified.