Result list. Hierarchical structure of Instance, Holdings, Items (Refined UX-design)

Purpose: To implement the refined UX design for Inventory in FOLIO. The scope of this story is the result list, which is structured hierarchical, when viewing Instances, with associated holdings and item data. The small icons to to left of the different records type makes the overview of the result page easy to comprehend and support navigation.

Overview: See Filip's video presentation Inventory UX iteration 2, https://discuss.folio.org/t/file-cabinet-inventory-ux-iteration-2-english/1458/4

As a library staff, I want to view my instance records (bib records) associated with holdings and item data.

Scenario

1. Scenario
   • Login to FOLIO, go to the Inventory app
   • Perform a search in the search box in the first pane, which return a search result, e.g. All (title, contributor, identifier) - search on 'arctic'
   • When viewing the Result list in the 2nd pane the Instance record and it's associated holdings record(s) and item record(s) is presented in a hierarchical structure - as shown in 6.png
2. Scenario
   • Given the Search Result list with results,
   • When viewing a given instance record
     • The instance data is displayed in a collapsable accordion
       • The instance data is shown in a 2 lined display
       • First line: Resource title
       • Second line: Publisher, Publication Data, and Resource type
     • The holdings data is displayed in a collapsable accordion
       • The holdings data is displayed intended - see the attached png.
       • The holdings data are following: Location > Call Number
     • The item data are all items listed, each copy on it's separate line
       • The item data are following: Barcode, Item Status, Material type (if different from the Resource Type)
       • NOTE We need UX guidance on, when to shorten this list of items, e.g. if the library have 100
3. Scenario
   • Given the Search Result list with results,
   • When viewing a given instance record
     • To the left of the Instance record is a small icon indicating this is an instance record. On the second line of the Instance record is to the left of the publisher data, an icon for publisher, and also an icon for the given Resource type
       • NOTE: What icons to use for each of the Resource types is a separate jira.
     • To the left of the Holdings record(s) is a small icon indicating this is an holdings record.
     • To the left of the Item record(s) is a smal icon indicating this is an item record.
       • If the Item Status is 'Available' there will be a check mark symbol (✓) to the left
       • If the Item Status is e.g. Checked out, it will be 'Unavailable' and a dash symbol ( - ) is displayed to the left