How to create custom Record Attachment sidebar option like SOW Attachment in the sidebar?

[gjz]

I am very new to UI Builder and have been tasked with creating a sidebar option that will allow the fulfiller to see all attachments relating to a catalog request ticket.

In the core UI, we created a custom related list that allowed staff to view all attachments in one place for RITM/SCTASKS without having to navigate up/down the tree to see all attachments that may have been added to the ticket.  For example, the user may have added one on RITM, SCTASK A may have an attachment, STASK C may also have an attachment.  Instead of constantly navigating to find any attachments, we have a related list that shows all three in one location.

Here is an example of what we did:

In Service Operations Workspace, I can see the Attachments option in the sidebar, but it only displays attachments belonging to the ticket that is being viewed.  I want to mimic this functionality, but display all attachments vs. just what is attached to the currently viewed ticket.

I really don't know where to start.  I'm open to anyone providing instructions, sharing videos, documentation, anything that will help me get started.

TIA!

[Mark Manders]

Can't you simply add the related list to the workspace view as well, doing the same? I assume you used this approach to create the related list: https://mysnstuff.com/2022/12/01/show-ritm-attachments-on-catalog-tasks/

[Ankur Bawiskar]

@gjz 

I agree with @Mark Manders here.

Simply add that related list in your Workspace view and that related list will start seeing the same info which they see in native.

[gjz]

Hi Ankur, Mark,

I already did that, but when you click on it, it just takes you to the record in the sys_attachment table.  I need them to function the same as it does in the sidebar.

This test RITM has two attachments, one on the RITM and one on the SCTASK.

When I'm in the SCTASK and open the one that is on the RITM from the related list, this is what I get.

[lauri457]

To do this via the related list; there is a dispatched event from the related records macroponent to the record page called "Related Record reference cell link clicked" /nav_to.do?uri=sys_ux_event.do?sys_id=e64cbb0243f031107f08ff53e9b8f2e8

Spoiler

Properties from originating event:

[
    {
        "defaultValue": {},
        "description": "Row {object} containing the ID and display value.",
        "fieldType": "json",
        "label": "Row",
        "name": "row",
        "typeMetadata": {
            "schema": {
                "type": "object"
            }
        },
        "valueType": "object"
    },
    {
        "defaultValue": "",
        "description": "The table name that the clicked row belongs to.",
        "fieldType": "string",
        "label": "Table",
        "name": "table",
        "typeMetadata": {
            "schema": {
                "type": "string"
            }
        },
        "valueType": "string"
    },
    {
        "defaultValue": "",
        "description": "The table name being viewed when clicking a row.",
        "fieldType": "string",
        "label": "List table",
        "name": "listTable",
        "typeMetadata": {
            "schema": {
                "type": "string"
            }
        },
        "valueType": "string"
    },
    {
        "defaultValue": {},
        "description": "The event object.",
        "fieldType": "json",
        "label": "Native event",
        "name": "nativeEvent",
        "typeMetadata": {
            "schema": {
                "type": "object"
            }
        },
        "valueType": "object"
    },
    {
        "defaultValue": "",
        "description": "The sys ID of the record clicked.",
        "fieldType": "string",
        "label": "Sys ID",
        "name": "sys_id",
        "typeMetadata": {
            "schema": {
                "type": "string"
            }
        },
        "valueType": "string"
    },
    {
        "defaultValue": "",
        "description": "The title of the list.",
        "fieldType": "string",
        "label": "List title",
        "name": "listTitle",
        "typeMetadata": {
            "schema": {
                "type": "string"
            }
        },
        "valueType": "string"
    },
    {
        "defaultValue": "",
        "description": "The ID of the record clicked.",
        "fieldType": "string",
        "label": "Record ID",
        "name": "record_id",
        "typeMetadata": {
            "schema": {
                "type": "string"
            }
        },
        "valueType": "string"
    },
    {
        "defaultValue": false,
        "description": "Whether the record cell is in the first non-reference column of the list. If true, the cell will be treated as a reference cell.",
        "fieldType": "boolean",
        "label": "Is first non reference",
        "name": "isFirstNonRef",
        "typeMetadata": {
            "schema": {
                "type": "boolean"
            }
        },
        "valueType": "boolean"
    }
]​

You can handle this event using the Attachment preview requested handler form the form controller, it will then open the preview overlay on the page like the attachment list on the side tray.

/**
 *  {params} params
 *  {api} params.api
 *  {any} params.event
 */
function evaluateEvent({
    api,
    event
}) {
    return {
        item: {
            canDelete: true,
            name: event.payload.row.displayValue.value,
            readonly: false,
            sysId: event.payload.row.sys_id.value,
            type: ""
        }
    }
}

However there is still the OOB routing to the sys_attachment record page. I couldn't figure out how to get rid of that.

As for the attachment page that is on the side tray, it is composed of a component we don't have access to so you'd need to build your own page to display there instead 

Attachments - Now Component Library | ServiceNow Developers