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

Extract issues link from sidebar #872

Closed
joseivanlopez opened this issue Nov 15, 2023 · 3 comments · Fixed by #886
Closed

Extract issues link from sidebar #872

joseivanlopez opened this issue Nov 15, 2023 · 3 comments · Fixed by #886
Assignees
Labels
enhancement New feature or request

Comments

@joseivanlopez
Copy link
Contributor

We have agreed to use the sidebar for actions related to the installer itself (e.g., diagnosis tools, display lang, etc). Everything related to the target system to install should not be placed in the siderbar.

The only thing related to the target system still present in the sidebar is the issues link. The issues should be globally accessible from another place (footer, header, ...).

@joseivanlopez joseivanlopez added the enhancement New feature or request label Nov 15, 2023
@dgdavid
Copy link
Contributor

dgdavid commented Nov 15, 2023

You were faster than me :) I was redacting the issue for exactly the same, after a morning meeting with @imobachgs for reviewing pending stuff in the Agama UI and generating some detailed issues.

What is more, I was thinking on @balsa-asanovic for this one, as I got the impression he wanted to continue contributing. But, of course, it's just a suggestion.

In any case, I'll add my view as a comment here as soon as I finish it.

@balsa-asanovic
Copy link
Contributor

What is more, I was thinking on @balsa-asanovic for this one, as I got the impression he wanted to continue contributing. But, of course, it's just a suggestion.

Agreed. 👍

Also, if there are some other issues you think I could help with, feel free to suggest those as well.

@dgdavid
Copy link
Contributor

dgdavid commented Nov 15, 2023

We have agreed to use the sidebar for actions related to the installer itself (e.g., diagnosis tools, display lang, etc). Everything related to the target system to install should not be placed in the siderbar.

The only thing related to the target system still present in the sidebar is the issues link. The issues should be globally accessible from another place (footer, header, ...).

Exactly, the progression of Agama's UI somehow has relegated the Sidebar to an area for holding stuff related to Agama itself and the main area for everything related to the system that will be installed.

This means that we should remove the "Show issues" link as it links to a page that shows issues related to the target system rather than the installer. In addition, currently this links takes to a dedicated "Issues page" that allows navigating back to where the user was. However, using a popup issues could be displayed anywhere the users are, remaining them in the same place after closing such a dialog without navigating back and forward.

This solution has another advantage: we would be able to remove the popover to display the errors found in each section on the overview page, which we were not entirely satisfied with.

With all of the above in mind, the tasks would be

  • Convert the IssuesPage to a popup dialog

  • Drop IssuesLink from the Sidebar (currently mounted in App.jsx)

  • Put an icon button on the header, close to the hamburger menu, to open the Issues dialog.

    • For now, mount it in the Sidebar, inside AppActions slot. This is going to change, but it's the simplest approach to have the behavior working as expected.

    • Use the warning icon, although other suggestions are of course welcome.

    • Display it only if there are issues.

  • Stop using the NotificationMark. The new warning button in the header will be enough for letting the user know that there are issues.

  • Drop the NotificationMark code.

  • Stop using the Popover in the core/ValidationErrors component. Instead, allows the "% errors found" button to open the Issues dialog. Ideally, it should scroll to the corresponding section and highlight it. In the meantime, scrolling is a good starting point, since we still need to determine how to highlight it. Think that each section in the Issues dialog should have a predictable id (which makes me remind Define when should we use the `id` attribute. #811 (comment)) to be used as an anchor. We can talk about it when developing the feature.

The above should be more than enough for a complete PR. Please, don't hesitate to ask as much as needed.

dgdavid added a commit that referenced this issue Jan 8, 2024
## Problem

"We have agreed to use the sidebar for actions related to the installer
itself (e.g., diagnosis tools, display lang, etc). Everything related to
the target system to install should not be placed in the siderbar.

The only thing related to the target system still present in the sidebar
is the issues link. The issues should be globally accessible from
another place (footer, header, ...)."

As described in #872 

This PR fixes #872 

## Solution

Issues page link is removed from the sidebar and all other places where
it was present.

During the progress of this PR, decision was made to drop the showing of
global (all) issues at once in the popup.

Because of this, the Issues popup (previously a page) can no longer be
accessed from the sidebar (or from the icon in the header, which was an
idea at some point).

The Issues Dialog (popup) now shows issues related only to a single
section (software, product, storage, ...) and is opened by clicking on
the warning link in the sections on the overview page (and a few other
places).

For this reason, the prop id for the Section component was introduced,
so the issues could be filtered to a specific type for the popup based
on from where has the user clicked the warning.

## Testing

-  Tested manually
- Adjusted unit test files to some extent, possibly more work is needed
here.


## Screenshots


![294189450-e2b43bbc-65cb-42bb-aa64-092eb8e2b0f5](https://github.com/openSUSE/agama/assets/112288843/0177753e-c96b-42d4-a10e-7543b570104a)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants