Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

tweak: use Expandable for attachments

Browse source
This commit is contained in:
alvaromartmart 2024-06-25 23:23:00 +02:00
parent 612cd17365
commit 0eb57e7774
1 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/trace-viewer/src/ui/attachmentsTab.tsx
View file

@ -22,6 +22,7 @@ import { PlaceholderPanel } from './placeholderPanel';
import type { AfterActionTraceEventAttachment } from '@trace/trace';
import { CodeMirrorWrapper } from '@web/components/codeMirrorWrapper';
import { isTextualMimeType } from '@isomorphic/mimeType';
import { Expandable } from '@web/components/expandable';
type Attachment = AfterActionTraceEventAttachment & { traceUrl: string };
@ -53,6 +54,18 @@ const TextAttachment: React.FunctionComponent<TextAttachmentProps> = ({ attachme
</div>;
};
const ExpandableAttachment: React.FunctionComponent<{ attachment: Attachment }> = ({ attachment }) => {
const [expanded, setExpanded] = React.useState(false);
return <Expandable title={
<a href={attachmentURL(attachment) + '&download'}>{attachment.name}</a>
} expanded={expanded} setExpanded={exp => setExpanded(exp)}>
{isTextualMimeType(attachment.contentType) ?
<TextAttachment attachment={attachment} label={attachment.name} /> :
<div><i>no preview available</i></div>
}
</Expandable>;
};
export const AttachmentsTab: React.FunctionComponent<{
model: MultiTraceModel | undefined,
}> = ({ model }) => {
@ -114,11 +127,7 @@ export const AttachmentsTab: React.FunctionComponent<{
return <>
{ i > 0 && <hr /> }
<div className='attachment-item' key={`attachment-${i}`}>
<a href={attachmentURL(a) + '&download'}>{a.name}</a>
{ isTextualMimeType(a.contentType) ?
<TextAttachment attachment={a} label={a.name}/> :
<div><i>no preview available</i></div>
}
<ExpandableAttachment attachment={a} />
</div>
</>;
})}