Allow empty scopes, improve deployment copy

This commit is contained in:
Matej Bačo
2024-08-20 15:26:41 +02:00
parent 1e31342a56
commit f08b7690c0
3 changed files with 33 additions and 36 deletions
@@ -102,8 +102,7 @@
});
$templateStepsComponents.set(2, {
label: 'Permissions',
component: TemplatePermissions,
disabled: !$template?.scopes?.length
component: TemplatePermissions
});
$templateStepsComponents.set(3, {
label: 'Variables',
@@ -33,12 +33,8 @@
<WizardStep {beforeSubmit}>
<svelte:fragment slot="title">Deployment</svelte:fragment>
<svelte:fragment slot="subtitle">
Connect your function to a Git repository for automatic deployments or deploy your function
using the CLI.
</svelte:fragment>
<h3>Automatic with Git <span class="inline-code">Recommended</span></h3>
<h3>Connect with Git <span class="inline-code">Recommended</span></h3>
<FormList gap={16} class="u-margin-block-start-8">
<LabelCard
name="behaviour"
@@ -58,11 +54,11 @@
</LabelCard>
</FormList>
<h3 class="u-margin-block-start-24">Manual with CLI</h3>
<h3 class="u-margin-block-start-24">Quick start</h3>
<ul class="u-margin-block-start-8">
<LabelCard name="behaviour" value="manual" bind:group={$templateConfig.repositoryBehaviour}>
<svelte:fragment slot="title">Create manually</svelte:fragment>
Deploy a function from a template and change the code using the CLI.
<svelte:fragment slot="title">Connect later</svelte:fragment>
Deploy now and continue development via CLI, or connect Git from your function settings.
</LabelCard>
</ul>
</WizardStep>
@@ -57,30 +57,32 @@
</span>
</div>
</FormList>
<h3 class="label u-margin-block-start-48">Function scopes</h3>
<FormList class="u-margin-block-start-16">
{#each templateScopes as scope, i}
<div class="user-profile">
<span class="avatar" style:--p-text-size="1rem">
<span class={`icon-${scope.icon}`} />
</span>
<span class="user-profile-info u-flex u-main-space-between u-gap-16">
<div>
<p class="name u-bold">{scope.scope}</p>
<p class="text u-margin-block-start-4">{scope.description}</p>
</div>
<InputChoice
type="switchbox"
id={scope.scope}
label={scope.scope}
showLabel={false}
bind:value={scope.active}>
</InputChoice>
</span>
</div>
{#if i < templateScopes.length - 1}
<div class="with-separators"></div>
{/if}
{/each}
</FormList>
{#if templateScopes.length > 0}
<h3 class="label u-margin-block-start-48">Function scopes</h3>
<FormList class="u-margin-block-start-16">
{#each templateScopes as scope, i}
<div class="user-profile">
<span class="avatar" style:--p-text-size="1rem">
<span class={`icon-${scope.icon}`} />
</span>
<span class="user-profile-info u-flex u-main-space-between u-gap-16">
<div>
<p class="name u-bold">{scope.scope}</p>
<p class="text u-margin-block-start-4">{scope.description}</p>
</div>
<InputChoice
type="switchbox"
id={scope.scope}
label={scope.scope}
showLabel={false}
bind:value={scope.active}>
</InputChoice>
</span>
</div>
{#if i < templateScopes.length - 1}
<div class="with-separators"></div>
{/if}
{/each}
</FormList>
{/if}
</WizardStep>