feat: eda history basic setup (#1212)

Closes #1211 ### Summary of Changes Fully basic history, with undo, redo and history display where user can skip to any other step. My Miro notes, not summarized for times sake: ![image](https://github.com/Safe-DS/DSL/assets/97200640/04b6b130-29bd-4794-a0c8-7ec9216e1ab8)
Safe-DS · Jun 24, 2024 · 597672b · 597672b
1 parent 9ae953a
commit 597672b
Show file tree

Hide file tree

Showing 15 changed files with 1,435 additions and 174 deletions.
diff --git a/packages/safe-ds-eda/src/App.svelte b/packages/safe-ds-eda/src/App.svelte
@@ -2,7 +2,7 @@
     import TableView from './components/TableView.svelte';
     import Sidebar from './components/Sidebar.svelte';
     import { throttle } from 'lodash';
-    import { currentTabIndex, tabs } from './webviewState';
+    import { currentTabIndex, tableKey, tabs } from './webviewState';
     import TabContent from './components/tabs/TabContent.svelte';
 
     let sidebarWidth = 307; // Initial width of the sidebar in pixels
@@ -45,15 +45,19 @@
     </div>
     <div class="contentWrapper">
         <div class:hide={$currentTabIndex !== undefined}>
-            <TableView {sidebarWidth} />
+            {#key $tableKey}
+                <TableView {sidebarWidth} />
+            {/key}
         </div>
-        {#if $tabs.length > 0}
-            {#each $tabs as tab, index}
-                <div class:hide={index !== $currentTabIndex}>
-                    <TabContent {tab} {sidebarWidth} />
-                </div>
-            {/each}
-        {/if}
+        {#key $tableKey}
+            {#if $tabs.length > 0}
+                {#each $tabs as tab, index}
+                    <div class:hide={index !== $currentTabIndex}>
+                        <TabContent {tab} {sidebarWidth} />
+                    </div>
+                {/each}
+            {/if}
+        {/key}
     </div>
 </main>
 

diff --git a/packages/safe-ds-eda/src/apis/extensionApi.ts b/packages/safe-ds-eda/src/apis/extensionApi.ts
@@ -1,6 +1,8 @@
 import { get } from 'svelte/store';
 import type { HistoryEntry } from '../../types/state';
 import { table } from '../webviewState';
+import type { ExecuteRunnerAllEntry } from '../../types/messaging';
+import { filterHistoryOnlyInternal } from './historyApi';
 
 export const createInfoToast = function (message: string) {
     window.injVscode.postMessage({ command: 'setInfo', value: message });
@@ -21,6 +23,64 @@ const executeRunnerExcludingHiddenColumns = function (
     });
 };
 
+export const executeRunnerAll = function (entries: HistoryEntry[], jumpedToHistoryId: number) {
+    const currentEntries: HistoryEntry[] = [];
+    const finalEntries: ExecuteRunnerAllEntry[] = entries.map((entry) => {
+        currentEntries.push(entry);
+        if (entry.type === 'external-visualizing' && entry.columnNumber === 'none') {
+            // If the entry is a tab where you do not select columns => don't include hidden columns in visualization
+            // Hidden columns calculated by filtering the history for not overriden hide column calls up to this point
+            return {
+                type: 'excludingHiddenColumns',
+                entry,
+                hiddenColumns: filterHistoryOnlyInternal(currentEntries).reduce<string[]>((acc, filteredEntry) => {
+                    if (filteredEntry.action === 'hideColumn') {
+                        acc.push(filteredEntry.columnName);
+                    }
+                    return acc;
+                }, []),
+            };
+        } else {
+            return { type: 'default', entry };
+        }
+    });
+    window.injVscode.postMessage({
+        command: 'executeRunnerAll',
+        value: { entries: finalEntries, jumpedToHistoryId },
+    });
+};
+
+export const executeRunnerAllFuture = function (
+    futureEntries: HistoryEntry[],
+    pastEntries: HistoryEntry[],
+    jumpedToHistoryId: number,
+) {
+    const currentEntries: HistoryEntry[] = pastEntries;
+    const finalFutureEntries: ExecuteRunnerAllEntry[] = futureEntries.map((entry) => {
+        currentEntries.push(entry);
+        if (entry.type === 'external-visualizing' && entry.columnNumber === 'none') {
+            // If the entry is a tab where you do not select columns => don't include hidden columns in visualization
+            // Hidden columns calculated by filtering the history for not overriden hide column calls up to this point
+            return {
+                type: 'excludingHiddenColumns',
+                entry,
+                hiddenColumns: filterHistoryOnlyInternal(currentEntries).reduce<string[]>((acc, filteredEntry) => {
+                    if (filteredEntry.action === 'hideColumn') {
+                        acc.push(filteredEntry.columnName);
+                    }
+                    return acc;
+                }, []),
+            };
+        } else {
+            return { type: 'default', entry };
+        }
+    });
+    window.injVscode.postMessage({
+        command: 'executeRunnerAllFuture',
+        value: { futureEntries: finalFutureEntries, pastEntries, jumpedToHistoryId },
+    });
+};
+
 const executeRunnerDefault = function (pastEntries: HistoryEntry[], newEntry: HistoryEntry) {
     window.injVscode.postMessage({
         command: 'executeRunner',