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.

Sign up for GitHub

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

Jump to bottom

[BUG]: Items, Quantity, and Location table scrolls horizontally with many residential locations #3776

Closed
2 tasks done
ChaelCodes opened this issue Jul 28, 2023 · 1 comment · Fixed by #3784
Closed
2 tasks done

[BUG]: Items, Quantity, and Location table scrolls horizontally with many residential locations #3776

ChaelCodes opened this issue Jul 28, 2023 · 1 comment · Fixed by #3784
Assignees
@ChaelCodes
Labels
🐞 Bug Ruby for Good 2023 DC Created for Ruby for Good 2023 DC

Comments

@ChaelCodes
Copy link
Contributor

Is there an existing issue for this?

  • I have searched the existing issues

Current Behavior

Some organizations (Sylvia's Sisters) have many residential locations. Their volunteers take materials home in order to create kits. When there are lots of locations, the "Items, Quantity, and Location" table horizontally scrolls which makes it hard to figure out where materials are.

many locations are resulting in horizontal scrolling on the items page - Items, Quantity, and Location table

Expected Behavior

There should be no horizontal scrolling regardless of the number of locations.

Steps To Reproduce

  1. Log in as an org admin - org_admin1@example.com/password!
  2. Create many Locations with long names - /diaper_bank/storage_locations/new
  3. Go to the /diaper-bank/items page
  4. Select the "Items, Quantity, and Location" tab
  5. Scroll past Item Categories to the Items and Locations table
  6. Observe horizontal scrolling -if you do not, add more locations

Environment

- OS: 
- Node:
- npm:

Criteria for Completion

No response

Anything else?

No response

Code of Conduct

  • I've read the Code of Conduct and understand my responsibilities as a member of the Ruby for Good community
@ChaelCodes
Copy link
Contributor Author

ChaelCodes commented Jul 28, 2023 •
edited
Loading

Working on this at Ruby For Good's DC event - reported in partner call. :)

@scooter-dangle scooter-dangle added the Ruby for Good 2023 DC Created for Ruby for Good 2023 DC label Jul 28, 2023
@ChaelCodes ChaelCodes mentioned this issue Jul 29, 2023
Merged
scooter-dangle pushed a commit that referenced this issue Jul 30, 2023
@ChaelCodes
feat: Item Inventory for Banks with many locations (#3784)
14dcb6a 
* Add new table with collapsible locations for banks with many locations

The "Items, Quantity, and Location" table has a nasty horizontal scroll
if the bank has many locations, which can be common for banks that allow
volunteers to take inventory back to their residences to package into
kits. This is very unwieldly for them, but other banks with few
locations have a great scannable view of where their inventory is. We're
reproducing this table with the locations collapsed under a heading for
banks with many locations in a new tab to preserve the experience for
banks with few locations.

ExpandableTable from AdminLTE is being used to handle the expansion.
Location is being stored slightly differently in the query to make it
easier to access.

* Add new styling for expandable tabes to hint that they can be expanded when clicked.

* Location name could be duplicated, so use id to identify the location instead.

Resolves #3776
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ChaelCodes ChaelCodes

Labels
🐞 Bug Ruby for Good 2023 DC Created for Ruby for Good 2023 DC
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Add Item Inventory for Banks with many locations ChaelCodes/human-essentials
2 participants
@scooter-dangle @ChaelCodes