Used short mode of data spillage report card in threads view to fix spacing issue (#36709)

This commit is contained in:
Harshil Sharma
2026-05-25 09:36:01 +05:30
committed by GitHub
parent 508f1551e3
commit cfafefe58c
2 changed files with 32 additions and 1 deletions
@@ -2,6 +2,7 @@
// See LICENSE.txt for license information.
import {act} from '@testing-library/react';
import {createMemoryHistory} from 'history';
import React from 'react';
import type {Post} from '@mattermost/types/posts';
@@ -431,6 +432,32 @@ describe('components/post_view/data_spillage_report/DataSpillageReport', () => {
expect(screen.queryByTestId('data-spillage-action-keep-message')).toBeVisible();
});
it('should render in short mode in the global threads view even when isRHS is true', async () => {
const history = createMemoryHistory({initialEntries: ['/myteam/threads/abcdefghijklmnopqrstuvwxyz']});
renderWithContext(
<DataSpillageReport
post={post}
isRHS={true}
/>,
baseState,
{history},
);
await act(async () => {});
const card = screen.getByTestId('data-spillage-report');
expect(card).toHaveClass('mode_short');
expect(card).not.toHaveClass('mode_full');
// short mode renders only the short field set
expect(screen.queryAllByTestId('property-card-row')).toHaveLength(4);
// action rows are gated on mode === 'full', so they must not render here
expect(screen.queryByTestId('data-spillage-action')).not.toBeInTheDocument();
expect(screen.queryByTestId('data-spillage-action-download-report')).not.toBeInTheDocument();
});
describe.each([
['Pending', true],
['Retained', false],
@@ -3,6 +3,7 @@
import React, {useMemo} from 'react';
import {FormattedMessage, useIntl} from 'react-intl';
import {matchPath, useLocation} from 'react-router-dom';
import {ContentFlaggingStatus} from '@mattermost/types/content_flagging';
import type {Post} from '@mattermost/types/posts';
@@ -60,6 +61,9 @@ type Props = {
export function DataSpillageReport({post, isRHS}: Props) {
const {formatMessage} = useIntl();
const {pathname} = useLocation();
const inGlobalThreadsView = matchPath(pathname, {path: '/:team/threads/:threadIdentifier?'}) != null;
const reportedPostId = post.props.reported_post_id as string;
@@ -108,7 +112,7 @@ export function DataSpillageReport({post, isRHS}: Props) {
user: (<AtMention mentionName={reportingUser?.username || ''}/>),
});
const mode = isRHS ? 'full' : 'short';
const mode = (isRHS && !inGlobalThreadsView) ? 'full' : 'short';
const metadata = useMemo<PropertiesCardViewMetadata>(() => {
const fieldMetadata: PropertiesCardViewMetadata = {