mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-09-09 08:03:50 +00:00
* separate flow and status with splitpane * fix autoscroll behavior * Flow log viewer nit * not graph viewer * Improve flow job result * Create job detail header to replace metadata * Remove FlowPreviewResult * Create compact job header * Use job header in runs page * Improve runs page run preview * Use flow header in detail section * Show logs for script steps * Clean old schedule status * Limit result height * Script run detail improvement * Script run preview improvement * Fix csv table overflow * surface tertiary as background for Inputs * nit * Improve runs detail skeleton * fix check * nit * Improve node definition * fix flow module component overflow * Use component DataTable for flow schema viewer * Add language icon to step detail * improve run header * Improve Job detail header * nit * restore isOwner logic * Handle resume flows * restore execution status in run preview * restore flow execution status in the preview * flow preview, add status bar * nit module status * nit * Remove flor preview result * nit * nit * fix flow result card * nit * nit * nit * improve field selection on runs detail based on job type * Improve column layout * create JobStatusIcon component * remove job status badge icons * improve compact version * use shared job field display * improve job detail field display * fix badge alignment * increase padding * nit * nit * improve compact display * make background darker for metadata * use auto layout * fix auto layout * improve display * fix truncate logic * fix compact * improve flex adaptibility * improve responsive layout * improve extra compact header * nit * remove unused icons * nit * Improve flow result display * nit * merge progressbar and execution status * handle canceled flow better
116 lines
3.3 KiB
Svelte
116 lines
3.3 KiB
Svelte
<script lang="ts">
|
|
import type { Schema } from '$lib/common'
|
|
import { copyToClipboard, emptySchema } from '$lib/utils'
|
|
|
|
import Highlight from 'svelte-highlight'
|
|
import json from 'svelte-highlight/languages/json'
|
|
import DataTable from './table/DataTable.svelte'
|
|
import Head from './table/Head.svelte'
|
|
import Cell from './table/Cell.svelte'
|
|
import Row from './table/Row.svelte'
|
|
import Tab from './common/tabs/Tab.svelte'
|
|
import TabContent from './common/tabs/TabContent.svelte'
|
|
import Tabs from './common/tabs/Tabs.svelte'
|
|
import { Badge } from './common'
|
|
import HighlightTheme from './HighlightTheme.svelte'
|
|
import Button from './common/button/Button.svelte'
|
|
import { ClipboardCopy } from 'lucide-svelte'
|
|
|
|
interface Props {
|
|
schema?: Schema | undefined | any
|
|
}
|
|
|
|
let { schema = emptySchema() }: Props = $props()
|
|
|
|
function getProperties(schema: Schema) {
|
|
if (schema.properties) {
|
|
return Object.entries(schema.properties)
|
|
}
|
|
return []
|
|
}
|
|
</script>
|
|
|
|
<HighlightTheme />
|
|
|
|
<div class="w-full">
|
|
<Tabs selected="arguments">
|
|
<Tab value="arguments" label="Inputs" />
|
|
<Tab value="json" label="JSON" />
|
|
{#snippet content()}
|
|
<div class="overflow-auto pt-2">
|
|
<TabContent value="arguments">
|
|
{#if schema && schema.properties && Object.keys(schema.properties).length > 0 && schema.required}
|
|
<DataTable size="sm" containerClass="bg-surface-tertiary">
|
|
<Head>
|
|
<tr class="w-full">
|
|
<Cell head first>Name</Cell>
|
|
<Cell head>Type</Cell>
|
|
<Cell head>Description</Cell>
|
|
<Cell head>Default</Cell>
|
|
<Cell head>Format</Cell>
|
|
<Cell head last>Required</Cell>
|
|
</tr>
|
|
</Head>
|
|
|
|
<tbody class="divide-y w-full">
|
|
{#each getProperties(schema) as [name, property] (name)}
|
|
<Row>
|
|
<Cell first>
|
|
<span class="font-semibold">{name}</span>
|
|
</Cell>
|
|
<Cell>
|
|
<Badge color="blue">
|
|
{#if !property.type}
|
|
any
|
|
{:else}
|
|
{property.type}
|
|
{/if}
|
|
</Badge>
|
|
</Cell>
|
|
<Cell wrap>
|
|
{property.description ?? ''}
|
|
</Cell>
|
|
<Cell>
|
|
{property.default == '<function call>'
|
|
? '<function call>'
|
|
: property.default
|
|
? JSON.stringify(property.default)
|
|
: ''}
|
|
</Cell>
|
|
<Cell>
|
|
{property.format ?? ''}
|
|
{property.contentEncoding ? `(encoding: ${property.contentEncoding})` : ''}
|
|
</Cell>
|
|
<Cell last>
|
|
{#if schema.required.includes(name)}
|
|
<span class="text-red-600 font-bold text-lg">*</span>
|
|
{/if}
|
|
</Cell>
|
|
</Row>
|
|
{/each}
|
|
</tbody>
|
|
</DataTable>
|
|
{:else}
|
|
<div class="text-secondary text-xs italic m-1">No arguments</div>
|
|
{/if}
|
|
</TabContent>
|
|
<TabContent value="json">
|
|
<div class="h-full relative">
|
|
<Button
|
|
wrapperClasses="absolute top-2 right-2 z-20"
|
|
on:click={() => copyToClipboard(JSON.stringify(schema, null, 4))}
|
|
color="light"
|
|
size="xs2"
|
|
startIcon={{
|
|
icon: ClipboardCopy
|
|
}}
|
|
iconOnly
|
|
/>
|
|
<Highlight language={json} code={JSON.stringify(schema, null, 4)} />
|
|
</div>
|
|
</TabContent>
|
|
</div>
|
|
{/snippet}
|
|
</Tabs>
|
|
</div>
|