Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
SSHOC
sshoc-marketplace-frontend
Commits
1f73bafe
Commit
1f73bafe
authored
Mar 06, 2021
by
Stefan Probst
Browse files
feat: allow reordering and deleting workflow steps
parent
a8ef25a9
Changes
1
Hide whitespace changes
Inline
Side-by-side
src/components/item/WorkflowStepsFormSection/WorkflowStepsFormSection.tsx
View file @
1f73bafe
...
...
@@ -19,7 +19,7 @@ export function WorkflowStepsFormSection(): JSX.Element {
return
(
<
section
className
=
"flex flex-col space-y-2"
>
<
strong
className
=
"mb-6 text-error-500"
>
Editing and
sor
ting workflow steps is not yet implemented.
Editing and
crea
ting workflow steps is not yet implemented.
</
strong
>
<
FormField
name
=
"label"
subscription
=
{
{
value
:
true
}
}
>
...
...
@@ -45,7 +45,7 @@ export function WorkflowStepsFormSection(): JSX.Element {
{
({
fields
})
=>
{
return
(
<
div
className
=
"flex flex-col ml-8 space-y-2"
>
{
fields
.
map
((
name
)
=>
{
{
fields
.
map
((
name
,
index
)
=>
{
return
(
<
FormField
key
=
{
name
}
...
...
@@ -59,14 +59,31 @@ export function WorkflowStepsFormSection(): JSX.Element {
{
input
.
value
}
</
h3
>
<
div
className
=
"flex self-end space-x-8 text-primary-750"
>
<
Button
variant
=
"link"
>
<
Button
onPress
=
{
()
=>
{
fields
.
move
(
index
,
Math
.
max
(
0
,
index
-
1
))
}
}
isDisabled
=
{
index
===
0
}
variant
=
"link"
>
<
Icon
icon
=
{
TriangleIcon
}
className
=
"w-2.5 h-2.5 transform rotate-180"
/>
<
span
>
Move up
</
span
>
</
Button
>
<
Button
variant
=
"link"
>
<
Button
onPress
=
{
()
=>
{
fields
.
move
(
index
,
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
Math
.
min
(
fields
.
length
!
-
1
,
index
+
1
),
)
}
}
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
isDisabled
=
{
index
===
fields
.
length
!
-
1
}
variant
=
"link"
>
<
Icon
icon
=
{
TriangleIcon
}
className
=
"w-2.5 h-2.5"
...
...
@@ -77,7 +94,12 @@ export function WorkflowStepsFormSection(): JSX.Element {
<
Icon
icon
=
{
PlusIcon
}
className
=
"w-2.5 h-2.5"
/>
<
span
>
Add a substep
</
span
>
</
Button
>
<
Button
variant
=
"link"
>
<
Button
onPress
=
{
()
=>
{
fields
.
remove
(
index
)
}
}
variant
=
"link"
>
<
Icon
icon
=
{
CrossIcon
}
className
=
"w-2.5 h-2.5"
/>
<
span
>
Delete
</
span
>
</
Button
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment