Page MenuHomePhabricator

add cancel button to active run view

Authored by alangenfeld on Oct 25 2019, 5:27 PM.



and various other changes to make it work correctly

Test Plan
  • start a run of the sleepy pipeline in examples with long times
  • cancel button shows up
  • click it
  • run fails
  • cancel button goes away

Introduce an error and verify toast shows up

Diff Detail

R1 dagster
Automatic diff as part of commit; lint not applicable.
Automatic diff as part of commit; unit tests not applicable.

Event Timeline

alangenfeld created this revision.Oct 25 2019, 5:27 PM
alangenfeld added inline comments.Oct 25 2019, 5:37 PM

@bengotow how do i margin left 6px this without having to create a new style component? I tried with style= and couldnt get it

alangenfeld updated this revision to Diff 6022.Oct 25 2019, 5:59 PM

more fixes

bengotow accepted this revision.Oct 25 2019, 6:17 PM
bengotow added inline comments.

Ahh man, so this is a bit of a pain - the BlueprintJS components have a className property but no style property, which means you can use styled-components like this (which implicitly creates and passes in a className):

const MarginButton = styled(Button)`

But... that sucks. Instead I'd recommend adding a div in between the two buttons with a small width. Because these are inside a flexbox, this should achieve what you want:

  onClick={() => this.onReexecute(reexecuteMutation)}
{run && run.canCancel && (
    <div style={{ minWidth: 15, flex: 1 }} />
    <CancelRunButton run={run} />

(The empty <> are a React fragment, just lets you return more than one JSX item from an expression without creating a div or other container in the DOM.)

This revision is now accepted and ready to land.Oct 25 2019, 6:17 PM
alangenfeld updated this revision to Diff 6024.Oct 25 2019, 6:25 PM

add spacer div

This revision was automatically updated to reflect the committed changes.