Merge pull request #12874 from overleaf/td-history-binary-file

History migration: Show alert for binary file preview

GitOrigin-RevId: f30e4946ce9f873661055b8a096c6aba7ab08e2d

services/web/frontend/extracted-translations.json

@@ -66,6 +66,7 @@
   "beta_program_already_participating": "",
   "beta_program_benefits": "<0></0>",
   "beta_program_not_participating": "",
+  "binary_history_error": "",
   "blank_project": "",
   "blocked_filename": "",
   "browser": "",

services/web/frontend/js/features/history/components/diff-view/main.tsx

@@ -2,6 +2,7 @@ import { Nullable } from '../../../../../../types/utils'
 import { Diff } from '../../services/types/doc'
 import DocumentDiffViewer from './document-diff-viewer'
 import LoadingSpinner from '../../../../shared/components/loading-spinner'
+import { useTranslation } from 'react-i18next'
 
 type MainProps = {
   diff: Nullable<Diff>
@@ -9,16 +10,22 @@ type MainProps = {
 }
 
 function Main({ diff, isLoading }: MainProps) {
+  const { t } = useTranslation()
+
   if (isLoading) {
     return <LoadingSpinner />
   }
 
   if (!diff) {
-    return <div>No document</div>
+    return <div className="history-content">No document</div>
   }
 
   if (diff.binary) {
-    return <div>Binary file</div>
+    return (
+      <div className="history-content">
+        <div className="alert alert-info">{t('binary_history_error')}</div>
+      </div>
+    )
   }
 
   if (diff.docDiff) {
@@ -26,7 +33,7 @@ function Main({ diff, isLoading }: MainProps) {
     return <DocumentDiffViewer doc={doc} highlights={highlights} />
   }
 
-  return <div>No document</div>
+  return null
 }
 
 export default Main

services/web/frontend/stylesheets/app/editor/history-react.less

@@ -298,6 +298,10 @@ history-root {
     font-size: 20px;
     font-weight: 700;
   }
+
+  .history-content {
+    padding: @line-height-computed / 2;
+  }
 }
 
 .history-version-label-tooltip {