Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit17fa85f

Browse files
committed
refactor starting pages
1 parent18973c4 commit17fa85f

File tree

11 files changed

+88
-42
lines changed

11 files changed

+88
-42
lines changed

‎src/channel/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ class Channel implements Channel {
5757

5858
// new tutorial
5959
if(!tutorial||!tutorial.id||!tutorial.version){
60-
this.send({type:'NEW_TUTORIAL'})
60+
this.send({type:'START_NEW_TUTORIAL'})
6161
return
6262
}
6363

@@ -66,12 +66,12 @@ class Channel implements Channel {
6666

6767
if(progress.complete){
6868
// tutorial is already complete
69-
this.send({type:'NEW_TUTORIAL'})
69+
this.send({type:'START_NEW_TUTORIAL'})
7070
return
7171
}
72-
72+
console.log('send LOAD_STORED_TUTORIAL')
7373
// communicate to client the tutorial & stepProgress state
74-
this.send({type:'CONTINUE_TUTORIAL',payload:{ tutorial, progress, position}})
74+
this.send({type:'LOAD_STORED_TUTORIAL',payload:{ tutorial, progress, position}})
7575

7676
return
7777
// clear tutorial local storage

‎typings/index.d.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -66,12 +66,13 @@ export interface MachineEvent {
6666

6767
exportinterfaceMachineStateSchema{
6868
states:{
69-
Start:{
69+
Setup:{
7070
states:{
7171
Startup:{}
7272
Authenticate:{}
7373
Error:{}
74-
NewOrContinue:{}
74+
LoadStoredTutorial:{}
75+
Start:{}
7576
SelectTutorial:{}
7677
LoadTutorialSummary:{}
7778
Summary:{}

‎web-app/src/Routes.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import*asReactfrom'react'
22
importuseRouterfrom'./components/Router'
33
importWorkspacefrom'./components/Workspace'
4-
importContinuePagefrom'./containers/Continue'
5-
importLoadingPagefrom'./containers/LoadingPage'
4+
importLoadingPagefrom'./containers/Loading'
5+
importStartPagefrom'./containers/Start'
66
importNewPagefrom'./containers/New'
77
importOverviewPagefrom'./containers/Overview'
88
importCompletedPagefrom'./containers/Tutorial/CompletedPage'
@@ -13,26 +13,26 @@ const Routes = () => {
1313
return(
1414
<Workspace>
1515
<Router>
16-
{/*Start */}
17-
<Routepath={['Start.Startup','Start.Authenticate','Start.NewOrContinue']}>
16+
{/*Setup */}
17+
<Routepath={['Setup.Startup','Setup.Authenticate','Setup.LoadStoredTutorial']}>
1818
<LoadingPagetext="Launching..."context={context}/>
1919
</Route>
20-
<Routepath="Start.ContinueTutorial">
21-
<ContinuePagesend={send}context={context}/>
20+
<Routepath="Setup.Start">
21+
<StartPagesend={send}context={context}/>
2222
</Route>
23-
<Routepath={['Start.LoadTutorialSummary','Start.LoadTutorialData','Start.SetupNewTutorial']}>
23+
<Routepath={['Setup.LoadTutorialSummary','Setup.LoadTutorialData','Setup.SetupNewTutorial']}>
2424
<LoadingPagetext="Loading Tutorial..."context={context}/>
2525
</Route>
26-
<Routepath="Start.Error">
26+
<Routepath="Setup.Error">
2727
<LoadingPagetext="Error"context={context}/>
2828
</Route>
29-
<Routepath="Start.SelectTutorial">
29+
<Routepath="Setup.SelectTutorial">
3030
<NewPagesend={send}context={context}/>
3131
</Route>
32-
<Routepath="Start.Summary">
32+
<Routepath="Setup.Summary">
3333
<OverviewPagesend={send}context={context}/>
3434
</Route>
35-
<Routepath="Start.SetupNewTutorial">
35+
<Routepath="Setup.SetupNewTutorial">
3636
<LoadingPagetext="Configuring tutorial..."context={context}/>
3737
</Route>
3838
{/* Tutorial */}

‎web-app/src/containers/LoadingPage.tsxrenamed to‎web-app/src/containers/Loading/LoadingPage.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import*asReactfrom'react'
22
import*asTfrom'typings'
33
import{css,jsx}from'@emotion/core'
4-
importLoadingfrom'../components/Loading'
5-
importMessagefrom'../components/Message'
4+
importLoadingfrom'../../components/Loading'
5+
importMessagefrom'../../components/Message'
66

77
interfaceProps{
88
text:string
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import*asReactfrom'react'
2+
import*asTfrom'typings'
3+
import{css,jsx}from'@emotion/core'
4+
importLoadingfrom'../../components/Loading'
5+
importMessagefrom'../../components/Message'
6+
7+
interfaceProps{
8+
text:string
9+
context:T.MachineContext
10+
}
11+
12+
conststyles={
13+
page:{
14+
position:'relative'as'relative',
15+
display:'flex',
16+
flexDirection:'column'as'column',
17+
alignItems:'center',
18+
justifyContent:'center',
19+
width:'100%',
20+
},
21+
}
22+
23+
constLoadingPage=({ text, context}:Props)=>{
24+
const{ error}=context
25+
if(error){
26+
return(
27+
<divcss={styles.page}>
28+
<Messagetype="error"title={error.title}content={error.description}/>
29+
</div>
30+
)
31+
}
32+
return(
33+
<divcss={styles.page}>
34+
<Loadingtext={text}/>
35+
</div>
36+
)
37+
}
38+
39+
exportdefaultLoadingPage

‎web-app/src/containers/New/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import * as T from 'typings'
44
import*asGfrom'typings/graphql'
55
importErrorViewfrom'../../components/Error'
66
importqueryTutorialsfrom'../../services/apollo/queries/tutorials'
7-
importLoadingPagefrom'../LoadingPage'
7+
importLoadingPagefrom'../Loading'
88
importNewPagefrom'./NewPage'
99

1010
interfaceContainerProps{

‎web-app/src/containers/Overview/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import * as G from 'typings/graphql'
55
importErrorViewfrom'../../components/Error'
66
importqueryTutorialfrom'../../services/apollo/queries/tutorial'
77
importOverviewPagefrom'./OverviewPage'
8-
importLoadingPagefrom'../../containers/LoadingPage'
8+
importLoadingPagefrom'../Loading'
99

1010
interfacePageProps{
1111
context:CR.MachineContext

‎web-app/src/containers/Launch/index.tsxrenamed to‎web-app/src/containers/Start/index.tsx

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,19 @@ import * as G from 'typings/graphql'
44
import{Badge}from'@alifd/next'
55
import{css,jsx}from'@emotion/core'
66
importButtonfrom'../../components/Button'
7-
importCardfrom'../../components/Card'
87

98
conststyles={
109
page:{
1110
position:'relative'as'relative',
12-
display:'flex',
13-
flexDirection:'column',
11+
display:'flex'as'flex',
12+
flexDirection:'column'as'column',
1413
width:'100%',
1514
height:window.innerHeight,
1615
},
1716
header:{
1817
flex:1,
1918
display:'flex'as'flex',
20-
flexDirection:'column',
19+
flexDirection:'column'as'column',
2120
justifyContent:'flex-end'as'flex-end',
2221
alignItems:'center'as'center',
2322
backgroundColor:'#EBEBEB',
@@ -54,7 +53,7 @@ interface Props {
5453
tutorial?:G.Tutorial
5554
}
5655

57-
exportconstLaunchPage=(props:Props)=>(
56+
exportconstStartPage=(props:Props)=>(
5857
<divcss={styles.page}>
5958
<divcss={styles.header}>
6059
<Badgecontent="beta"style={styles.betaBadge}>
@@ -85,11 +84,11 @@ interface ContainerProps {
8584
send(action:CR.Action|string):void
8685
}
8786

88-
constLaunchPageContainer=({ context, send}:ContainerProps)=>{
89-
const{tutorial}=context
87+
constStartPageContainer=({ context, send}:ContainerProps)=>{
88+
consttutorial=context.tutorial||undefined
9089
return(
91-
<LaunchPageonContinue={()=>send('TUTORIAL_START')}onNew={()=>send('TUTORIAL_SELECT')}tutorial={tutorial}/>
90+
<StartPageonContinue={()=>send('TUTORIAL_START')}onNew={()=>send('TUTORIAL_SELECT')}tutorial={tutorial}/>
9291
)
9392
}
9493

95-
exportdefaultLaunchPageContainer
94+
exportdefaultStartPageContainer

‎web-app/src/services/state/actions/context.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,9 @@ const contextActions: ActionFunctionMap<T.MachineContext, T.MachineEvent> = {
1515
},
1616
}),
1717
//@ts-ignore
18-
continueTutorial:assign({
18+
storeContinuedTutorial:assign({
1919
tutorial:(context:T.MachineContext,event:T.MachineEvent)=>{
20+
console.log('storeContinuedTutorial')
2021
returnevent.payload.tutorial
2122
},
2223
progress:(context:T.MachineContext,event:T.MachineEvent)=>{

‎web-app/src/services/state/machine.ts

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export const createMachine = (options: any) => {
1616
returnMachine<CR.MachineContext,CR.MachineStateSchema,CR.MachineEvent>(
1717
{
1818
id:'root',
19-
initial:'Start',
19+
initial:'Setup',
2020
context:{
2121
error:null,
2222
env:{machineId:'',sessionId:'',token:''},
@@ -31,7 +31,7 @@ export const createMachine = (options: any) => {
3131
testStatus:null,
3232
},
3333
states:{
34-
Start:{
34+
Setup:{
3535
initial:'Startup',
3636
states:{
3737
Startup:{
@@ -46,7 +46,7 @@ export const createMachine = (options: any) => {
4646
Authenticate:{
4747
invoke:{
4848
src:services.authenticate,
49-
onDone:'NewOrContinue',
49+
onDone:'LoadStoredTutorial',
5050
onError:{
5151
target:'Error',
5252
actions:assign({
@@ -56,13 +56,19 @@ export const createMachine = (options: any) => {
5656
},
5757
},
5858
Error:{},
59-
NewOrContinue:{
59+
LoadStoredTutorial:{
6060
onEntry:['loadStoredTutorial'],
6161
on:{
62-
CONTINUE_TUTORIAL:{
63-
target:'ContinueTutorial',
64-
actions:['continueTutorial'],
62+
LOAD_STORED_TUTORIAL:{
63+
target:'Start',
64+
actions:['storeContinuedTutorial'],
6565
},
66+
START_NEW_TUTORIAL:'Start',
67+
},
68+
},
69+
Start:{
70+
on:{
71+
CONTINUE_TUTORIAL:'ContinueTutorial',
6672
NEW_TUTORIAL:'SelectTutorial',
6773
},
6874
},

‎web-app/stories/Launch.stories.tsxrenamed to‎web-app/stories/Start.stories.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,15 @@ import { action } from '@storybook/addon-actions'
33
importReactfrom'react'
44
import{css,jsx}from'@emotion/core'
55
importSideBarDecoratorfrom'./utils/SideBarDecorator'
6-
importLaunchPagefrom'../src/containers/Launch'
6+
importStartPagefrom'../src/containers/Start'
77

88
conststyles={
99
container:{},
1010
}
1111

12-
storiesOf('Launch',module)
12+
storiesOf('Start',module)
1313
.addDecorator(SideBarDecorator)
14-
.add('LaunchPage',()=>{
14+
.add('StartPage',()=>{
1515
consttutorial={
1616
summary:{
1717
title:'Tutorial Title',
@@ -20,7 +20,7 @@ storiesOf('Launch', module)
2020
}
2121
return(
2222
<divcss={styles.container}>
23-
<LaunchPagesend={action('send')}context={{ tutorial}}/>
23+
<StartPagesend={action('send')}context={{ tutorial}}/>
2424
</div>
2525
)
2626
})

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp