Commit5c682a2

committed

add processes ui to loading page

Signed-off-by: shmck <shawn.j.mckay@gmail.com>

1 parent526f5c9 commit5c682a2Copy full SHA for 5c682a2

File tree

+44

-21

lines changed

+44

-21

lines changed

Lines changed: 1 addition & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,7 @@ import { css, jsx } from '@emotion/core'`
`5`	`5`	`importTestMessagefrom'./TestMessage'`
`6`	`6`
`7`	`7`	`interfaceProps{`
`8`		`-testStatus:T.TestStatus\|null`
	`8`	`+testStatus?:T.TestStatus\|null`
`9`	`9`	`processes:T.ProcessEvent[]`
`10`	`10`	`}`
`11`	`11`

Lines changed: 15 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -2,6 +2,7 @@ import * as React from 'react'`
`2`	`2`	`import*asTfrom'typings'`
`3`	`3`	`import{css,jsx}from'@emotion/core'`
`4`	`4`	`importLoadingfrom'../../components/Loading'`
	`5`	`+importProcessMessagesfrom'components/ProcessMessages'`
`5`	`6`
`6`	`7`	`interfaceProps{`
`7`	`8`	`text:string`
`@@ -12,11 +13,19 @@ const styles = {`
`12`	`13`	`page:{`
`13`	`14`	`position:'relative'as'relative',`
`14`	`15`	`display:'flex',`
	`16`	`+flexDirection:'column',`
`15`	`17`	`alignItems:'center',`
`16`	`18`	`justifyContent:'center',`
`17`	`19`	`height:'100%',`
`18`	`20`	`width:'100%',`
`19`	`21`	`},`
	`22`	`+processes:{`
	`23`	`+padding:'0 1rem',`
	`24`	`+position:'fixed'as'fixed',`
	`25`	`+bottom:0,`
	`26`	`+left:0,`
	`27`	`+right:0,`
	`28`	`+},`
`20`	`29`	`}`
`21`	`30`
`22`	`31`	`constLoadingPage=({ text, processes}:Props)=>{`
`@@ -37,11 +46,14 @@ const LoadingPage = ({ text, processes }: Props) => {`
`37`	`46`	`returnnull`
`38`	`47`	`}`
`39`	`48`
`40`		`-constmessage:string=processes&&processes.length ?processes[0].title :text`
`41`		`-`
`42`	`49`	`return(`
`43`	`50`	`<divcss={styles.page}>`
`44`		`-<Loadingmessage={message}/>`
	`51`	`+<Loadingmessage={text}/>`
	`52`	`+{processes&&processes.length&&(`
	`53`	`+<divcss={styles.processes}>`
	`54`	`+<ProcessMessagesprocesses={processes}/>`
	`55`	`+</div>`
	`56`	`+)}`
`45`	`57`	`</div>`
`46`	`58`	`)`
`47`	`59`	`}`

Lines changed: 16 additions & 16 deletions

Original file line number	Diff line number	Diff line change
`@@ -29,6 +29,22 @@ export const createMachine = (options: any) => {`
`29`	`29`	`processes:[],`
`30`	`30`	`testStatus:null,`
`31`	`31`	`},`
	`32`	`+on:{`
	`33`	`+// track commands`
	`34`	`+COMMAND_START:{`
	`35`	`+actions:['commandStart'],`
	`36`	`+},`
	`37`	`+COMMAND_SUCCESS:{`
	`38`	`+actions:['commandSuccess'],`
	`39`	`+},`
	`40`	`+COMMAND_FAIL:{`
	`41`	`+actions:['commandFail'],`
	`42`	`+},`
	`43`	`+ERROR:{`
	`44`	`+// TODO: missing clearError`
	`45`	`+actions:['setError'],`
	`46`	`+},`
	`47`	`+},`
`32`	`48`	`states:{`
`33`	`49`	`Setup:{`
`34`	`50`	`initial:'Startup',`
`@@ -121,22 +137,6 @@ export const createMachine = (options: any) => {`
`121`	`137`	`Tutorial:{`
`122`	`138`	`id:'tutorial',`
`123`	`139`	`initial:'Level',`
`124`		`-on:{`
`125`		`-// track commands`
`126`		`-COMMAND_START:{`
`127`		`-actions:['commandStart'],`
`128`		`-},`
`129`		`-COMMAND_SUCCESS:{`
`130`		`-actions:['commandSuccess'],`
`131`		`-},`
`132`		`-COMMAND_FAIL:{`
`133`		`-actions:['commandFail'],`
`134`		`-},`
`135`		`-ERROR:{`
`136`		`-// TODO: missing clearError`
`137`		`-actions:['setError'],`
`138`		`-},`
`139`		`-},`
`140`	`140`	`states:{`
`141`	`141`	`LoadNext:{`
`142`	`142`	`id:'tutorial-load-next',`

Lines changed: 12 additions & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -1,8 +1,19 @@`
`1`	`1`	`import{storiesOf}from'@storybook/react'`
	`2`	`+import*asTfrom'../../typings'`
`2`	`3`	`importReactfrom'react'`
`3`	`4`	`importLoadingPagefrom'../src/containers/Loading'`
`4`	`5`	`importSideBarDecoratorfrom'./utils/SideBarDecorator'`
`5`	`6`
`6`	`7`	`storiesOf('Components',module)`
`7`	`8`	`.addDecorator(SideBarDecorator)`
`8`		`-.add('Loading',()=><LoadingPagetext="Content"context={{}}/>)`
	`9`	`+.add('Loading',()=><LoadingPagetext="Content"/>)`
	`10`	`+.add('Loading processes',()=>{`
	`11`	`+constprocesses:T.ProcessEvent[]=[`
	`12`	`+{`
	`13`	`+title:'title',`
	`14`	`+description:'description...',`
	`15`	`+status:'RUNNING',`
	`16`	`+},`
	`17`	`+]`
	`18`	`+return<LoadingPagetext="Content"processes={processes}/>`
	`19`	`+})`

Comments

(0)