From 63f259edcf606c711fa1c24ae4d07903ce6ff208 Mon Sep 17 00:00:00 2001 From: Guilhem Date: Mon, 31 Mar 2025 17:07:36 +0100 Subject: [PATCH] use scroll for variables page --- .../(root)/(logged)/variables/+page.svelte | 629 +++++++++--------- 1 file changed, 317 insertions(+), 312 deletions(-) diff --git a/frontend/src/routes/(root)/(logged)/variables/+page.svelte b/frontend/src/routes/(root)/(logged)/variables/+page.svelte index f4d483d4e6..4f1d98145d 100644 --- a/frontend/src/routes/(root)/(logged)/variables/+page.svelte +++ b/frontend/src/routes/(root)/(logged)/variables/+page.svelte @@ -37,6 +37,7 @@ EyeOff, Circle } from 'lucide-svelte' + import Scroll from '$lib/components/Scroll.svelte' type ListableVariableW = ListableVariable & { canWrite: boolean } @@ -150,326 +151,330 @@

Page not available for operators

{:else} - - -
- {#if tab == 'contextual' && ($userStore?.is_admin || $userStore?.is_super_admin)} - - {:else} - - {/if} -
-
- - - - { - loadVariables() - }} - /> - - - -
- - Workspace + + + +
+ {#if tab == 'contextual' && ($userStore?.is_admin || $userStore?.is_super_admin)} + + {:else} + + {/if}
- - -
- - Contextual - - Contextual variables are passed as environment variables when running a script and - depends on the execution context. - -
-
- - {#if tab == 'workspace'} -
- -
-
- -
-
- {#if !filteredItems} - - {#each new Array(3) as _} - - {/each} - {:else if filteredItems.length == 0} -
-
No variables found
-
- Try changing the filters or creating a new variable -
+ + + + + { + loadVariables() + }} + /> + + + +
+ + Workspace
- {:else} - - - - - Path - Value - Description - - - - - - {#each filteredItems as { path, value, is_secret, description, extra_perms, canWrite, account, is_refreshed, is_expired, refresh_error, is_linked, marked }} - - - - - - variableEditor.editVariable(path)} - href="#{path}" - > - {#if marked} - {@html marked} - {:else} - {path} - {/if} - - - - -
- {#if value} - {truncate(value, 20)} - {:else} - ∗∗∗∗ - {/if} -
- {#if is_secret} - - - This item is secret - - {/if} -
-
- - {truncate(description ?? '', 50)} - - - -
- {#if is_linked} - - -
- This variable is linked with a resource of the same path. They are - deleted and renamed together. -
-
- {/if} - {#if account} - - -
- This OAuth token will be kept up-to-date in the background by Windmill - using its refresh token -
-
- {/if} - - {#if is_refreshed} -
- {#if refresh_error} - -
- - -
- -
- Latest exchange of the refresh token did not succeed. Error: {refresh_error} -
-
- {:else if is_expired} - - -
- The access_token is expired, it will get renewed the next time this - variable is fetched or you can request is to be refreshed in the - dropdown on the right. -
-
- {:else} - - -
- The variable was connected through OAuth and the token is not - expired. -
-
- {/if} -
- {/if} -
-
- - { - let owner = isOwner(path, $userStore, $workspaceStore) - return [ - { - displayName: 'Edit', - icon: Pen, - action: () => variableEditor.editVariable(path), - disabled: !canWrite - }, - { - displayName: 'Delete', - icon: Trash, - type: 'delete', - action: (event) => { - if (event['shiftKey']) { - deleteVariable(path, account) - } else { - deleteConfirmedCallback = () => { - deleteVariable(path, account) - } - } - }, - disabled: !owner - }, - ...(isDeployable( - is_secret ? 'secret' : 'variable', - path, - deployUiSettings - ) - ? [ - { - displayName: 'Deploy to prod/staging', - icon: FileUp, - action: () => { - deploymentDrawer.openDrawer(path, 'variable') - } - } - ] - : []), - { - displayName: owner ? 'Share' : 'See Permissions', - action: () => { - shareModal.openDrawer(path, 'variable') - }, - icon: Share - }, - ...(account != undefined - ? [ - { - displayName: 'Refresh token', - icon: RefreshCw, - action: async () => { - await OauthService.refreshToken({ - workspace: $workspaceStore ?? '', - id: account ?? 0, - requestBody: { - path - } - }) - sendUserToast('Token refreshed') - loadVariables() - } - } - ] - : []) - ] - }} - /> - -
- {/each} - -
- {/if} -
- {:else if tab == 'contextual'} -
- {#if loading.contextual} - - {#each new Array(8) as _} - - {/each} - {:else} - - {#if contextualVariables.filter((x) => x.is_custom).length === 0} + + +
+ + Contextual + + Contextual variables are passed as environment variables when running a script and + depends on the execution context. + +
+
+ + {#if tab == 'workspace'} +
+ +
+
+ +
+
+ {#if !filteredItems} + + {#each new Array(3) as _} + + {/each} + {:else if filteredItems.length == 0}
-
No custom contextual variables found
+
No variables found
+
+ Try changing the filters or creating a new variable +
{:else} - x.is_custom)} - keys={['name', 'value']} - getRowActions={$userStore?.is_admin || $userStore?.is_super_admin - ? (row) => { - return [ - { - displayName: 'Edit', - action: () => contextualVariableEditor.editVariable(row.name, row.value) - }, - { - displayName: 'Delete', - type: 'delete', - action: () => { - deleteContextualVariable(row) + + + + + Path + Value + Description + + + + + + {#each filteredItems as { path, value, is_secret, description, extra_perms, canWrite, account, is_refreshed, is_expired, refresh_error, is_linked, marked }} + + + + + + variableEditor.editVariable(path)} + href="#{path}" + > + {#if marked} + {@html marked} + {:else} + {path} + {/if} + + + + +
+ {#if value} + {truncate(value, 20)} + {:else} + ∗∗∗∗ + {/if} +
+ {#if is_secret} + + + This item is secret + + {/if} +
+
+ + {truncate(description ?? '', 50)} + + + +
+ {#if is_linked} + + +
+ This variable is linked with a resource of the same path. They are + deleted and renamed together. +
+
+ {/if} + {#if account} + + +
+ This OAuth token will be kept up-to-date in the background by Windmill + using its refresh token +
+
+ {/if} + + {#if is_refreshed} +
+ {#if refresh_error} + +
+ + +
+ +
+ Latest exchange of the refresh token did not succeed. Error: {refresh_error} +
+
+ {:else if is_expired} + + +
+ The access_token is expired, it will get renewed the next time + this variable is fetched or you can request is to be refreshed in + the dropdown on the right. +
+
+ {:else} + + +
+ The variable was connected through OAuth and the token is not + expired. +
+
+ {/if} +
+ {/if} +
+
+ + { + let owner = isOwner(path, $userStore, $workspaceStore) + return [ + { + displayName: 'Edit', + icon: Pen, + action: () => variableEditor.editVariable(path), + disabled: !canWrite + }, + { + displayName: 'Delete', + icon: Trash, + type: 'delete', + action: (event) => { + if (event['shiftKey']) { + deleteVariable(path, account) + } else { + deleteConfirmedCallback = () => { + deleteVariable(path, account) + } + } + }, + disabled: !owner + }, + ...(isDeployable( + is_secret ? 'secret' : 'variable', + path, + deployUiSettings + ) + ? [ + { + displayName: 'Deploy to prod/staging', + icon: FileUp, + action: () => { + deploymentDrawer.openDrawer(path, 'variable') + } + } + ] + : []), + { + displayName: owner ? 'Share' : 'See Permissions', + action: () => { + shareModal.openDrawer(path, 'variable') + }, + icon: Share + }, + ...(account != undefined + ? [ + { + displayName: 'Refresh token', + icon: RefreshCw, + action: async () => { + await OauthService.refreshToken({ + workspace: $workspaceStore ?? '', + id: account ?? 0, + requestBody: { + path + } + }) + sendUserToast('Token refreshed') + loadVariables() + } + } + ] + : []) + ] + }} + /> + +
+ {/each} + +
+ {/if} +
+ {:else if tab == 'contextual'} +
+ {#if loading.contextual} + + {#each new Array(8) as _} + + {/each} + {:else} + + {#if contextualVariables.filter((x) => x.is_custom).length === 0} +
+
No custom contextual variables found
+
+ {:else} + x.is_custom)} + keys={['name', 'value']} + getRowActions={$userStore?.is_admin || $userStore?.is_super_admin + ? (row) => { + return [ + { + displayName: 'Edit', + action: () => contextualVariableEditor.editVariable(row.name, row.value) + }, + { + displayName: 'Delete', + type: 'delete', + action: () => { + deleteContextualVariable(row) + } } - } - ] - } - : undefined} + ] + } + : undefined} + /> + {/if} + + !x.is_custom)} + keys={['name', 'value', 'description']} /> {/if} - - !x.is_custom)} - keys={['name', 'value', 'description']} - /> - {/if} -
- {/if} - +
+ {/if} + + {/if}