diff --git a/services/web/frontend/js/features/preview/components/preview-download-button.js b/services/web/frontend/js/features/preview/components/preview-download-button.js
index 6a0f7d9516..464bcbfa3d 100644
--- a/services/web/frontend/js/features/preview/components/preview-download-button.js
+++ b/services/web/frontend/js/features/preview/components/preview-download-button.js
@@ -42,13 +42,20 @@ function PreviewDownloadButton({ isCompiling, outputFiles, pdfDownloadUrl }) {
/>
-
- {otherFiles.length > 0 && (
+ {otherFiles.length > 0 && topFiles.length > 0 ? (
<>
+ >
+ ) : (
+ <>>
+ )}
+ {otherFiles.length > 0 ? (
+ <>
>
+ ) : (
+ <>>
)}
diff --git a/services/web/test/frontend/features/preview/components/preview-download-button.test.js b/services/web/test/frontend/features/preview/components/preview-download-button.test.js
index 5043343129..91c80b131b 100644
--- a/services/web/test/frontend/features/preview/components/preview-download-button.test.js
+++ b/services/web/test/frontend/features/preview/components/preview-download-button.test.js
@@ -167,4 +167,57 @@ describe('', function() {
)
screen.getAllByRole('menuitem', { name: 'Download alt.pdf file' })
})
+ describe('list divider and header', function() {
+ it('should display when there are top files and other files', function() {
+ const outputFiles = [
+ makeFile('output.bbl'),
+ makeFile('output.ind'),
+ makeFile('output.gls'),
+ makeFile('output.log')
+ ]
+
+ render(
+
+ )
+
+ screen.getByText('Other output files')
+ screen.getByRole('separator')
+ })
+ it('should not display when there are top files and no other files', function() {
+ const outputFiles = [
+ makeFile('output.bbl'),
+ makeFile('output.ind'),
+ makeFile('output.gls')
+ ]
+
+ render(
+
+ )
+
+ expect(screen.queryByText('Other output files')).to.not.exist
+ expect(screen.queryByRole('separator')).to.not.exist
+ })
+ it('should not display when there are other files and no top files', function() {
+ const outputFiles = [makeFile('output.log')]
+
+ render(
+
+ )
+
+ expect(screen.queryByText('Other output files')).to.not.exist
+ expect(screen.queryByRole('separator')).to.not.exist
+ })
+ })
})