fix(frontend): Fix operators actions + small UI fixes (#3157)

* feat(frontend): fix tree view expand all button + operator mode actions

* feat(frontend): fix deploy workspace when user have no access to target workspace
This commit is contained in:
Faton Ramadani
2024-02-06 11:37:00 +01:00
committed by GitHub
parent 2d22004dc9
commit 7af751e557
8 changed files with 90 additions and 43 deletions
@@ -55,6 +55,7 @@
notSet = true
}
})
$: workspaceToDeployTo && reload(initialPath)
async function reload(path: string) {
@@ -65,6 +66,7 @@
seeTarget = true
} catch {
seeTarget = false
return
}
const allDeps = await getDependencies(kind, path)
@@ -11,6 +11,7 @@
href?: string
disabled?: boolean
type?: 'action' | 'delete'
hide?: boolean | undefined
}
export let items: Item[] | (() => Item[]) = []
@@ -18,9 +19,9 @@
function computeItems(): Item[] {
if (typeof items === 'function') {
return items()
return (items() ?? []).filter((item) => !item.hide)
} else {
return items
return items.filter((item) => !item.hide)
}
}
</script>
+2 -2
View File
@@ -302,7 +302,7 @@
{#if meta != undefined}
<div class="flex gap-x-4 shrink">
<!-- svelte-ignore a11y-label-has-associated-control -->
<label class="block">
<div class="block">
<span class="text-secondary text-sm whitespace-nowrap">&nbsp;</span>
<ToggleButtonGroup
@@ -342,7 +342,7 @@
label="Folder"
/>
</ToggleButtonGroup>
</label>
</div>
{#if meta.ownerKind === 'user'}
<label class="block shrink min-w-0">
<span class="text-secondary text-sm">User</span>
@@ -6,9 +6,9 @@
import JsonEditor from './settingsPanel/inputEditor/JsonEditor.svelte'
import { AppService, DraftService } from '$lib/gen'
import { sendUserToast } from '$lib/toast'
import { workspaceStore } from '$lib/stores'
import { userStore, workspaceStore } from '$lib/stores'
import { createEventDispatcher } from 'svelte'
import { Loader2, Save } from 'lucide-svelte'
import { Globe, Loader2, Save } from 'lucide-svelte'
let jsonViewerDrawer: Drawer
@@ -86,9 +86,14 @@
{/if}
<svelte:fragment slot="actions">
<Button on:click={saveDraft} startIcon={{ icon: Save }}>Save as draft</Button>
<Button on:click={saveApp} startIcon={{ icon: Save }}>Deploy</Button>
{#if !$userStore?.operator}
<Button on:click={saveDraft} startIcon={{ icon: Save }} color="dark" size="xs">
Save as draft
</Button>
<Button on:click={saveApp} startIcon={{ icon: Globe }} color="dark" size="xs">
Deploy
</Button>
{/if}
</svelte:fragment>
</DrawerContent>
</Drawer>
@@ -21,12 +21,13 @@
History,
Pen,
Share,
Trash
Trash,
Clipboard
} from 'lucide-svelte'
import { goto } from '$app/navigation'
import { page } from '$app/stores'
import type DeployWorkspaceDrawer from '$lib/components/DeployWorkspaceDrawer.svelte'
import { DELETE } from '$lib/utils'
import { DELETE, copyToClipboard } from '$lib/utils'
import AppDeploymentHistory from '$lib/components/apps/editor/AppDeploymentHistory.svelte'
import AppJsonEditor from '$lib/components/apps/editor/AppJsonEditor.svelte'
@@ -142,10 +143,11 @@
}
},
type: 'delete',
disabled: !canWrite
disabled: !canWrite,
hide: $userStore?.operator
},
{
displayName: 'View/Edit JSON',
displayName: $userStore?.operator ? 'View JSON' : 'View/Edit JSON',
icon: File,
action: () => {
loadAppJson()
@@ -157,7 +159,8 @@
{
displayName: 'Duplicate/Fork',
icon: GitFork,
href: `/apps/add?template=${path}`
href: `/apps/add?template=${path}`,
hide: $userStore?.operator
},
{
displayName: 'Move/Rename',
@@ -165,17 +168,19 @@
action: () => {
moveDrawer.openDrawer(path, summary, 'app')
},
disabled: !canWrite
disabled: !canWrite,
hide: $userStore?.operator
},
{
displayName: 'Deploy to staging/prod',
icon: Globe,
action: () => {
deploymentDrawer.openDrawer(path, 'app')
}
},
hide: $userStore?.operator
},
{
displayName: 'View/Edit JSON',
displayName: $userStore?.operator ? 'View JSON' : 'View/Edit JSON',
icon: FileJson,
action: () => {
loadAppJson()
@@ -184,13 +189,22 @@
{
displayName: 'Deployments',
icon: History,
action: () => loadDeployements()
action: () => loadDeployements(),
hide: $userStore?.operator
},
{
displayName: canWrite ? 'Share' : 'See Permissions',
icon: Share,
action: () => {
shareModal.openDrawer && shareModal.openDrawer(path, 'app')
},
hide: $userStore?.operator
},
{
displayName: 'Copy path',
icon: Clipboard,
action: () => {
copyToClipboard(path)
}
},
...(execution_mode == 'anonymous'
@@ -226,7 +240,8 @@
dispatch('change')
},
type: DELETE,
disabled: !canWrite
disabled: !canWrite,
hide: $userStore?.operator
}
]
: []),
@@ -247,7 +262,8 @@
}
},
type: 'delete',
disabled: !canWrite
disabled: !canWrite,
hide: $userStore?.operator
}
]
}}
@@ -146,7 +146,8 @@
}
},
type: 'delete',
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
}
]
}
@@ -154,7 +155,8 @@
{
displayName: 'Duplicate/Fork',
icon: GitFork,
href: `/flows/add?template=${path}`
href: `/flows/add?template=${path}`,
hide: $userStore?.operator
},
{
displayName: 'View runs',
@@ -164,7 +166,8 @@
{
displayName: 'Audit logs',
icon: Eye,
href: `/audit_logs?resource=${path}`
href: `/audit_logs?resource=${path}`,
hide: $userStore?.operator
},
{
displayName: 'Move/Rename',
@@ -172,7 +175,8 @@
action: () => {
moveDrawer.openDrawer(path, flow.summary, 'flow')
},
disabled: !owner || archived
disabled: !owner || archived,
hide: $userStore?.operator
},
{
displayName: 'Copy path',
@@ -187,7 +191,8 @@
action: () => {
deploymentDrawer.openDrawer(path, 'flow')
},
disabled: archived
disabled: archived,
hide: $userStore?.operator
},
{
displayName: 'Schedule',
@@ -195,14 +200,16 @@
action: () => {
scheduleEditor?.openNew(true, path)
},
disabled: archived
disabled: archived,
hide: $userStore?.operator
},
{
displayName: owner ? 'Share' : 'See Permissions',
icon: Share,
action: () => {
shareModal.openDrawer && shareModal.openDrawer(path, 'flow')
}
},
hide: $userStore?.operator
},
{
displayName: archived ? 'Unarchive' : 'Archive',
@@ -211,7 +218,8 @@
path && archiveFlow(path, !archived)
},
type: 'delete',
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
},
...(has_draft
? [
@@ -227,7 +235,8 @@
dispatch('change')
},
type: DELETE,
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
}
]
: []),
@@ -245,7 +254,8 @@
}
},
type: 'delete',
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
}
]
}}
@@ -183,7 +183,8 @@
{
displayName: 'Duplicate/Fork',
icon: GitFork,
href: `/scripts/add?template=${script.path}`
href: `/scripts/add?template=${script.path}`,
hide: $userStore?.operator
},
{
displayName: 'Move/Rename',
@@ -191,7 +192,8 @@
action: () => {
moveDrawer.openDrawer(script.path, script.summary, 'script')
},
disabled: !owner || script.archived
disabled: !owner || script.archived,
hide: $userStore?.operator
},
{
displayName: 'Deploy to staging/prod',
@@ -199,7 +201,8 @@
action: () => {
deploymentDrawer.openDrawer(script.path, 'script')
},
disabled: script.archived
disabled: script.archived,
hide: $userStore?.operator
},
{
displayName: 'View runs',
@@ -209,7 +212,8 @@
{
displayName: 'Audit logs',
icon: Eye,
href: `/audit_logs?resource=${script.path}`
href: `/audit_logs?resource=${script.path}`,
hide: $userStore?.operator
},
{
displayName: 'Schedule',
@@ -217,7 +221,8 @@
action: () => {
scheduleEditor.openNew(false, script.path)
},
disabled: script.archived
disabled: script.archived,
hide: $userStore?.operator
},
{
displayName: owner ? 'Share' : 'See Permissions',
@@ -225,7 +230,8 @@
action: () => {
shareModal.openDrawer && shareModal.openDrawer(script.path, 'script')
},
disabled: script.archived
disabled: script.archived,
hide: $userStore?.operator
},
{
displayName: 'Copy path',
@@ -243,7 +249,8 @@
: script.path && archiveScript(script.path)
},
type: 'delete',
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
},
...(script.has_draft
@@ -260,7 +267,8 @@
dispatch('change')
},
type: DELETE,
disabled: !owner
disabled: !owner,
hide: $userStore?.operator
}
]
: []),
@@ -279,7 +287,8 @@
}
},
type: dlt,
disabled: !script.canWrite
disabled: !script.canWrite,
hide: $userStore?.operator
}
]
: [])
@@ -14,7 +14,7 @@
} from '$lib/gen'
import { userStore, workspaceStore } from '$lib/stores'
import type uFuzzy from '@leeoniya/ufuzzy'
import { Code2, LayoutDashboard, SearchCode } from 'lucide-svelte'
import { Code2, FoldVertical, LayoutDashboard, SearchCode, UnfoldVertical } from 'lucide-svelte'
export let filter = ''
export let subtab: 'flow' | 'script' | 'app' = 'script'
@@ -411,11 +411,15 @@
<Toggle size="xs" bind:checked={treeView} options={{ right: 'Tree view' }} />
{#if treeView}
<Button
wrapperClasses="mb-0.5"
size="xs2"
variant="contained"
wrapperClasses="mt-1"
btnClasses="py-0 h-6"
size="xs"
variant="border"
color="light"
on:click={() => (collapseAll = !collapseAll)}
startIcon={{
icon: collapseAll ? UnfoldVertical : FoldVertical
}}
>
{#if collapseAll}
Expand all