Remaining work attributes table by MiriamAparicio · Pull Request #224723 · elastic/kibana

MiriamAparicio · 2025-06-20T15:01:04Z

Closes #221928

Add ES|QL logic

Screen.Recording.2025-06-24.at.12.15.17.mov

Empty message for accordion

Empty message when there are no attributes fields at all
For now we kept the accordion closed when fields count is zero, with an empty message inside, waiting for UI/UX team to review this implementation

Simplify attribute display names

the field name should not show the full field name. The tooltip will show both, simplify and full name, this is part of the implementation FieldName component from platform

Filtering controls use full field name

Screen.Recording.2025-06-24.at.12.23.23.mov

Add explanatory tooltip for attribute namespaces

Test:

How to generate OTel data

Follow https://github.com/smith/elastic-stack-docker-compose?tab=readme-ov-file#elastic-stack-docker-compose

How to test

Make sure your solution view is Observability
update your kibana.yml

discover.experimental.enabledProfiles:
   - observability-root-profile-with-attributes-tab
   #  if you want to test it with the additional profiles add the following to your `kibana.yaml` 
   - observability-traces-data-source-profile
   - observability-traces-transaction-document-profile
   - observability-traces-span-document-profile

elasticmachine · 2025-06-24T11:31:57Z

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

…rk-attributes-table

jennypavlova

Nice, well done 👏
NIT: One small visual thing: The icon and the tooltip position are off by some pixels:

jennypavlova · 2025-06-24T16:53:27Z

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

+      <EuiFlexItem grow={false}>
+        <EuiFlexGroup
+          responsive={false}
+          wrap={true}


Nit

Suggested change

wrap={true}

wrap

jennypavlova · 2025-06-24T16:58:31Z

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

+  const noFields =
+    groupedFields.attributesFields.length === 0 &&
+    groupedFields.resourceAttributesFields.length === 0 &&
+    groupedFields.scopeAttributesFields.length === 0;
+


Nit: to avoid repeating groupedFields, we can do:

Suggested change

const noFields =

groupedFields.attributesFields.length === 0 &&

groupedFields.resourceAttributesFields.length === 0 &&

groupedFields.scopeAttributesFields.length === 0;

const {attributesFields, resourceAttributesFields, scopeAttributesFields} = groupedFields

const noFields =

attributesFields.length === 0 &&

resourceAttributesFields.length === 0 &&

scopeAttributesFields.length === 0;

Maybe define them on top, and use them everywhere

it can be simplified a bit more

const noFields = Object.values(groupedFields).every( (arr) => Array.isArray(arr) && arr.length === 0 );

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

jennypavlova · 2025-06-24T17:12:12Z

src/platform/packages/shared/kbn-unified-doc-viewer/src/components/field_name/field_name.tsx

+  const fieldDisplayName = displayName
+    ? displayName
+    : fieldMapping && fieldMapping.displayName
+    ? fieldMapping.displayName
+    : fieldName;


Nit we can simplify this to avoid chaining conditions, something like:

Suggested change

const fieldDisplayName = displayName

? displayName

: fieldMapping && fieldMapping.displayName

? fieldMapping.displayName

: fieldName;

const dipslayNameFromFieldMapping = fieldMapping?.displayName ? fieldMapping.displayName : fieldName;

const fieldDisplayName = displayName ?? dipslayNameFromFieldMapping;

jennypavlova · 2025-06-24T17:56:30Z

I managed to see an error by adding 2 ES|QL conditions using the filters:

It is also visible in the other tabs so not a blocker for the PR, but it would be nice to fix that (I am using oblt lite cluster and it is not easy to reproduce this error 🫠 )

davismcphee

Code-only review. Data Discovery changes look good for the most part, but I noticed an issue related to field display names in the Table tab.

src/platform/packages/shared/kbn-unified-doc-viewer/src/components/field_name/field_name.tsx

src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_table/field_row.ts

MiriamAparicio · 2025-06-25T08:39:33Z

@jennypavlova

One small visual thing: The icon and the tooltip position are off by some pixels:

Yeah, I added a bit of a margin, so it looks as in the fields column, but I can get rid of it

jennypavlova · 2025-06-25T09:21:00Z

Yeah, I added a bit of a margin, so it looks as in the fields column, but I can get rid of it

The margin is OK, I think that wasn't clear. I meant the tooltip arrow should move up a bit so it points to the ? , it is barely visible and just 1-2 pixels off, so all good 😉

(or the ? should be centered but that would not match the other discover ?, it is OK to leave it 😅 )

MiriamAparicio · 2025-06-25T12:05:19Z

@jennypavlova No idea what was wrong with the position of the tooltip, I just changed position and now looks better

kpatticha · 2025-06-25T12:27:16Z

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

-    [allFields, shouldShowFieldHandler]
-  );
-
  const groupedFields = useMemo(() => {


Can we move the field grouping functionality into a separate utility file to keep things cleaner and add some unit tests?

kpatticha · 2025-06-25T12:32:42Z

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

+
      if (lowerFieldName.startsWith('resource.attributes.')) {
-        resourceAttributesFields.push(fieldName);
+        resourceAttributesFields.push({


There’s some repetition in this approach.
Can we improve it a bit? We could use a mapping something like or something similar

const fieldTypeMap = [ { prefix: 'resource.attributes.', target: resourceAttributesFields }, { prefix: 'scope.attributes.', target: scopeAttributesFields }, { prefix: 'attributes.', target: attributesFields }, ]; for (const { prefix, target } of fieldTypeMap) { if (lowerFieldName.startsWith(prefix)) { target.push({ name: fieldName, displayName: getAttributeDisplayName(fieldName), }); } } ``` wdyt?

A forEach() will work better here

kpatticha · 2025-06-25T12:36:07Z

...c/components/observability/attributes/doc_viewer_attributes_overview/attributes_overview.tsx

+        return acc;
+      }
+
+      if (isEsqlMode && areNullValuesHidden && flattened[fieldName] == null) {


in lines 85-95 all return acc. Can we combine them?

yeah, I think in this case is better to use a forEach() I will modify and extract the function in to a separate file + unit tests

kpatticha · 2025-06-25T12:43:49Z

...onents/observability/attributes/doc_viewer_attributes_overview/get_attribute_display_name.ts

+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+export function getAttributeDisplayName(fieldName: string): string {


Could you please add some tests for this function?

MiriamAparicio · 2025-06-25T13:50:24Z

Found a bug, I'm fixing now, related with the search, when filtering by 'attr' in Table tab it shows the fields but when changing to Attributes tab the search term is kept, but the tables are shown empty, although the accordion shows the count of fields. In this case I think the search should take into account the whole, not simplified name and show the fields in the table

elasticmachine · 2025-06-25T15:57:41Z

💚 Build Succeeded

Buildkite Build
Commit: d5dd9d6

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`unifiedDocViewer`	336	339	+3

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`unifiedDocViewer`	219.5KB	222.8KB	+3.3KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
`unifiedDocViewer`	12.9KB	12.8KB	-18.0B

History

💔 Build #312604 failed fe25970
💛 Build #312150 was flaky fa9ed7b
💔 Build #312080 failed 3b39533
💚 Build #311348 succeeded c4bd075

davismcphee

Confirmed the custom label issue I was seeing is resolved now, Data Discovery changes LGTM 👍

kpatticha

Thanks for the quick fixes, great work 💯

kibanamachine · 2025-06-26T12:13:42Z

Starting backport for target branches: 8.19

https://github.com/elastic/kibana/actions/runs/15901517587

Closes elastic#221928 #### Add ES|QL logic https://github.com/user-attachments/assets/d29f939a-7b82-4873-92d4-8210c2202339 #### Empty message for accordion - Empty message when there are no attributes fields at all - For now we kept the accordion closed when fields count is zero, with an empty message inside, waiting for UI/UX team to review this implementation <img width="524" alt="Screenshot 2025-06-24 at 12 27 18" src="https://github.com/user-attachments/assets/4015ed6a-5977-486d-93e6-d8b5714af9fd" /> #### Simplify attribute display names - the field name should not show the full field name. The tooltip will show both, simplify and full name, this is part of the implementation `FieldName` component from platform <img width="624" alt="Screenshot 2025-06-24 at 12 19 48" src="https://github.com/user-attachments/assets/634b4ef0-0934-4721-9217-334286b6464a" /> <img width="624" alt="Screenshot 2025-06-24 at 12 20 07" src="https://github.com/user-attachments/assets/bdc6de9c-784f-4c78-bf18-1f37b645429d" /> #### Filtering controls use full field name https://github.com/user-attachments/assets/7858d803-271e-4913-9aae-385dd7bc9e25 #### Add explanatory tooltip for attribute namespaces <img width="525" alt="Screenshot 2025-06-24 at 12 24 33" src="https://github.com/user-attachments/assets/a76b1419-c1d9-4e46-a289-a819b7533b18" /> <img width="525" alt="Screenshot 2025-06-24 at 12 24 51" src="https://github.com/user-attachments/assets/e48b19a3-85a8-4a13-b527-3a4494aef2af" /> <img width="525" alt="Screenshot 2025-06-24 at 12 24 57" src="https://github.com/user-attachments/assets/50501672-4d75-43ce-b61b-646108b4b14a" /> ### Test: #### How to generate OTel data - Follow https://github.com/smith/elastic-stack-docker-compose?tab=readme-ov-file#elastic-stack-docker-compose #### How to test - Make sure your solution view is Observability - update your `kibana.yml` ``` discover.experimental.enabledProfiles: - observability-root-profile-with-attributes-tab # if you want to test it with the additional profiles add the following to your `kibana.yaml` - observability-traces-data-source-profile - observability-traces-transaction-document-profile - observability-traces-span-document-profile ``` (cherry picked from commit 75ba373)

kibanamachine · 2025-06-26T12:20:11Z

💚 All backports created successfully

Status	Branch	Result
✅	8.19

Note: Successful backport PRs will be merged automatically after passing CI.

Questions ?

Please refer to the Backport tool documentation

# Backport This will backport the following commits from `main` to `8.19`: - [Remaining work attributes table (#224723)](#224723)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport)  Co-authored-by: Miriam <31922082+MiriamAparicio@users.noreply.github.com>

MiriamAparicio added 10 commits June 20, 2025 11:32

Add accordion sections and attributes tables

8fdbac5

fix function to get the accordion title

3447800

remove get_data_stream_type file, and fix to table

21f6fb0

remove check for processor.event, fix filter for multifields

95f0ad6

pr review

f85dac8

add support for Es/Ql hide nulls option

e9d359e

added empty messages and tooltips

c95dbe8

fix i18n namespace id

562d68c

show empty state when there aren't attributes of any type

c4bd075

improve empty message, simply attributes field name

c7eb10f

MiriamAparicio added release_note:skip Skip the PR/issue when compiling release notes Team:obs-ux-infra_services - DEPRECATED DEPRECATED - Use Team:obs-presentation. backport:version Backport to applied version labels v9.1.0 v8.19.0 labels Jun 24, 2025

MiriamAparicio marked this pull request as ready for review June 24, 2025 11:31

MiriamAparicio requested a review from a team as a code owner June 24, 2025 11:31

MiriamAparicio added 2 commits June 24, 2025 13:07

add codeowners

ff42c06

Merge remote-tracking branch 'upstream/main' into 221928-remaining-wo…

6e7c325

…rk-attributes-table

MiriamAparicio force-pushed the 221928-remaining-work-attributes-table branch from e38a45a to 6e7c325 Compare June 24, 2025 12:09

MiriamAparicio requested a review from a team June 24, 2025 12:14

update snapshots

13ed0bc

MiriamAparicio force-pushed the 221928-remaining-work-attributes-table branch from 3b39533 to 13ed0bc Compare June 24, 2025 14:44

Merge branch 'main' into 221928-remaining-work-attributes-table

fa9ed7b

kpatticha self-requested a review June 24, 2025 17:08

jennypavlova approved these changes Jun 24, 2025

View reviewed changes

davismcphee reviewed Jun 25, 2025

View reviewed changes

pr review

fe25970

kpatticha reviewed Jun 25, 2025

View reviewed changes

extract functions, add test, fix search bug and tests

d5dd9d6

MiriamAparicio requested a review from davismcphee June 25, 2025 16:18

davismcphee approved these changes Jun 25, 2025

View reviewed changes

kpatticha approved these changes Jun 26, 2025

View reviewed changes

MiriamAparicio merged commit 75ba373 into elastic:main Jun 26, 2025
10 checks passed

MiriamAparicio deleted the 221928-remaining-work-attributes-table branch June 26, 2025 12:13

kibanamachine mentioned this pull request Jun 26, 2025

[8.19] Remaining work attributes table (#224723) #225440

Merged

kibanamachine mentioned this pull request Jun 26, 2025

[Oblt Onboarding] Add more errors logging for Auto Detect flow #222948

Merged

Comments

Conversation

MiriamAparicio commented Jun 20, 2025 • edited by kibanamachine Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Add ES|QL logic

Empty message for accordion

Simplify attribute display names

Filtering controls use full field name

Add explanatory tooltip for attribute namespaces

Test:

How to generate OTel data

How to test

Uh oh!

elasticmachine commented Jun 24, 2025

Uh oh!

jennypavlova left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jennypavlova commented Jun 24, 2025

Uh oh!

davismcphee left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

MiriamAparicio commented Jun 25, 2025

Uh oh!

jennypavlova commented Jun 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

MiriamAparicio commented Jun 25, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

kpatticha Jun 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

MiriamAparicio commented Jun 25, 2025

Uh oh!

elasticmachine commented Jun 25, 2025

💚 Build Succeeded

Metrics [docs]

Module Count

Async chunks

Page load bundle

History

Uh oh!

davismcphee left a comment

Choose a reason for hiding this comment

Uh oh!

kpatticha left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

kibanamachine commented Jun 26, 2025

Uh oh!

kibanamachine commented Jun 26, 2025

💚 All backports created successfully

Questions ?

Uh oh!

Reviewers

MiriamAparicio commented Jun 20, 2025 •

edited by kibanamachine

Loading

jennypavlova commented Jun 25, 2025 •

edited

Loading

kpatticha Jun 25, 2025 •

edited

Loading