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

frontend misc

Browse Source
This commit is contained in:
Ruben Fiszel
2023-02-05 00:01:08 +01:00
parent 0ecfec2577
commit cdf7a75c99
17 changed files with 91 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/ArgInput.svelte
+1 -1
View File
@@ -166,7 +166,7 @@
<FieldHeader {label} {required} {type} {contentEncoding} {format} {itemsType} />
{/if}
{#if editableSchema}
<div class="my-1 text-xs border-solid border border-gray-400 rounded p-2">
<div class="my-1 text-xs border-solid border border-gray-400">
<span
class="underline"
on:click={() => {
frontend/src/lib/components/apps/components/buttons/AppButton.svelte
+3 -1
View File
@@ -105,7 +105,9 @@
{color}
{loading}
>
{labelValue}
<span class="truncate">
{labelValue}
</span>
</Button>
</AlignWrapper>
</RunnableWrapper>
frontend/src/lib/components/apps/components/dataDisplay/AppText.svelte
+2 -2
View File
@@ -67,8 +67,8 @@
No text
</div>
{:else}
<div class="flex flex-wrap gap-2 overflow-auto">
<svelte:element this={component} class="whitespace-pre-wrap {classes}" style={extraStyle}>
<div class="flex flex-wrap gap-2 pb-0.5 overflow-x-auto">
<svelte:element this={component} class="whitespace-pre-wrap {classes}" style={extraStyle}>
{String(result)}
</svelte:element>
{#if copyButton && result}
frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
+1 -1
View File
@@ -342,7 +342,7 @@
<slot />
</div>
{:else}
<div class="block grow max-h-full">
<div class="block grow w-full max-h-full">
<slot />
</div>
{/if}
frontend/src/lib/components/apps/editor/AppComponentInput.svelte
+2 -2
View File
@@ -7,7 +7,7 @@
</script>
{#if component?.componentInput?.type === 'runnable' && Object.keys(component?.componentInput?.fields ?? {}).length > 0}
<div class="mb-8">
<div class="mb-8 border p-2">
<div class="flex justify-between mb-4">
<span class="text-sm font-bold">{component.id}</span>
<span class="text-sm font-bold">{components[component.type].name}</span>
@@ -21,7 +21,7 @@
}
return false
}).length === 0}
<span class="text-sm">No resource input</span>
<span class="text-sm text-gray-600">No resource input</span>
{:else}
<InputsSpecsEditor
id={component.id}
frontend/src/lib/components/apps/editor/AppEditor.svelte
+1 -1
View File
@@ -157,7 +157,7 @@
: 'max-w-6xl'}"
>
{#if $appStore.grid}
<div class={classNames('p-4 mx-auto', width)}>
<div class={classNames('pb-4 mx-auto', width)}>
<GridEditor {policy} />
</div>
{/if}
frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
+1 -1
View File
@@ -458,7 +458,7 @@
</ToggleButtonGroup>
</div>
</div>
<div class="flex flex-row grow gap-2 justify-end items-center overflow-visible">
<div class="flex flex-row gap-2 justify-end items-center overflow-visible">
<Dropdown
placement="bottom-end"
btnClasses="!text-gray-700 !bg-transparent hover:!bg-gray-400/20 !p-[6px] hidden lg:block"
frontend/src/lib/components/apps/editor/AppInputs.svelte
+39 -31
View File
@@ -14,43 +14,51 @@
<Alert type="info" title="Configurations">
In order to properly configure the app, you need to fill in the inputs below.
</Alert>
<Toggle bind:checked={resourceOnly} options={{ right: 'Resource only' }} />
{#each $lazyGrid as gridItem (gridItem.data.id)}
{#if gridItem.data.type === 'tablecomponent'}
<div class="mt-2 flex flex-row-reverse">
<Toggle bind:checked={resourceOnly} options={{ right: 'Resource only' }} />
</div>
<div class="gap-4 flex flex-col pt-4">
{#each $lazyGrid as gridItem (gridItem.data.id)}
<div>
<AppComponentInput bind:component={gridItem.data} {resourceOnly} />
<div class="ml-4 mt-4">
{#each gridItem.data.actionButtons as actionButton (actionButton.id)}
<AppComponentInput bind:component={actionButton.data} {resourceOnly} />
{/each}
</div>
{#if gridItem.data.type === 'tablecomponent'}
<div>
<AppComponentInput bind:component={gridItem.data} {resourceOnly} />
<div class="ml-4 mt-4">
{#each gridItem.data.actionButtons as actionButton (actionButton.id)}
<AppComponentInput bind:component={actionButton.data} {resourceOnly} />
{/each}
</div>
</div>
{:else}
<AppComponentInput bind:component={gridItem.data} {resourceOnly} />
{/if}
</div>
{:else}
<AppComponentInput bind:component={gridItem.data} {resourceOnly} />
{/if}
{/each}
{/each}
</div>
{#if $app?.hiddenInlineScripts?.length > 0}
<span class="font-bold text-sm">Background script inputs</span>
<div class="gap-4 flex flex-col">
<div class="font-bold text-lg">Background script inputs</div>
<div class="gap-4 flex flex-col pt-4">
{#each $app?.hiddenInlineScripts ?? [] as script, index (script.name)}
<span class="text-sm">{script.name}</span>
<div class="border p-2">
<div class="text-sm font-bold">{script.name}</div>
{#if resourceOnly && Object.keys(script.fields).filter((fieldKey) => {
const fields = script.fields
const field = fields[fieldKey]
return field.fieldType === 'object' && field.format?.startsWith('resource-')
}).length === 0}
<span class="text-sm">No resource input</span>
{:else}
<InputsSpecsEditor
id={`bg_${index}`}
shouldCapitalize={false}
bind:inputSpecs={script.fields}
userInputEnabled={false}
{resourceOnly}
/>
{/if}
{#if resourceOnly && Object.keys(script.fields).filter((fieldKey) => {
const fields = script.fields
const field = fields[fieldKey]
return field.fieldType === 'object' && field.format?.startsWith('resource-')
}).length === 0}
<span class="text-sm text-gray-600">No resource input</span>
{:else}
<InputsSpecsEditor
id={`bg_${index}`}
shouldCapitalize={false}
bind:inputSpecs={script.fields}
userInputEnabled={false}
{resourceOnly}
/>
{/if}
</div>
{/each}
</div>
{/if}
frontend/src/lib/components/apps/editor/AppPreview.svelte
+1 -1
View File
@@ -75,7 +75,7 @@
$: lockedClasses = isLocked ? '!max-h-[400px] overflow-hidden pointer-events-none' : ''
</script>
<div class="relative h-[calc(100vh-41px)] overflow-auto">
<div class="relative">
<div
class="{$$props.class} {lockedClasses} h-full
w-full {app.fullscreen ? '' : 'max-w-6xl'} mx-auto"
frontend/src/lib/components/apps/editor/GridEditor.svelte
+5 -4
View File
@@ -116,11 +116,12 @@
})
</script>
<div class="pb-2 relative z-20">
<div class="pb-2 relative w-full z-20">
<div
class="w-full flex justify-between border-b {$connectingInput?.opened
class="w-full sticky top-0 flex justify-between border-l border-r border-b {$connectingInput?.opened
? ''
: 'bg-gray-50 '}px-4 py-2 items-center gap-4"
: 'bg-gray-50 '} px-4 py-2 items-center gap-4"
style="z-index: 1000;"
>
<h2 class="truncate">{$summary}</h2>
{#if !$connectingInput.opened}
@@ -131,7 +132,7 @@
>
</div>
<div
class="px-4 pt-4 {$connectingInput?.opened ? '' : ''}"
class="px-4 pt-4 overflow-auto {$connectingInput?.opened ? '' : ''}"
on:pointerdown={onpointerdown}
on:pointerleave={onpointerup}
on:pointerup={onpointerup}
frontend/src/lib/components/apps/editor/inlineScriptsPanel/EmptyInlineScript.svelte
+1 -1
View File
@@ -56,7 +56,7 @@
const langs = ['deno', 'python3', 'go', 'bash'] as Script.language[]
</script>
<div class="flex flex-col p-4 gap-2 text-sm" in:fly={{ duration: 50 }}>
<div class="flex flex-col px-4 py-2 gap-2 text-sm" in:fly={{ duration: 50 }}>
Please choose a language:
<div class="flex gap-2 flex-row flex-wrap">
{#each langs as lang}
frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte
+3
View File
@@ -19,6 +19,9 @@
<InlineScriptsPanelList bind:selectedScriptComponentId />
</Pane>
<Pane size={75}>
{#if !selectedScriptComponentId}
<span class="p-2 text-sm text-gray-600">Select a script on the left panel</span>
{/if}
{#each $lazyGrid as gridComponent, index (index)}
{#if gridComponent.data.id === selectedScriptComponentId}
<InlineScriptEditorPanel
frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanelList.svelte
+6 -4
View File
@@ -1,6 +1,7 @@
<script lang="ts">
import { Badge, Button } from '$lib/components/common'
import { faPlus } from '@fortawesome/free-solid-svg-icons'
import { Plus } from 'lucide-svelte'
import { getContext } from 'svelte'
import type { AppEditorContext } from '../../types'
import { getAllScriptNames } from '../../utils'
@@ -61,6 +62,7 @@
}
</script>
<div class="mb-0 pb-0 pl-2 sticky top-0 bg-white border-b text-xs font-semibold">Runnables</div>
<div bind:this={list} class="min-h-full flex flex-col gap-4">
<PanelSection title="Inline scripts" smallPadding>
<div class="flex flex-col gap-2 w-full">
@@ -105,7 +107,7 @@
</div>
</PanelSection>
<PanelSection title="Imported scripts" smallPadding>
<PanelSection title="Workspace/Hub" smallPadding>
<div class="flex flex-col gap-2 w-full">
{#if runnables.imported.length > 0}
<div class="flex gap-2 flex-col ">
@@ -122,7 +124,7 @@
{/each}
</div>
{:else}
<div class="text-sm text-gray-500">No items</div>
<div class="text-sm text-gray-500">No imported scripts/flows</div>
{/if}
</div>
</PanelSection>
@@ -134,8 +136,8 @@
smallPadding
>
<svelte:fragment slot="action">
<Button size="xs" color="dark" startIcon={{ icon: faPlus }} on:click={createBackgroundScript}>
Add
<Button size="xs" color="dark" variant="border" on:click={createBackgroundScript}
><Plus size={14} />
</Button>
</svelte:fragment>
<div class="flex flex-col gap-2 w-full">
frontend/src/lib/components/apps/editor/settingsPanel/common/PanelSection.svelte
+5 -3
View File
@@ -16,9 +16,11 @@
noPadding ? '' : smallPadding ? 'p-2' : 'p-4'
)}
>
<div class="flex justify-between items-center w-full gap-1">
<div class="text-sm font-extrabold {titlePadding}">
{title}
<div class="flex justify-between flex-wrap items-center w-full gap-1">
<div class="text-sm inline-flex items-center font-extrabold {titlePadding}">
<span class="truncate">
{title}
</span>
{#if tooltip}
<Tooltip>
{tooltip}
frontend/src/lib/components/scriptEditor/LogPanel.svelte
+1 -1
View File
@@ -97,7 +97,7 @@
{#if previewIsLoading}
<Loader2 class="animate-spin" />
{:else}
Test to see the result here'
Test to see the result here
{/if}
</div>
{/if}
frontend/src/routes/(root)/(logged)/apps/get/[...path]/+page.svelte
+1 -1
View File
@@ -22,7 +22,7 @@
</script>
{#if app}
<div class="border rounded-md p-2 w-full">
<div class="w-full">
<AppPreview
context={{
email: $userStore?.email,
frontend/src/routes/(root)/(logged)/user/(user)/workspaces/+page.svelte
+18 -3
View File
@@ -65,6 +65,8 @@
}
}
$: adminsInstance = workspaces?.find((x) => x.id == 'admins')
onMount(() => {
loadInvites()
loadWorkspaces()
@@ -83,13 +85,25 @@
</h2>
{#if $superadmin}
<div class="flex flex-row-reverse pb-4">
<div class="flex flex-row-reverse pb-2">
<Toggle
bind:checked={list_all_as_super_admin}
options={{ right: 'List all as superadmin' }}
options={{ right: 'List all workspaces as superadmin' }}
/>
</div>
{/if}
{#if adminsInstance}
<Button
btnClasses="w-full mt-2 mb-4"
color="light"
size="sm"
href="/user/switch_to_admins{rd ? `?rd=${encodeURIComponent(rd)}` : ''}"
variant="border"
>Manage Windmill on the workspace for superadmins
</Button>
{/if}
{#if workspaces && $usersWorkspaceStore}
{#if workspaces.length == 0}
<p class="text-sm text-gray-600 mt-2">
@@ -97,7 +111,7 @@
workspace.
</p>
{/if}
{#each workspaces as workspace}
{#each workspaces.filter((x) => x.id != 'admins') as workspace}
<label class="block pb-2">
<button
class="block w-full mx-auto py-1 px-2 rounded-md border border-gray-300
@@ -135,6 +149,7 @@
<Skeleton layout={[[2], 0.5]} />
{/each}
{/if}
<div class="flex flex-row-reverse pt-4">
<Button
size="sm"