diff --git a/src/components/Executions/ExecutionDetails/NodeExecutionOutputs.tsx b/src/components/Executions/ExecutionDetails/NodeExecutionOutputs.tsx
index 19efc4dd0..097a236aa 100644
--- a/src/components/Executions/ExecutionDetails/NodeExecutionOutputs.tsx
+++ b/src/components/Executions/ExecutionDetails/NodeExecutionOutputs.tsx
@@ -1,7 +1,7 @@
import { WaitForData } from 'components/common';
import { useCommonStyles } from 'components/common/styles';
import { useNodeExecutionData } from 'components/hooks';
-import { RemoteLiteralMapViewer } from 'components/Literals';
+import { LiteralMapViewer, RemoteLiteralMapViewer } from 'components/Literals';
import { NodeExecution } from 'models';
import * as React from 'react';
@@ -18,6 +18,7 @@ export const NodeExecutionOutputs: React.FC<{ execution: NodeExecution }> = ({
diff --git a/src/components/Executions/ExecutionInputsOutputsModal.tsx b/src/components/Executions/ExecutionInputsOutputsModal.tsx
index d33980efe..1905b8ab4 100644
--- a/src/components/Executions/ExecutionInputsOutputsModal.tsx
+++ b/src/components/Executions/ExecutionInputsOutputsModal.tsx
@@ -42,7 +42,12 @@ const RemoteExecutionInputs: React.FC<{ execution: Execution }> = ({
const executionData = useWorkflowExecutionData(execution.id);
return (
- {() => }
+ {() => (
+
+ )}
);
};
@@ -54,7 +59,10 @@ const RemoteExecutionOutputs: React.FC<{ execution: Execution }> = ({
return (
{() => (
-
+
)}
);
diff --git a/src/components/Literals/RemoteLiteralMapViewer.tsx b/src/components/Literals/RemoteLiteralMapViewer.tsx
index 468256d33..b4c1e19cd 100644
--- a/src/components/Literals/RemoteLiteralMapViewer.tsx
+++ b/src/components/Literals/RemoteLiteralMapViewer.tsx
@@ -1,6 +1,6 @@
import { WaitForData } from 'components/common';
import { useRemoteLiteralMap } from 'components/hooks';
-import { UrlBlob } from 'models';
+import { Literal, LiteralMap, UrlBlob } from 'models';
import * as React from 'react';
import { maxBlobDownloadSizeBytes } from './constants';
import { LiteralMapViewer } from './LiteralMapViewer';
@@ -24,11 +24,12 @@ const BlobTooLarge: React.FC<{ url: string }> = ({ url }) => (
* address, this component will initiate a fetch of the data and then render it
* using a `LiteralMapViewer`. Special behaviors are used for blobs missing
* a URL or which are too large to view in the UI. For the latter case, a direct
- * download link is provided.
+ * download link is provided. If `map` is defined, use it instead of fetching.
*/
-export const RemoteLiteralMapViewer: React.FC<{ blob: UrlBlob }> = ({
- blob
-}) => {
+export const RemoteLiteralMapViewer: React.FC<{
+ blob: UrlBlob;
+ map?: LiteralMap;
+}> = ({ blob, map }) => {
if (!blob.url || !blob.bytes) {
return (
@@ -37,6 +38,10 @@ export const RemoteLiteralMapViewer: React.FC<{ blob: UrlBlob }> = ({
);
}
+ if (map !== undefined) {
+ return ;
+ }
+
return blob.bytes.gt(maxBlobDownloadSizeBytes) ? (
) : (
diff --git a/src/components/Literals/test/RemoteLiteralMapViewer.test.tsx b/src/components/Literals/test/RemoteLiteralMapViewer.test.tsx
new file mode 100644
index 000000000..4de9e509f
--- /dev/null
+++ b/src/components/Literals/test/RemoteLiteralMapViewer.test.tsx
@@ -0,0 +1,74 @@
+import { getByText, render } from '@testing-library/react';
+import * as React from 'react';
+
+import { FetchableData } from 'components/hooks';
+import { loadedFetchable } from 'components/hooks/__mocks__/fetchableData';
+import { useRemoteLiteralMap } from 'components/hooks/useRemoteLiteralMap';
+import * as Long from 'long';
+import { LiteralMap } from 'models';
+import { RemoteLiteralMapViewer } from '../RemoteLiteralMapViewer';
+
+jest.mock('components/hooks/useRemoteLiteralMap');
+
+describe('RemoteLiteralMapViewer', () => {
+ it('renders no data available', () => {
+ const blob = {
+ url: '',
+ bytes: Long.fromInt(0)
+ };
+
+ const { getAllByText } = render(
+
+ );
+
+ const items = getAllByText('No data is available.');
+ expect(items.length).toBe(1);
+ });
+
+ it('renders map if it is defined', () => {
+ const blob = {
+ url: 'http://url',
+ bytes: Long.fromInt(1337)
+ };
+
+ const map: LiteralMap = {
+ literals: {
+ input1: {}
+ }
+ };
+
+ const { getAllByText } = render(
+
+ );
+
+ const items = getAllByText('input1:');
+ expect(items.length).toBe(1);
+ });
+
+ it('fetches blob if map is undefined', () => {
+ const map: LiteralMap = {
+ literals: {
+ input1: {}
+ }
+ };
+
+ const mockUseRemoteLiteralMap = useRemoteLiteralMap as jest.Mock<
+ FetchableData
+ >;
+ mockUseRemoteLiteralMap.mockReturnValue(
+ loadedFetchable(map, () => null)
+ );
+
+ const blob = {
+ url: 'http://url',
+ bytes: Long.fromInt(1337)
+ };
+
+ const { getAllByText } = render(
+
+ );
+
+ const items = getAllByText('input1:');
+ expect(items.length).toBe(1);
+ });
+});
diff --git a/src/models/Execution/types.ts b/src/models/Execution/types.ts
index ddd117a01..759641440 100644
--- a/src/models/Execution/types.ts
+++ b/src/models/Execution/types.ts
@@ -124,4 +124,6 @@ export interface TaskExecutionClosure extends Admin.ITaskExecutionClosure {
export interface ExecutionData {
inputs: UrlBlob;
outputs: UrlBlob;
+ fullInputs?: LiteralMap;
+ fullOutputs?: LiteralMap;
}