Enable render of legacy vega-lite outputs

Author: OlegWock

package-lock.json

@@ -2143,6 +2143,7 @@
         "fs-extra": "^4.0.3",
         "glob": "^7.1.2",
         "iconv-lite": "^0.6.3",
+        "immer": "^10.1.3",
         "inversify": "^6.0.1",
         "isomorphic-ws": "^4.0.1",
         "jquery": "^3.6.0",

package.json

@@ -9,6 +9,10 @@ import { addPocketToCellMetadata, createBlockFromPocket } from './pocket';
 import { TextBlockConverter } from './converters/textBlockConverter';
 import { MarkdownBlockConverter } from './converters/markdownBlockConverter';
 import { VisualizationBlockConverter } from './converters/visualizationBlockConverter';
+import { compile as convertVegaLiteSpecToVega } from 'vega-lite';
+import { produce } from 'immer';
+import type { Field } from 'vega-lite/build/src/channeldef';
+import type { LayerSpec, TopLevel } from 'vega-lite/build/src/spec';
 
 /**
  * Utility class for converting between Deepnote block structures and VS Code notebook cells.
@@ -295,6 +299,26 @@ export class DeepnoteDataConverter {
                             );
                         }
 
+                        if (data['application/vnd.vegalite.v5+json']) {
+                            const patchedVegaLiteSpec = produce(
+                                data['application/vnd.vegalite.v5+json'] as TopLevel<LayerSpec<Field>>,
+                                (draft) => {
+                                    draft.height = 'container';
+                                    draft.width = 'container';
+
+                                    draft.autosize = {
+                                        type: 'fit'
+                                    };
+                                    if (!draft.config) {
+                                        draft.config = {};
+                                    }
+                                    draft.config.customFormatTypes = true;
+                                }
+                            );
+                            const vegaSpec = convertVegaLiteSpecToVega(patchedVegaLiteSpec).spec;
+                            items.push(NotebookCellOutputItem.json(vegaSpec, 'application/vnd.vega.v5+json'));
+                        }
+
                         if (data['application/json']) {
                             items.push(NotebookCellOutputItem.json(data['application/json'], 'application/json'));
                         }