Skip to content

ref(traces): Remove hiddenAttributes prop from AttributeTree #94817

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jul 3, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,9 @@ export type AttributesFieldRendererProps<RendererExtra extends RenderFunctionBag
};

interface AttributesFieldRender<RendererExtra extends RenderFunctionBaggage> {
/**
* Extra data that gets passed to the renderer function for every attribute in the tree. If any of your field renderers rely on data that isn't related to the attributes (e.g., the current theme or location) or data that lives in another attribute (e.g., using the log level attribute to render the log text attribute) you should pass that data as here.
*/
rendererExtra: RendererExtra;
renderers?: Record<
string,
Expand All @@ -69,13 +72,15 @@ interface AttributesFieldRender<RendererExtra extends RenderFunctionBaggage> {

interface AttributesTreeProps<RendererExtra extends RenderFunctionBaggage>
extends AttributesFieldRender<RendererExtra> {
/**
* The attributes to show in the attribute tree. If you need to hide any attributes, filter them out before passing them here. If you need extra attribute information for rendering but you don't want to show those attributes, pass that information in the `rendererExtra` prop.
*/
attributes: TraceItemResponseAttribute[];
// If provided, locks the number of columns to this number. If not provided, the number of columns will be dynamic based on width.
columnCount?: number;
config?: AttributesTreeRowConfig;
getAdjustedAttributeKey?: (attribute: TraceItemResponseAttribute) => string;
getCustomActions?: (content: AttributesTreeContent) => MenuItemProps[];
hiddenAttributes?: string[];
}

interface AttributesTreeColumnsProps<RendererExtra extends RenderFunctionBaggage>
Expand Down Expand Up @@ -212,7 +217,6 @@ function getAttributesTreeRows<RendererExtra extends RenderFunctionBaggage>({
function AttributesTreeColumns<RendererExtra extends RenderFunctionBaggage>({
attributes,
columnCount,
hiddenAttributes = [],
renderers = {},
rendererExtra: renderExtra,
config = {},
Expand All @@ -226,7 +230,7 @@ function AttributesTreeColumns<RendererExtra extends RenderFunctionBaggage>({

// Convert attributes record to the format expected by addToAttributeTree
const visibleAttributes = attributes
.map(key => getAttribute(key, hiddenAttributes, getAdjustedAttributeKey))
.map(key => getAttribute(key, getAdjustedAttributeKey))
.filter(defined);

// Create the AttributeTree data structure using all the given attributes
Expand Down Expand Up @@ -289,7 +293,6 @@ function AttributesTreeColumns<RendererExtra extends RenderFunctionBaggage>({
}, [
attributes,
columnCount,
hiddenAttributes,
renderers,
renderExtra,
config,
Expand Down Expand Up @@ -490,18 +493,12 @@ function AttributesTreeValue<RendererExtra extends RenderFunctionBaggage>({
}

/**
* Filters out hidden attributes, replaces sentry. prefixed keys, and simplifies the value
* Replaces sentry. prefixed keys, and simplifies the value
*/
function getAttribute(
attribute: TraceItemResponseAttribute,
hiddenAttributes: string[],
getAdjustedAttributeKey?: (attribute: TraceItemResponseAttribute) => string
): Attribute | undefined {
// Filter out hidden attributes
if (hiddenAttributes.includes(attribute.name)) {
return undefined;
}

const attributeValue =
attribute.type === 'bool' ? String(attribute.value) : attribute.value;

Expand Down
4 changes: 4 additions & 0 deletions static/app/views/explore/logs/tables/logsTableRow.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,7 @@ describe('logsTableRow', () => {
const rowDetails = [
...Object.entries(rowData),
...Object.entries({
[OurLogKnownFieldKey.SPAN_ID]: 'faded0',
[OurLogKnownFieldKey.CODE_FUNCTION_NAME]: 'derp',
[OurLogKnownFieldKey.CODE_LINE_NUMBER]: '10',
[OurLogKnownFieldKey.CODE_FILE_PATH]: 'herp/merp/derp.py',
Expand Down Expand Up @@ -130,6 +131,9 @@ describe('logsTableRow', () => {
expect(screen.getByText('test log body')).toBeInTheDocument();
expect(screen.getByText('2025-04-03T15:50:10+00:00')).toBeInTheDocument();

// Check that the span ID is not rendered
expect(screen.queryByText('span_id')).not.toBeInTheDocument();

// Expand the row to show the attributes
const logTableRow = await screen.findByTestId('log-table-row');
expect(logTableRow).toBeInTheDocument();
Expand Down
5 changes: 3 additions & 2 deletions static/app/views/explore/logs/tables/logsTableRow.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -416,8 +416,9 @@ function LogRowDetails({
</DetailsBody>
<LogAttributeTreeWrapper>
<AttributesTree<RendererExtra>
attributes={data.attributes}
hiddenAttributes={HiddenLogDetailFields}
attributes={data.attributes.filter(
attribute => !HiddenLogDetailFields.includes(attribute.name)
)}
getCustomActions={getActions}
getAdjustedAttributeKey={adjustAliases}
renderers={LogAttributesRendererMap}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -101,16 +101,23 @@ export function Attributes({
: undefined;

const sortedAndFilteredAttributes = useMemo(() => {
const sorted = sortAttributes(attributes);
const sortedAttributes = sortAttributes(attributes);

const onlyVisibleAttributes = sortedAttributes.filter(
attribute => !HIDDEN_ATTRIBUTES.includes(attribute.name)
);

if (!searchQuery.trim()) {
return sorted;
return onlyVisibleAttributes;
}

return sorted.filter(
attribute =>
!HIDDEN_ATTRIBUTES.includes(attribute.name) &&
attribute.name.toLowerCase().trim().includes(searchQuery.toLowerCase().trim())
);
const normalizedSearchQuery = searchQuery.toLowerCase().trim();

const onlyMatchingAttributes = onlyVisibleAttributes.filter(attribute => {
return attribute.name.toLowerCase().trim().includes(normalizedSearchQuery);
});

return onlyMatchingAttributes;
}, [attributes, searchQuery]);

const customRenderers: Record<
Expand Down Expand Up @@ -190,7 +197,6 @@ export function Attributes({
{sortedAndFilteredAttributes.length > 0 ? (
<AttributesTreeWrapper>
<AttributesTree
hiddenAttributes={HIDDEN_ATTRIBUTES}
columnCount={columnCount}
attributes={sortedAndFilteredAttributes}
renderers={customRenderers}
Expand Down
Loading