From a5b810fe18e8d5122bca0d021f842823c0dcbb2e Mon Sep 17 00:00:00 2001
From: Isaac Janzen <50783505+janzenisaac@users.noreply.github.com>
Date: Wed, 26 Jul 2023 11:08:59 -0500
Subject: [PATCH] FIX: Flashing history modal when changing versions (#22785)

## Problem
History modal is flashing when changing revision versions

## Context
This was introduced in https://github.com/discourse/discourse/pull/22666

We need to have a conditional loading spinner for the initial paint of the history modal as we don't have the revision yet loaded, so this can cause some odd rendering issues. At the same time we don't want to display the loading spinner each time we toggle between the revision versions, because the loading spinner replaces the revision body causing the modal sizes to be drastically different resulting in _jumping_ or _flashing_.

## Fix
Render the loading spinner only on the first paint of the modal.

https://github.com/discourse/discourse/assets/50783505/8d19275e-86a5-4132-8a1f-af4b4f5301a6
---
 .../javascripts/discourse/app/components/modal/history.hbs      | 2 +-
 .../javascripts/discourse/app/components/modal/history.js       | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/discourse/app/components/modal/history.hbs b/app/assets/javascripts/discourse/app/components/modal/history.hbs
index ebe00483c63..1ce8e17587c 100644
--- a/app/assets/javascripts/discourse/app/components/modal/history.hbs
+++ b/app/assets/javascripts/discourse/app/components/modal/history.hbs
@@ -4,7 +4,7 @@
   class="history-modal"
 >
   <:body>
-    <ConditionalLoadingSpinner @condition={{this.loading}}>
+    <ConditionalLoadingSpinner @condition={{this.initialLoad}}>
       <Modal::History::Revision
         @model={{this.postRevision}}
         @mobileView={{this.site.mobileView}}
diff --git a/app/assets/javascripts/discourse/app/components/modal/history.js b/app/assets/javascripts/discourse/app/components/modal/history.js
index 814bccddda7..069da8ea109 100644
--- a/app/assets/javascripts/discourse/app/components/modal/history.js
+++ b/app/assets/javascripts/discourse/app/components/modal/history.js
@@ -29,6 +29,7 @@ export default class History extends Component {
   @tracked postRevision;
   @tracked viewMode = this.site?.mobileView ? "inline" : "side_by_side";
   @tracked bodyDiff;
+  @tracked initialLoad = true;
 
   constructor() {
     super(...arguments);
@@ -171,6 +172,7 @@ export default class History extends Component {
     Post.loadRevision(postId, postVersion).then((result) => {
       this.postRevision = result;
       this.loading = false;
+      this.initialLoad = false;
     });
   }