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

Commit64837c0

Browse files
committed
load continue container
1 parent8d4d43f commit64837c0

File tree

4 files changed

+72
-30
lines changed

4 files changed

+72
-30
lines changed
Lines changed: 51 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,62 @@
11
import*asReactfrom'react'
2-
import{send}from'../../utils/vscode'
3-
importDataContextfrom'../../utils/DataContext'
2+
import{useQuery}from'@apollo/react-hooks'
43
import{Button,Card}from'@alifd/next'
54

5+
import{send}from'../../utils/vscode'
6+
importLoadingPagefrom'../LoadingPage'
7+
importqueryTutorialfrom'./queryTutorial'
8+
import*asTfrom'../../../../typings/graphql'
9+
610
interfaceProps{
11+
tutorial:T.Tutorial
712
onContinue():void
813
}
914

10-
exportconstContinuePage=(props:Props)=>{
11-
// context
12-
const{ data}=React.useContext(DataContext)
15+
exportconstContinuePage=(props:Props)=>(
16+
<div>
17+
<h3>Continue</h3>
18+
<CardshowTitleBullet={false}contentHeight="auto">
19+
<div>
20+
<h2>{props.tutorial.title}</h2>
21+
<p>{props.tutorial.text}</p>
22+
<ButtononClick={props.onContinue}>Resume</Button>
23+
</div>
24+
</Card>
25+
</div>
26+
)
27+
28+
constLoading=()=><LoadingPagetext="Loading tutorials"/>
29+
30+
constContinuePageContainer=()=>{
31+
// TODO: load specific tutorialId
32+
const{ data, loading, error}=useQuery(queryTutorial,{
33+
variables:{
34+
tutorialId:1,
35+
version:'0.1.0',
36+
},
37+
})
38+
39+
if(loading){
40+
returnLoading
41+
}
42+
43+
if(error){
44+
return(
45+
<div>
46+
<h5>{error.message}</h5>
47+
<p>{JSON.stringify(error,null,2)}</p>
48+
</div>
49+
)
50+
}
51+
1352
return(
14-
<div>
15-
<h3>Continue</h3>
16-
<CardshowTitleBullet={false}contentHeight="auto">
17-
<div>
18-
<h2>{data.summary.title}</h2>
19-
<p>{data.summary.description}</p>
20-
<ButtononClick={props.onContinue}>Resume</Button>
21-
</div>
22-
</Card>
23-
</div>
53+
<ContinuePage
54+
tutorial={data.tutorial}
55+
onContinue={()=>{
56+
send('TUTORIAL_START')
57+
}}
58+
/>
2459
)
2560
}
2661

27-
exportdefault()=>(
28-
<ContinuePage
29-
onContinue={()=>{
30-
send('TUTORIAL_START')
31-
}}
32-
/>
33-
)
62+
exportdefaultContinuePageContainer

‎web-app/src/containers/Continue/tutorial.gqlrenamed to‎web-app/src/containers/Continue/queryTutorial.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
querygetTutorial($tutorialId:ID!) {
1+
import{gql}from'apollo-boost'
2+
3+
exportdefaultgql`
4+
query getTutorial($tutorialId: ID!, $version: String) {
25
tutorial(id: $tutorialId) {
36
id
47
title
@@ -15,9 +18,11 @@ query getTutorial($tutorialId: ID!) {
1518
owner
1619
name
1720
}
18-
version {
21+
version(version: $version) {
1922
version
2023
coderoadVersion
2124
}
2225
}
2326
}
27+
28+
`

‎web-app/stories/Continue.stories.tsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,17 @@ import React from 'react'
33
import{storiesOf}from'@storybook/react'
44
import{action}from'@storybook/addon-actions'
55

6-
import{ContinuePage}from'../src/containers/Continue'
7-
importdemofrom'./data/basic'
6+
importapolloProviderfrom'./utils/ApolloDecorator'
7+
importContinuePageContainer,{ContinuePage}from'../src/containers/Continue'
88

9-
storiesOf('Continue',module).add('Page',()=><ContinuePagetutorials={[demo]}onContinue={action('onContinue')}/>)
9+
storiesOf('Continue',module)
10+
.add('Page',()=>{
11+
consttutorial={
12+
id:'1',
13+
title:'Example Tutorial',
14+
text:'Some summary',
15+
}
16+
return<ContinuePagetutorial={tutorial}onContinue={action('onContinue')}/>
17+
})
18+
.addDecorator(apolloProvider)
19+
.add('Container',()=><ContinuePageContainer/>)

‎web-app/stories/New.stories.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,4 @@ storiesOf('New', module)
3333
return<TutorialListtutorialList={tutorialList}onNew={action('onNew')}/>
3434
})
3535
.addDecorator(apolloProvider)
36-
.add('Container',()=>{
37-
return<NewContainer/>
38-
})
36+
.add('Container',()=><NewContainer/>)

0 commit comments

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