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

better

Browse Source
This commit is contained in:
centdix
2026-01-14 13:14:41 +00:00
parent 8c67e91db4
commit 3210157668
3 changed files with 53 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/DiffDrawer.svelte
+8 -29
View File
@@ -20,7 +20,6 @@
}
let diffType: 'draft' | 'deployed' | 'custom' | undefined = $state(undefined)
let flowdiffMode: 'yaml' | 'graph' = $state('yaml')
let contentType = $derived.by(() => {
if (!data || !diffType) return undefined
@@ -232,34 +231,14 @@
{/await}
{:else if contentType === 'metadata'}
{#if isFlow}
<Tabs bind:selected={flowdiffMode}>
<Tab value="yaml" label={`YAML`} />
<Tab value="graph" label={`Graph`} />
</Tabs>
{#if flowdiffMode === 'yaml'}
{#await import('$lib/components/DiffEditor.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default
open={true}
automaticLayout
className="h-full"
defaultLang="yaml"
defaultOriginal={metadata}
defaultModified={data.current.metadata}
readOnly
/>
{/await}
{:else if flowdiffMode === 'graph'}
{#await import('$lib/components/FlowGraphDiffViewer.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default
beforeYaml={metadata ?? ''}
afterYaml={data.current.metadata}
/>
{/await}
{/if}
{#await import('$lib/components/FlowYamlGraphDiff.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default
beforeYaml={metadata ?? ''}
afterYaml={data.current.metadata}
/>
{/await}
{:else}
{#await import('$lib/components/DiffEditor.svelte')}
<Loader2 class="animate-spin" />
frontend/src/lib/components/FlowViewer.svelte
+5 -27
View File
@@ -44,8 +44,6 @@
noGraphDownload = false
}: Props = $props()
let diffMode: 'yaml' | 'graph' = $state('yaml')
function flowToYaml(flowData: FlowType): string {
const cleaned = structuredClone(
cleanValueProperties(replaceFalseWithUndefined(flowData))
@@ -104,32 +102,12 @@
{#if compareFlow}
<TabContent value="diff">
<div class="flex flex-col gap-4 h-full mt-4">
<Tabs bind:selected={diffMode}>
<Tab value="yaml" label="YAML" />
<Tab value="graph" label="Graph" />
</Tabs>
<div class="flex-1 min-h-[400px]">
{#if diffMode === 'yaml'}
{#await import('$lib/components/DiffEditor.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default
open={true}
automaticLayout
className="h-full"
defaultLang="yaml"
defaultOriginal={beforeYaml}
defaultModified={afterYaml}
readOnly
/>
{/await}
{:else if diffMode === 'graph'}
{#await import('$lib/components/FlowGraphDiffViewer.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default beforeYaml={beforeYaml} afterYaml={afterYaml} />
{/await}
{/if}
{#await import('$lib/components/FlowYamlGraphDiff.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default {beforeYaml} {afterYaml} />
{/await}
</div>
</div>
</TabContent>
frontend/src/lib/components/FlowYamlGraphDiff.svelte
+40
View File
@@ -0,0 +1,40 @@
<script lang="ts">
import { Loader2 } from 'lucide-svelte'
import Tabs from './common/tabs/Tabs.svelte'
import Tab from './common/tabs/Tab.svelte'
interface Props {
beforeYaml: string
afterYaml: string
}
let { beforeYaml, afterYaml }: Props = $props()
let diffMode: 'yaml' | 'graph' = $state('yaml')
</script>
<Tabs bind:selected={diffMode}>
<Tab value="yaml" label="YAML" />
<Tab value="graph" label="Graph" />
</Tabs>
{#if diffMode === 'yaml'}
{#await import('$lib/components/DiffEditor.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default
open={true}
automaticLayout
className="h-full"
defaultLang="yaml"
defaultOriginal={beforeYaml}
defaultModified={afterYaml}
readOnly
/>
{/await}
{:else if diffMode === 'graph'}
{#await import('$lib/components/FlowGraphDiffViewer.svelte')}
<Loader2 class="animate-spin" />
{:then Module}
<Module.default {beforeYaml} {afterYaml} />
{/await}
{/if}