Merge pull request #111 from dockersamples/keep-tab-iframes

Enable faster reload when switching tabs

Author: mikesir87

components/interface/client/src/TabContext.jsx

@@ -25,7 +25,9 @@ export function TabContextProvider({ children }) {
             const tabIndex = prevTabs.findIndex((tab) => tab.url === url);
             if (updatedTabs.length > 0) {
               const newIndex =
-                tabIndex === 0 ? 0 : Math.min(tabIndex - 1, updatedTabs.length - 1);
+                tabIndex === 0
+                  ? 0
+                  : Math.min(tabIndex - 1, updatedTabs.length - 1);
               return updatedTabs[newIndex].url;
             } else {
               return null;

components/interface/client/src/components/ExternalContentPanel/ExternalContentPanel.jsx

@@ -23,12 +23,18 @@ export function ExternalContentPanel() {
           }}
         />
       </div>
-      {activeTab ? (
-        <iframe
-          ref={iframeRef}
-          style={{ flex: 1, border: "none" }}
-          src={activeTab}
-        />
+      {tabs.length > 0 ? (
+        <>
+          {tabs.map((tab) => (
+            <iframe
+              key={tab.url}
+              ref={tab.url === activeTab ? iframeRef : null}
+              style={{ flex: 1, border: "none" }}
+              src={tab.url}
+              className={tab.url === activeTab ? "d-block" : "d-none"}
+            />
+          ))}
+        </>
       ) : (
         <IdePlaceholder
           onLaunch={() => addTab("http://localhost:8085", "Workspace")}