feat: Show diff when navigating revision history (#4069)

* tidy

* Add title to HTML export

* fix: Add compatability for documents without collab state

* Add HTML download option to UI

* docs

* fix nodes that required document to render

* Refactor to allow for styling of HTML export

* div>article for easier programatic content extraction

* Allow DocumentHelper to be used with Revisions

* Add revisions.diff endpoint, first version

* Allow arbitrary revisions to be compared

* test

* HTML driven revision viewer

* fix: Dark mode styles for document diffs

* Add revision restore button to header

* test

* Support RTL languages in revision history viewer

* fix: RTL support
Remove unneccessary API requests

* Prefetch revision data

* Animate history sidebar

* fix: Cannot toggle history from timestamp
fix: Animation on each revision click

* Clarify currently editing history item

app/scenes/Document/components/DataLoader.tsx

@@ -42,7 +42,15 @@ type Props = RouteComponentProps<Params, StaticContext, LocationState> & {
 };
 
 function DataLoader({ match, children }: Props) {
-  const { ui, shares, documents, auth, revisions, subscriptions } = useStores();
+  const {
+    ui,
+    views,
+    shares,
+    documents,
+    auth,
+    revisions,
+    subscriptions,
+  } = useStores();
   const { team } = auth;
   const [error, setError] = React.useState<Error | null>(null);
   const { revisionId, shareId, documentSlug } = match.params;
@@ -89,7 +97,7 @@ function DataLoader({ match, children }: Props) {
 
   React.useEffect(() => {
     async function fetchSubscription() {
-      if (document?.id) {
+      if (document?.id && !revisionId) {
         try {
           await subscriptions.fetchPage({
             documentId: document.id,
@@ -101,7 +109,22 @@ function DataLoader({ match, children }: Props) {
       }
     }
     fetchSubscription();
-  }, [document?.id, subscriptions]);
+  }, [document?.id, subscriptions, revisionId]);
+
+  React.useEffect(() => {
+    async function fetchViews() {
+      if (document?.id && !document?.isDeleted && !revisionId) {
+        try {
+          await views.fetchPage({
+            documentId: document.id,
+          });
+        } catch (err) {
+          Logger.error("Failed to fetch views", err);
+        }
+      }
+    }
+    fetchViews();
+  }, [document?.id, document?.isDeleted, revisionId, views]);
 
   const onCreateLink = React.useCallback(
     async (title: string) => {