-
Notifications
You must be signed in to change notification settings - Fork 1.2k
/
index.stories.tsx
91 lines (84 loc) · 2.53 KB
/
index.stories.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
import * as React from 'react'
import * as Sb from '../../../stories/storybook'
import * as Kb from '../../../common-adapters'
import Qualify from '.'
const rows = [
{
subTitle:
'Some very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long subtitle',
title: '3 installed devices or paper keys',
valid: false,
},
{subTitle: '', title: 'Old enough Keybase, Github or Hacker News account', valid: true},
{subTitle: '😁', title: 'A beautiful smile', valid: true},
]
const props = {
onCancel: Sb.action('onCancel'),
onLoad: Sb.action('onLoad'),
onSubmit: Sb.action('onSubmit'),
rows,
}
class Transitions extends React.Component<any, any> {
state = {
machineState: 'loading1',
rows: [],
state: 'loading',
}
_next = () => {
this.setState(p => {
switch (p.machineState) {
case 'loading1':
return {
machineState: 'qualified',
rows: qualifiedRows,
state: 'qualified',
}
case 'qualified':
return {
machineState: 'accepted',
state: 'accepted',
}
case 'accepted':
return {
machineState: 'loading2',
rows: [],
state: 'loading',
}
case 'loading2':
return {
machineState: 'unqualified',
rows: this.props.rows,
state: 'unqualified',
}
case 'unqualified':
return {
machineState: 'loading1',
rows: [],
state: 'loading',
}
}
})
}
render() {
return (
<>
<Qualify {...props} {...this.props} rows={this.state.rows} state={this.state.state} />
<Kb.Button
label={`state: ${this.state.machineState}`}
onClick={this._next}
style={{position: 'absolute', right: 0, zIndex: 99999}}
/>
</>
)
}
}
const qualifiedRows = props.rows.map((r, idx) => ({...r, subTitle: idx === 0 ? '' : r.subTitle, valid: true}))
const load = () => {
Sb.storiesOf('Settings/AirdropQualify', module)
.add('Sad', () => <Qualify {...props} state="unqualified" />)
.add('Happy', () => <Qualify {...props} rows={qualifiedRows} state="qualified" />)
.add('Loading', () => <Qualify {...props} rows={[]} state="loading" />)
.add('Accepted', () => <Qualify {...props} state="accepted" />)
.add('Transitions', () => <Transitions {...props} />)
}
export default load