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

Refactor to load tabs as pages in view licence #953

Merged

Conversation

jonathangoulding
Copy link
Collaborator

@jonathangoulding jonathangoulding commented Apr 29, 2024

https://eaflood.atlassian.net/browse/WATER-4457

The legacy view licence page is built using tabs. The design system makes it very clear that tabs should only be used to allow users to switch between related pieces of information. The example it gives is cases (from a case management system) split over Past day, Past week, Past month and Past year.

They very clearly state

Do not use the tabs component if the total amount of content the tabs contain will make the page slow to load. For this reason, do not use the tabs component as a form of page navigation.

We may not have meant to start out using them in this way. But we’ve ended up there. And because of the issue of performance, we’ve made design decisions based on negating the issue rather than what users need.

For example, we show only the first 10 returns on the Returns tab and then a link to view the full list. This is because the tab component works on the basis that the data for all the tabs is fetched in one go, and the tabs are all generated on the first request. Then HTML magic switches what HTML panel the user sees when they click a tab.

Redesigning the view licence page is beyond the scope of our work to replace the legacy version. But we can take steps to break away from the need to fetch and generate the tabs all in one go.

This change maps the existing view license controller specifically for the view summary tab. We then update the Nunjucks view template to use HTML rather than the Nunjucks version of the tabs component because it only supports anchor tags.

As we flesh out the rest of the tabs we'll applying this same pattern.

@jonathangoulding jonathangoulding changed the title View License page refactor to load pages mapped to controllers when n… View License page refactor to load pages mapped to controllers when navigating by tabs. Apr 29, 2024
@Cruikshanks Cruikshanks added the housekeeping Refactoring, tidying up or other work which supports the project label Apr 29, 2024
…avigating by tabs.

This PR maps the generic controller view license controller to the summary tabs and associated data.

To switch using hrefs instead of anchor tabs the default GDS javascript is turned off and the html used instead of the component (this only supports anchor tags)

https://eaflood.atlassian.net/browse/WATER-4457

Context:

The current view licence page is built using tabs. The design system makes it very clear that tabs should only be used to allow users to switch between related pieces of information. The example it gives is cases (from a case management system) split over Past day, Past week, Past month and Past year.

They very clearly state

Do not use the tabs component if the total amount of content the tabs contain will make the page slow to load. For this reason, do not use the tabs component as a form of page navigation.

We may not have meant to start out using them in this way. But we’ve ended up there. And because of the issue of performance, we’ve made design decisions based on negating the issue rather than what users need.

For example, we show only the first 10 returns on the Returns tab and then a link to view the full list. This is because the tab component works on the basis that the data for all the tabs is fetched in one go, and the tabs are all generated on the first request. Then HTML magic switches what HTML panel the user sees when they click a tab.

Redesigning the view licence page is beyond the scope of the refactoring. But we can take steps to break away from the need to fetch and generate the tabs all in one go.
roles to new html layout
@jonathangoulding jonathangoulding force-pushed the refactor-view-licence-page-to-view-license-summary branch from 35db53a to 883b72c Compare April 30, 2024 09:51
@jonathangoulding jonathangoulding marked this pull request as ready for review April 30, 2024 10:23
@jonathangoulding jonathangoulding marked this pull request as draft April 30, 2024 10:24
@jonathangoulding jonathangoulding marked this pull request as ready for review April 30, 2024 10:48
@Cruikshanks Cruikshanks changed the title View License page refactor to load pages mapped to controllers when navigating by tabs. Refactor to load tabs as pages in view licence Apr 30, 2024
Copy link
Member

@Cruikshanks Cruikshanks left a comment

Choose a reason for hiding this comment

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

@jonathangoulding jonathangoulding merged commit 517fe82 into main Apr 30, 2024
6 checks passed
@jonathangoulding jonathangoulding deleted the refactor-view-licence-page-to-view-license-summary branch April 30, 2024 13:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
housekeeping Refactoring, tidying up or other work which supports the project
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants