DEV Community

Thom
Thom

Posted on

2 1

Set up Document Intelligence Component in Contextual Sidebar

!This post was made for the ServiceNow Tokyo Release!

With the Tokyo Release of ServiceNow we got some nice improvements to the Record page. I assume here, that you installed the Document Intelligence component already.

First we need to open UI Builder (UIB) and navigate to the Record page. Then lets go to our tab sidebar component:

Image description

and add a new tab.

Image description

I'm selecting the "start from an empty container".

Image description

Then creating a tab and selecting an icon.

Image description

In that newly created tab I can now select a component.

Image description

Now we need to do some wiring. I created a GraphQL Data Broker to fetch me the the right DI task (di_task). As we have a source_table and source_record field on the di_task table, we can use that to get our di_task.

The Properties of my GraphQL data broker is a filter, so I can set the right filter in the UIB.

[{ 
  "name": "filter", 
  "label": "Filter for getting the right docIntel Task", 
  "description": "Query conditions in the 'encoded query' format, for filtering the di_task table", 
  "readOnly": false, 
  "fieldType": "condition_string", 
  "mandatory": false, 
  "defaultValue": "", 
  "typeMetadata": {"table": "di_task"} 
}] 
Enter fullscreen mode Exit fullscreen mode

And then a simple query:

query ($filter: String){
  GlideRecord_Query {
    di_task(queryConditions: $filter) {
      _results {
        display_name {
          value
        },
         sys_id{
          value
        }
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Lets now wire up the Filter on the UIB and do the data binding. We can also use the props data of the record page in the filter conditions.

Image description

And the last point is to do the data binding on the component.

Image description

Thats it, have fun!

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

đź‘‹ Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay