Create and edit Custom Fields list AND create an Input Type = Text box

As a librarian
I want to create/edit a custom field with the input type = text box
So that I can track information that requires a short description

Custom Fields > Get to the Create/Edit Custom Fields List page

• To create: Go to Custom Fields List then click on the New button to create your first custom field
• Pane header title reads New <<Record type>> Custom fields This differs from the screenshot

Custom Fields > Access Edit Custom Fields List page

• To edit: If a custom field exists then click on the Edit button to edit existing custom fields AND to create new ones.
  • Existing custom field accordion(s) are collapsed by default with only the following information visible
  • selected input type as the accordion label
  • Field name label: editable <<Field name value>>
• Pane header title reads Edit <<Record type>> Custom fields This differs from the screenshot

Custom Fields List > Choose an input type

• To create/edit: An add new custom field button opens a input type list
• See requirement https://issues.folio.org/browse/UICFIELDS-9

Custom Fields List > Create an input type = Text box

• Selecting an input type should create new accordion expanded with the selected input type as the Accordion label with settings
• Text box settings
  • Field name: (See requirement https://issues.folio.org/browse/UICFIELDS-4)
  • Required (See requirement https://issues.folio.org/browse/UICFIELDS-7)
  • Help text (See requirement https://issues.folio.org/browse/UICFIELDS-8)
• NOTE: Will address show/hide and field format in other user stories.

Prototype

https://sketch.cloud/s/lw9bd/a/V9MZz8/play (note some designs do not align with the screenshots/notes below. The screenshots/notes below supercede prototype.)

Acceptance Criteria

Given I go to Custom Fields list page
AND no custom field is saved
When I click New
Then display the New Custom Fields page with a button to choose input type = text box

Given I go to the Custom Fields List page
AND a custom field is saved
When I click Edit
Then display the Edit Custom Fields page
AND any existing custom field accordions should be collapsed with
– selected input type as the accordion label
– Field name label: editable <<Field name value>>
AND a button to choose input type = text box

Given I am on the Create/Edit custom fields page
When I click the the choose input type button
AND select text box
Then display custom field settings in an expanded accordion
WITH selected input type as the accordion label
AND the following settings: Field name, Required, Help text

Given I have created and edited a custom field
When I click Save
Then save updates

Given I have created and edited a custom field
When I click Cancel OR click on another app OR click on a browser back button
Then display the Unsaved Changes modal