From cb51f8858766cd64c8624b2dd3deabe3030b5329 Mon Sep 17 00:00:00 2001
From: Mario Buikhuizen <mariobuikhuizen@widgetti.io>
Date: Mon, 18 Nov 2024 17:58:25 +0100
Subject: [PATCH 1/2] fix: golden layout not rendering when created outside
 viewport (#3299)

* fix: golden layout not rendering when created outside viewport

Since Lab 4.2 cells outside the viewport get the style
"display: none" which causes the content to not have height.
This causes an error in size calculations of golden layout
from which it doesn't recover.

* Add changelog

---------

Co-authored-by: Ricky O'Steen <rosteen@stsci.edu>
(cherry picked from commit 7e5ddfa4ceabc73d683b4153e45057875a611c51)
---
 CHANGES.rst    |  2 ++
 jdaviz/app.vue | 13 +++++++++++++
 2 files changed, 15 insertions(+)

diff --git a/CHANGES.rst b/CHANGES.rst
index f7e7de9e5c..68e49856e4 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -14,6 +14,8 @@ Bug Fixes
 
 - Added ``nbclassic`` dependency to fix ``solara``-based popouts. [#3282]
 
+- Fixed viewer widgets displaying improperly if initialized out of view in Jupyter Lab. [#3299]
+
 Cubeviz
 ^^^^^^^
 
diff --git a/jdaviz/app.vue b/jdaviz/app.vue
index 6ca646dc6f..cca52dd6ae 100644
--- a/jdaviz/app.vue
+++ b/jdaviz/app.vue
@@ -76,6 +76,7 @@
         <splitpanes>
           <pane size="75">
             <golden-layout
+              v-if="outputCellHasHeight"
               style="height: 100%;"
               :has-headers="state.settings.visible.tab_headers"
               @state="onLayoutChange"
@@ -162,6 +163,11 @@
 
 <script>
 export default {
+  data() {
+    return {
+      outputCellHasHeight: false,
+    };
+  },
   methods: {
     checkNotebookContext() {
       this.notebook_context = document.getElementById("ipython-main-app")
@@ -188,6 +194,13 @@ export default {
     if (jpOutputElem) {
       jpOutputElem.classList.remove('jupyter-widgets');
     }
+    /* Workaround for Lab 4.2: cells outside the viewport get the style "display: none" which causes the content to not
+     * have height. This causes an error in size calculations of golden layout from which it doesn't recover.
+     */
+    new ResizeObserver(entries => {
+      this.outputCellHasHeight = entries[0].contentRect.height > 0;
+    }).observe(this.$refs.mainapp.$el);
+    this.outputCellHasHeight = this.$refs.mainapp.$el.offsetHeight > 0
   }
 };
 </script>

From 415845db2c0346e746599caf1285c3977e471bb4 Mon Sep 17 00:00:00 2001
From: Ricky O'Steen <rosteen@stsci.edu>
Date: Mon, 18 Nov 2024 12:26:44 -0500
Subject: [PATCH 2/2] Fix changelog header

---
 CHANGES.rst | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/CHANGES.rst b/CHANGES.rst
index 68e49856e4..9c63d69827 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -1,4 +1,4 @@
-A.B.1 (unreleased)
+4.0.1 (unreleased)
 ==================
 
 Bug Fixes
@@ -21,7 +21,7 @@ Cubeviz
 
 - Add missing styling to API hints entry for aperture_method in the spectral extraction plugin. [#3231]
 
-- Fixed "spectrum at spaxel" tool so it no longer resets spectral axis zoom. [#3249] 
+- Fixed "spectrum at spaxel" tool so it no longer resets spectral axis zoom. [#3249]
 
 - Fixed initializing a Gaussian1D model component when ``Cube Fit`` is toggled on. [#3295]