starred/windmill
1
0
Fork 0
mirror of https://github.com/windmill-labs/windmill.git synced 2026-08-20 16:02:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Rich result buttons (#3485)

Browse Source 
* Rich result buttons

* Fix rich result button

* feat(frontend): improve rich display buttons

* Icon to monitor

* Custom tooltip

* End Monitor

* Tooltip file fixed

---------

Co-authored-by: Faton Ramadani <faton.ramadani14@gmail.com>
Co-authored-by: Ruben Fiszel <ruben@windmill.dev>
This commit is contained in:
Henri Courdent
2024-04-25 17:49:46 +02:00
committed by GitHub
parent b1ae732df0
commit 89cb5befc6
3 changed files with 47 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/DisplayResult.svelte
+12 -3
View File
@@ -26,6 +26,7 @@
import ToggleButtonGroup from './common/toggleButton-v2/ToggleButtonGroup.svelte'
import ToggleButton from './common/toggleButton-v2/ToggleButton.svelte'
import MapResult from './MapResult.svelte'
import Tooltip from '$lib/components/Tooltip.svelte'
export let result: any
export let requireHtmlApproval = false
@@ -303,12 +304,20 @@
<div class="text-tertiary text-xs flex gap-2 z-10 items-center">
<slot name="copilot-fix" />
{#if !disableExpand && !noControls}
<Tooltip documentationLink="https://www.windmill.dev/docs/core_concepts/rich_display_rendering" customSize="115%">
The result renderer in Windmill supports rich display rendering, allowing you to customize the display format of your results.
</Tooltip>
<button on:click={() => copyToClipboard(toJsonStr(result))}
><ClipboardCopy size={16} /></button
>
<button on:click={jsonViewer.openDrawer}><Expand size={16} /></button>
class="-mt-1">
<ClipboardCopy size={16} />
</button>
<button on:click={jsonViewer.openDrawer}
class="-mt-1">
<Expand size={16} />
</button>
{/if}
</div>
</div>{#if !forceJson && resultKind == 'table-col'}
{@const data = 'table-col' in result ? result['table-col'] : result}
<AutoDataTable objects={transform(data)} />
frontend/src/lib/components/Tooltip.svelte
+2 -1
View File
@@ -10,10 +10,11 @@
export let documentationLink: string | undefined = undefined
export let small = false
export let markdownTooltip: string | undefined = undefined
export let customSize: string = '100%';
const plugins = [gfmPlugin()]
</script>
<Popover notClickable {placement} class={wrapperClass}>
<Popover notClickable {placement} class={wrapperClass} style="transform: scale({parseFloat(customSize) / 100});" >
<div
class="inline-flex w-3 mx-0.5 {light
? 'text-tertiary-inverse'
frontend/src/lib/components/scriptEditor/LogPanel.svelte
+33 -23
View File
@@ -26,6 +26,8 @@
import DataTable from '../table/DataTable.svelte'
import Head from '../table/Head.svelte'
import WorkflowTimeline from '../WorkflowTimeline.svelte'
import Tooltip from '$lib/components/Tooltip.svelte'
export let lang: Preview['language'] | undefined
export let previewIsLoading = false
@@ -117,31 +119,39 @@
<Pane>
{#if previewJob != undefined && 'result' in previewJob}
<div class="relative w-full h-full p-2">
<DisplayResult
workspaceId={previewJob?.workspace_id}
jobId={previewJob?.id}
result={previewJob.result}
>
<svelte:fragment slot="copilot-fix">
{#if lang && editor && diffEditor && args && previewJob?.result && typeof previewJob?.result == 'object' && `error` in previewJob?.result && previewJob?.result.error}
<ScriptFix
error={JSON.stringify(previewJob.result.error)}
{lang}
{editor}
{diffEditor}
{args}
/>
{/if}
</svelte:fragment>
</DisplayResult>
<div class="relative">
<DisplayResult
workspaceId={previewJob?.workspace_id}
jobId={previewJob?.id}
result={previewJob.result}
>
<svelte:fragment slot="copilot-fix">
{#if lang && editor && diffEditor && args && previewJob?.result && typeof previewJob?.result == 'object' && `error` in previewJob?.result && previewJob?.result.error}
<ScriptFix
error={JSON.stringify(previewJob.result.error)}
{lang}
{editor}
{diffEditor}
{args}
/>
{/if}
</svelte:fragment>
</DisplayResult>
</div>
</div>
{:else}
<div class="text-sm text-tertiary p-2">
{#if previewIsLoading}
<Loader2 class="animate-spin" />
{:else}
Test to see the result here
{/if}
<div class="text-sm text-tertiary p-2 flex justify-between items-center">
<span>
{#if previewIsLoading}
<Loader2 class="animate-spin" />
{:else}
Test to see the result here
{/if}
</span>
<Tooltip documentationLink="https://www.windmill.dev/docs/core_concepts/rich_display_rendering">
The result renderer in Windmill supports rich display rendering, allowing you to customize the display format of your results.
</Tooltip>
</div>
{/if}
</Pane>