Files
windmill/frontend/src/lib/components/Subsection.svelte
T
Guilhem 484fdfa2bc fix(frontend): update workers page ui (#7264)
* Improve workers page

* Update group config drawer

* improve dirty workergroup config

* Make layout reactive

* fix section animation

* prevent opening dropdown while clicking New group config

* migrate workers page to svelte 5

* Open drawer upon adding a worker group

* nit critical alert table

* improve queue metrics drawer

* improve agent worker drawer

* harmonize copy icon

* improve agent worker doc

* improve layout

* Improve autoscaling event list

* Improve tags managment

* Remove default tags

* fix npm check

* Add info for agent workers

* improve agent worker jwt token creation

* Improve token display

* nit

* improve tag display

* create EE component

* nit

* harmonize tag overflow

* handle permission better

* improve env var presets

* handle permission for config

* nit alerts

* nit

* Improve custom tag creation in tag select

* optimistic tag addition

* nit

* nit

* fix typo

* improve workers table

* Group config tags

* show mismatch

* fix typo

* optimistic update when adding tag

* do not allow to create tag when picking a tag to watch in alerts
2025-12-04 22:09:25 +00:00

80 lines
1.8 KiB
Svelte

<script lang="ts">
import { enterpriseLicense } from '$lib/stores'
import { ChevronDown, ChevronRight } from 'lucide-svelte'
import Tooltip from './Tooltip.svelte'
import { twMerge } from 'tailwind-merge'
import EEOnly from './EEOnly.svelte'
interface Props {
label?: string | undefined
tooltip?: string | undefined
eeOnly?: boolean
collapsable?: boolean
collapsed?: boolean
openInitially?: boolean
headless?: boolean
class?: string | undefined
header?: import('svelte').Snippet
action?: import('svelte').Snippet
badge?: import('svelte').Snippet
children?: import('svelte').Snippet
}
let {
label = undefined,
tooltip = undefined,
eeOnly = false,
collapsable = false,
collapsed = $bindable(true),
openInitially = false,
headless = false,
class: clazz = undefined,
header,
action,
badge,
children
}: Props = $props()
if (openInitially && collapsable && collapsed) {
collapsed = false
}
</script>
<div class="w-full">
{#if !headless}
<div class="flex flex-row justify-between items-center mb-1">
<h3 class={twMerge('font-semibold flex flex-row items-center gap-2', 'text-sm')}>
{#if collapsable}
<button class="flex items-center gap-1" onclick={() => (collapsed = !collapsed)}>
{#if collapsed}
<ChevronRight size={16} />
{:else}
<ChevronDown size={16} />
{/if}
{label}
</button>
{:else}
{label}
{/if}
{@render header?.()}
{#if tooltip}
<Tooltip>{tooltip}</Tooltip>
{/if}
{#if eeOnly}
{#if !$enterpriseLicense}
<EEOnly />
{/if}
{/if}
</h3>
{@render action?.()}
{#if collapsable && collapsed}
{@render badge?.()}
{/if}
</div>
{/if}
<div class={collapsable && collapsed ? `hidden ${clazz ?? ''}` : `${clazz ?? ''}`}>
{@render children?.()}
</div>
</div>