[STSMACOM-613] Resizable Panes - Persistence | Use PersistedPaneset smart component. Created: 22/Mar/21  Updated: 17/Dec/21  Resolved: 17/Dec/21

Status: Closed
Project: stripes-smart-components
Components: None
Affects versions: None
Fix versions: 7.1.0

Type: Story Priority: P2
Reporter: Charlotte Whitt Assignee: Matt Connolly
Resolution: Done Votes: 0
Labels: delegate_candidate, ui-only
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original estimate: Not Specified

Attachments: PNG File Skärmavbild 2021-12-17 kl. 5.10.11 em.png     PNG File Skärmavbild 2021-12-17 kl. 5.10.45 em.png     PNG File Skärmavbild 2021-12-17 kl. 5.12.29 em.png     PNG File Skärmavbild 2021-12-17 kl. 5.13.10 em.png    
Issue links:
Cloners
clones FOLIO-3088 CLONE - Resizable Panes - Persistence... Open
Sprint: Prokopovych - Sprint 128, Prokopovych - Sprint 129
Story Points: 3
Development Team: Prokopovych
Tester Assignee: Charlotte Whitt

 Description   

Requirement: Update Resizable panes to support session/local storage persistence. See below documentation

Acceptance criteria
Given I am on the Inventory app
AND I resize the second or third pane
AND I go to another app
When I return to the Inventory app
Then resize should persists based on session and/or local storage

Technical documentation:
we’ve added a new component, <PersistedPaneset> to stripes-smart-components: https://github.com/folio-org/stripes-smart-components/tree/master/lib/PersistedPaneset
you’re already using <Paneset> in your apps, to which @j.coburn recently added the ability to resize Panes (scroll up). PersistedPaneset saves the current pane widths to the user’s localStorage so if you resize a pane, close the window, and then bring up folio again, the panes will be the same width.
to use PersistedPaneset

What about the search-and-filters pane?
while working on this, I realized i could use the same technique to persist the visibility of the filters pane. that is, if a user has hidden them and they refresh, the filters pane will remain hidden. so i’ve now done that in the Agreements and Licenses apps as well.
i don’t have as concise a commit diff to show as an example, but the key parts are here: https://github.com/folio-org/ui-agreements/blob/v6.0.0/src/components/views/Agreements.js#L75-L81
there, we’re using the @rehooks/local-storage package to give us a local storage hook that we use to read/set the visibility. note the filterPaneVisibilityKey that namespaces the local storage to this app. NB: you should never use an un-namespaced key into local storage since you share it with all folio apps in existence now and in the future, including ones you may not know of that were developed independently at some random library/university.



 Comments   
Comment by Charlotte Whitt [ 22/Mar/21 ]

Hi Khalilah Gambrell - will this work also solve bug ticket: UIIN-1405 Closed - The resizable pane does not resize when using drag?

CC: Zak Burke Michal Kuklis

Comment by Matt Connolly [ 17/Nov/21 ]

Charlotte Whitt I believe this would require making the described changes in <SearchAndSort>, where the top-level <PaneSet> and panes are defined, which would affect all apps that use <SearchAndSort>. Is that something we want to do? cc Zak Burke Michal Kuklis

Comment by Michal Kuklis [ 19/Nov/21 ]

Matt Connolly that sounds like a nice feature to me. Should this be moved to stripes-smart-components?

Comment by Oleksiy_Lemeshko [ 22/Nov/21 ]

Khalilah Gambrell hi, can you please advise if resize action should persist in all UI apps?

Comment by Khalilah Gambrell [ 22/Nov/21 ]

Hey Oleksiy_Lemeshko. We should discuss the impact with John Coburn because I assume there is a reason why we did not apply at the top-level originally. Plus several apps have already implemented this behavior. What happens to those apps?

Comment by Matt Connolly [ 24/Nov/21 ]

John Coburn what do you think?

Comment by Khalilah Gambrell [ 29/Nov/21 ]

Hey Matt Connolly, we discussed this last week and we think it might be best for you to review why Mark D. did not implement at the top-level. Can you review the links in the story to see if Mark left a reason why?

Comment by Matt Connolly [ 29/Nov/21 ]

Khalilah Gambrell I have taken a look, but I haven't found any documented answers. I did note that seemingly none of the apps that have Jira issues to implement <PersistedPaneset> make use of <SearchAndSort> (with the exception of this one for ui-inventory), so it may be as simple as that – that this is the first app where we have to do the work in a shared component.

Comment by Khalilah Gambrell [ 01/Dec/21 ]

Matt Connolly, you are probably correct. I think it is fine to proceed. Is it possible to get a list of the apps that still use <SearchandSort>? We need to give applicable app teams advanced notice.

Comment by Matt Connolly [ 02/Dec/21 ]

Khalilah Gambrell The list I came up with by searching across GitHub is as follows:

ui-data-import

ui-audit

ui-search

ui-vendors

ui-users

ui-inventory

ui-requests

 

I am moving this issue from ui-inventory to stripes-smart components.

Comment by Khalilah Gambrell [ 02/Dec/21 ]

Hey Ann-Marie Breaux and Dennis Bridges, Matt will be updating the above ui-modules with persistent pane support.

Comment by Dennis Bridges [ 03/Dec/21 ]

Khalilah Gambrell ui-vendors has been deprecated as it was replaced by ui-organizations. It probably isn't necessary to update it. Thanks! Matt Connolly

Comment by Charlotte Whitt [ 17/Dec/21 ]

Manual test in FOLIO Snapshot.

All works excellent Matt Connolly - I tested going forth and back between apps, and also adding new holdings, and then return to the resized view. I'm very pleased. I'll close the ticket. 

 

 

 

 

 

 

Generated at Thu Feb 08 23:25:31 UTC 2024 using Jira 1001.0.0-SNAPSHOT#100246-sha1:7a5c50119eb0633d306e14180817ddef5e80c75d.