BE: Work items - Resources widget

Summary

Issues allow users to add a Zoom meeting using /zoom, which appears below the description. Incidents meanwhile have "Linked resources", which supports Zoom links and other external links.

To support these use cases, we will need a new Resources widget for work items.

Acceptance criteria

Adding a Resource
  • Users can select a "Add resource link" from within an "Add" (plus) button menu
    • Move "Add design" to be within this menu as well.
  • If the Resources widget exists (a Resource has already been added), users can also select the "Add" button from the widget itself.
  • Selecting either option mentioned above opens a modal with fields for:
    • Link
    • Title (optional)
  • Use inline validation for if a user tries to submit without providing a value for Link
  • Users can only add 1 resource at a time
  • If no protocol is entered (http://, https://), automatically prepend http:// to the link
    • This is different from the legacy Linked resources widget, where it errors if neither is provided.
  • Include the quick action /resource to add resources via descriptions/comments
    • Similar format to the legacy linked resources quick action
Displaying Resources
  • After a Resource is added, show the Resources widget.
    • This should be the first widget displayed below the description and actions (above "Designs")
  • Resources are displayed using their Title, if present, or their URL if no Title is provided, and linked to the URL provided in the Link field.
    • Resources will not show any other metadata.
  • Resources are displayed as inline cards, instead of full-width items like in the Child/Linked widgets.
    • Refer to the designs below for hover states of card and remove button.
  • Truncate the Title (or Link/URL if no Title) if it doesn't fit within the width of an entire row (see design)
    • We keep these to one line, no wrapping.
  • Use the following type icon based on these scenarios:
    • external-link – Any link that is outside the instance domain
    • link – Any link within the instance domain
    • brand-zoom (preserve the icon's original blue color) – Zoom links. Additional brand icons may be supported in the future.
  • Resources can be removed using the "x" ("Remove") button.

Design resources

Edited by Nick Brandt