@plusscommunities/pluss-core-app 1.5.7-beta.0 → 1.5.8-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/module/components/ConfirmPopup.js +38 -10
- package/dist/module/components/ConfirmPopup.js.map +1 -1
- package/dist/module/components/EmptyStateMain.js +12 -5
- package/dist/module/components/EmptyStateMain.js.map +1 -1
- package/package.json +1 -1
- package/src/components/ConfirmPopup.js +47 -7
- package/src/components/EmptyStateMain.js +11 -5
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React, { PureComponent } from 'react';
|
|
2
2
|
import { Text, View } from 'react-native';
|
|
3
|
+
import _ from 'lodash';
|
|
3
4
|
import { connect } from 'react-redux';
|
|
4
5
|
import { getMainBrandingColourFromState, TEXT_DARK } from '../colours';
|
|
5
6
|
import { Spinner } from './Spinner';
|
|
@@ -19,29 +20,33 @@ class ConfirmPopup extends PureComponent {
|
|
|
19
20
|
width: 350,
|
|
20
21
|
marginBottom: 16
|
|
21
22
|
}
|
|
22
|
-
}, this.props.headerContent), /*#__PURE__*/React.createElement(Text, {
|
|
23
|
-
style: styles.text
|
|
24
|
-
}, this.props.text), this.props.
|
|
23
|
+
}, this.props.headerContent), !_.isEmpty(this.props.text) && /*#__PURE__*/React.createElement(Text, {
|
|
24
|
+
style: [styles.text, this.props.textAlignLeft && styles.textAlignLeft]
|
|
25
|
+
}, this.props.text), !_.isEmpty(this.props.subtext) && /*#__PURE__*/React.createElement(Text, {
|
|
26
|
+
style: [styles.subtext, this.props.textAlignLeft && styles.textAlignLeft]
|
|
27
|
+
}, this.props.subtext), this.props.extraContent && /*#__PURE__*/React.createElement(View, {
|
|
25
28
|
style: {
|
|
26
29
|
width: 350,
|
|
27
30
|
marginTop: 16
|
|
28
31
|
}
|
|
29
|
-
}, this.props.extraContent), /*#__PURE__*/React.createElement(View, {
|
|
30
|
-
style: styles.buttonsContainer
|
|
31
|
-
}, this.props.buttonsLoading && /*#__PURE__*/React.createElement(View,
|
|
32
|
+
}, this.props.extraContent), this.props.children, /*#__PURE__*/React.createElement(View, {
|
|
33
|
+
style: [styles.buttonsContainer, this.props.verticalButtons && styles.verticalButtons]
|
|
34
|
+
}, this.props.buttonsLoading && /*#__PURE__*/React.createElement(View, {
|
|
35
|
+
style: styles.loadingContainer
|
|
36
|
+
}, /*#__PURE__*/React.createElement(Spinner, null)), !this.props.hideNo && !this.props.buttonsLoading && /*#__PURE__*/React.createElement(InlineButton, {
|
|
32
37
|
onPress: this.props.onCancel,
|
|
33
38
|
color: "#fff",
|
|
34
|
-
style: [styles.button, styles.noButton, {
|
|
39
|
+
style: [styles.button, styles.noButton, this.props.verticalButtons && styles.buttonVertical, {
|
|
35
40
|
borderColor: this.props.colourBrandingMain
|
|
36
41
|
}],
|
|
37
42
|
textStyle: {
|
|
38
43
|
color: this.props.colourBrandingMain
|
|
39
44
|
},
|
|
40
45
|
large: true
|
|
41
|
-
}, this.props.noText || 'No'), !this.props.buttonsLoading && /*#__PURE__*/React.createElement(InlineButton, {
|
|
46
|
+
}, this.props.noText || 'No'), !this.props.hideYes && !this.props.buttonsLoading && /*#__PURE__*/React.createElement(InlineButton, {
|
|
42
47
|
onPress: this.props.onConfirm,
|
|
43
48
|
color: this.props.colourBrandingMain,
|
|
44
|
-
style: styles.button,
|
|
49
|
+
style: [styles.button, this.props.verticalButtons && styles.buttonVertical],
|
|
45
50
|
large: true
|
|
46
51
|
}, this.props.yesText || 'Yes')));
|
|
47
52
|
}
|
|
@@ -50,7 +55,7 @@ class ConfirmPopup extends PureComponent {
|
|
|
50
55
|
|
|
51
56
|
const styles = {
|
|
52
57
|
popup: {
|
|
53
|
-
padding:
|
|
58
|
+
padding: 24,
|
|
54
59
|
margin: 16,
|
|
55
60
|
maxWidth: 350
|
|
56
61
|
},
|
|
@@ -60,10 +65,24 @@ const styles = {
|
|
|
60
65
|
color: TEXT_DARK,
|
|
61
66
|
textAlign: 'center'
|
|
62
67
|
},
|
|
68
|
+
subtext: {
|
|
69
|
+
fontFamily: 'sf-regular',
|
|
70
|
+
fontSize: 17,
|
|
71
|
+
color: TEXT_DARK,
|
|
72
|
+
textAlign: 'center'
|
|
73
|
+
},
|
|
74
|
+
textAlignLeft: {
|
|
75
|
+
textAlign: 'left'
|
|
76
|
+
},
|
|
63
77
|
buttonsContainer: {
|
|
64
78
|
flexDirection: 'row',
|
|
65
79
|
marginTop: 24
|
|
66
80
|
},
|
|
81
|
+
loadingContainer: {
|
|
82
|
+
height: 40,
|
|
83
|
+
justifyContent: 'center',
|
|
84
|
+
alignItems: 'center'
|
|
85
|
+
},
|
|
67
86
|
button: {
|
|
68
87
|
width: 120,
|
|
69
88
|
paddingHorizontal: 2
|
|
@@ -71,6 +90,15 @@ const styles = {
|
|
|
71
90
|
noButton: {
|
|
72
91
|
borderWidth: 1,
|
|
73
92
|
marginRight: 16
|
|
93
|
+
},
|
|
94
|
+
buttonVertical: {
|
|
95
|
+
width: '100%',
|
|
96
|
+
marginTop: 16,
|
|
97
|
+
marginRight: 0,
|
|
98
|
+
paddingHorizontal: 8
|
|
99
|
+
},
|
|
100
|
+
verticalButtons: {
|
|
101
|
+
flexDirection: 'column-reverse'
|
|
74
102
|
}
|
|
75
103
|
};
|
|
76
104
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ConfirmPopup.js"],"names":["React","PureComponent","Text","View","connect","getMainBrandingColourFromState","TEXT_DARK","Spinner","InlineButton","MiddlePopup","ConfirmPopup","render","props","visible","onClose","styles","popup","headerContent","paddingTop","width","marginBottom","text","extraContent","marginTop","buttonsContainer","buttonsLoading","hideNo","onCancel","button","noButton","borderColor","colourBrandingMain","color","noText","onConfirm","yesText","padding","margin","maxWidth","fontFamily","fontSize","textAlign","flexDirection","paddingHorizontal","borderWidth","marginRight","mapStateToProps","state","confirmPopup"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AACA,SAASC,OAAT,QAAwB,aAAxB;AACA,SAASC,8BAAT,EAAyCC,SAAzC,QAA0D,YAA1D;AACA,SAASC,OAAT,QAAwB,WAAxB;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA,SAASC,WAAT,QAA4B,eAA5B;;AAEA,MAAMC,YAAN,
|
|
1
|
+
{"version":3,"sources":["ConfirmPopup.js"],"names":["React","PureComponent","Text","View","_","connect","getMainBrandingColourFromState","TEXT_DARK","Spinner","InlineButton","MiddlePopup","ConfirmPopup","render","props","visible","onClose","styles","popup","headerContent","paddingTop","width","marginBottom","isEmpty","text","textAlignLeft","subtext","extraContent","marginTop","children","buttonsContainer","verticalButtons","buttonsLoading","loadingContainer","hideNo","onCancel","button","noButton","buttonVertical","borderColor","colourBrandingMain","color","noText","hideYes","onConfirm","yesText","padding","margin","maxWidth","fontFamily","fontSize","textAlign","flexDirection","height","justifyContent","alignItems","paddingHorizontal","borderWidth","marginRight","mapStateToProps","state","confirmPopup"],"mappings":"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","sourcesContent":["import React, { PureComponent } from 'react';\nimport { Text, View } from 'react-native';\nimport _ from 'lodash';\nimport { connect } from 'react-redux';\nimport { getMainBrandingColourFromState, TEXT_DARK } from '../colours';\nimport { Spinner } from './Spinner';\nimport { InlineButton } from './InlineButton';\nimport { MiddlePopup } from './MiddlePopup';\n\nclass ConfirmPopup extends PureComponent {\n render() {\n return (\n <MiddlePopup\n visible={this.props.visible}\n onClose={this.props.onClose}\n style={[styles.popup, this.props.headerContent && { paddingTop: 16 }]}\n >\n {this.props.headerContent && <View style={{ width: 350, marginBottom: 16 }}>{this.props.headerContent}</View>}\n {!_.isEmpty(this.props.text) && (\n <Text style={[styles.text, this.props.textAlignLeft && styles.textAlignLeft]}>{this.props.text}</Text>\n )}\n {!_.isEmpty(this.props.subtext) && (\n <Text style={[styles.subtext, this.props.textAlignLeft && styles.textAlignLeft]}>{this.props.subtext}</Text>\n )}\n {this.props.extraContent && <View style={{ width: 350, marginTop: 16 }}>{this.props.extraContent}</View>}\n {this.props.children}\n <View style={[styles.buttonsContainer, this.props.verticalButtons && styles.verticalButtons]}>\n {this.props.buttonsLoading && (\n <View style={styles.loadingContainer}>\n <Spinner />\n </View>\n )}\n {!this.props.hideNo && !this.props.buttonsLoading && (\n <InlineButton\n onPress={this.props.onCancel}\n color=\"#fff\"\n style={[\n styles.button,\n styles.noButton,\n this.props.verticalButtons && styles.buttonVertical,\n { borderColor: this.props.colourBrandingMain },\n ]}\n textStyle={{ color: this.props.colourBrandingMain }}\n large\n >\n {this.props.noText || 'No'}\n </InlineButton>\n )}\n {!this.props.hideYes && !this.props.buttonsLoading && (\n <InlineButton\n onPress={this.props.onConfirm}\n color={this.props.colourBrandingMain}\n style={[styles.button, this.props.verticalButtons && styles.buttonVertical]}\n large\n >\n {this.props.yesText || 'Yes'}\n </InlineButton>\n )}\n </View>\n </MiddlePopup>\n );\n }\n}\n\nconst styles = {\n popup: {\n padding: 24,\n margin: 16,\n maxWidth: 350,\n },\n text: {\n fontFamily: 'sf-bold',\n fontSize: 20,\n color: TEXT_DARK,\n textAlign: 'center',\n },\n subtext: {\n fontFamily: 'sf-regular',\n fontSize: 17,\n color: TEXT_DARK,\n textAlign: 'center',\n },\n textAlignLeft: {\n textAlign: 'left',\n },\n buttonsContainer: {\n flexDirection: 'row',\n marginTop: 24,\n },\n loadingContainer: {\n height: 40,\n justifyContent: 'center',\n alignItems: 'center',\n },\n button: {\n width: 120,\n paddingHorizontal: 2,\n },\n noButton: {\n borderWidth: 1,\n marginRight: 16,\n },\n buttonVertical: {\n width: '100%',\n marginTop: 16,\n marginRight: 0,\n paddingHorizontal: 8,\n },\n verticalButtons: {\n flexDirection: 'column-reverse',\n },\n};\n\nconst mapStateToProps = state => {\n return {\n colourBrandingMain: getMainBrandingColourFromState(state),\n };\n};\n\nconst confirmPopup = connect(mapStateToProps, {})(ConfirmPopup);\nexport { confirmPopup as ConfirmPopup };\n"]}
|
|
@@ -1,10 +1,17 @@
|
|
|
1
1
|
import React, { PureComponent } from 'react';
|
|
2
2
|
import { Text, View, ScrollView, StyleSheet } from 'react-native';
|
|
3
|
+
import _ from 'lodash';
|
|
3
4
|
import { TEXT_BLUEGREY } from '../colours';
|
|
4
5
|
|
|
5
6
|
class EmptyStateMain extends PureComponent {
|
|
6
|
-
renderPlaceHolder() {
|
|
7
|
-
let opacity = arguments.length >
|
|
7
|
+
renderPlaceHolder(index) {
|
|
8
|
+
let opacity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
|
9
|
+
const barCount = _.isUndefined(this.props.barCount) ? 3 : this.props.barCount;
|
|
10
|
+
|
|
11
|
+
if (barCount <= index) {
|
|
12
|
+
return null;
|
|
13
|
+
}
|
|
14
|
+
|
|
8
15
|
return /*#__PURE__*/React.createElement(View, {
|
|
9
16
|
style: [styles.item, {
|
|
10
17
|
opacity
|
|
@@ -15,11 +22,11 @@ class EmptyStateMain extends PureComponent {
|
|
|
15
22
|
render() {
|
|
16
23
|
return /*#__PURE__*/React.createElement(View, {
|
|
17
24
|
style: [styles.container, this.props.style]
|
|
18
|
-
}, /*#__PURE__*/React.createElement(Text, {
|
|
25
|
+
}, !this.props.hideTitle && /*#__PURE__*/React.createElement(Text, {
|
|
19
26
|
style: styles.titleText
|
|
20
|
-
}, this.props.title || 'Nothing to see here'), /*#__PURE__*/React.createElement(ScrollView, {
|
|
27
|
+
}, this.props.title || 'Nothing to see here'), this.props.content, /*#__PURE__*/React.createElement(ScrollView, {
|
|
21
28
|
style: styles.itemContainer
|
|
22
|
-
}, this.renderPlaceHolder(0.8), this.renderPlaceHolder(0.6), this.renderPlaceHolder(0.4)));
|
|
29
|
+
}, this.renderPlaceHolder(0, 0.8), this.renderPlaceHolder(1, 0.6), this.renderPlaceHolder(2, 0.4)));
|
|
23
30
|
}
|
|
24
31
|
|
|
25
32
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["EmptyStateMain.js"],"names":["React","PureComponent","Text","View","ScrollView","StyleSheet","TEXT_BLUEGREY","EmptyStateMain","renderPlaceHolder","opacity","styles","item","render","container","
|
|
1
|
+
{"version":3,"sources":["EmptyStateMain.js"],"names":["React","PureComponent","Text","View","ScrollView","StyleSheet","_","TEXT_BLUEGREY","EmptyStateMain","renderPlaceHolder","index","opacity","barCount","isUndefined","props","styles","item","render","container","style","hideTitle","titleText","title","content","itemContainer","create","borderRadius","paddingVertical","fontFamily","fontSize","color","marginTop","flexDirection","width","height","backgroundColor","marginBottom"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AACA,SAASC,IAAT,EAAeC,IAAf,EAAqBC,UAArB,EAAiCC,UAAjC,QAAmD,cAAnD;AACA,OAAOC,CAAP,MAAc,QAAd;AACA,SAASC,aAAT,QAA8B,YAA9B;;AAEA,MAAMC,cAAN,SAA6BP,aAA7B,CAA2C;AACzCQ,EAAAA,iBAAiB,CAACC,KAAD,EAAqB;AAAA,QAAbC,OAAa,uEAAH,CAAG;AACpC,UAAMC,QAAQ,GAAGN,CAAC,CAACO,WAAF,CAAc,KAAKC,KAAL,CAAWF,QAAzB,IAAqC,CAArC,GAAyC,KAAKE,KAAL,CAAWF,QAArE;;AACA,QAAIA,QAAQ,IAAIF,KAAhB,EAAuB;AACrB,aAAO,IAAP;AACD;;AACD,wBAAO,oBAAC,IAAD;AAAM,MAAA,KAAK,EAAE,CAACK,MAAM,CAACC,IAAR,EAAc;AAAEL,QAAAA;AAAF,OAAd;AAAb,MAAP;AACD;;AAEDM,EAAAA,MAAM,GAAG;AACP,wBACE,oBAAC,IAAD;AAAM,MAAA,KAAK,EAAE,CAACF,MAAM,CAACG,SAAR,EAAmB,KAAKJ,KAAL,CAAWK,KAA9B;AAAb,OACG,CAAC,KAAKL,KAAL,CAAWM,SAAZ,iBAAyB,oBAAC,IAAD;AAAM,MAAA,KAAK,EAAEL,MAAM,CAACM;AAApB,OAAgC,KAAKP,KAAL,CAAWQ,KAAX,IAAoB,qBAApD,CAD5B,EAEG,KAAKR,KAAL,CAAWS,OAFd,eAGE,oBAAC,UAAD;AAAY,MAAA,KAAK,EAAER,MAAM,CAACS;AAA1B,OACG,KAAKf,iBAAL,CAAuB,CAAvB,EAA0B,GAA1B,CADH,EAEG,KAAKA,iBAAL,CAAuB,CAAvB,EAA0B,GAA1B,CAFH,EAGG,KAAKA,iBAAL,CAAuB,CAAvB,EAA0B,GAA1B,CAHH,CAHF,CADF;AAWD;;AArBwC;;AAwB3C,MAAMM,MAAM,GAAGV,UAAU,CAACoB,MAAX,CAAkB;AAC/BP,EAAAA,SAAS,EAAE;AACTQ,IAAAA,YAAY,EAAE,CADL;AAETC,IAAAA,eAAe,EAAE;AAFR,GADoB;AAK/BN,EAAAA,SAAS,EAAE;AACTO,IAAAA,UAAU,EAAE,SADH;AAETC,IAAAA,QAAQ,EAAE,EAFD;AAGTC,IAAAA,KAAK,EAAEvB;AAHE,GALoB;AAU/BiB,EAAAA,aAAa,EAAE;AACbO,IAAAA,SAAS,EAAE,EADE;AAEbC,IAAAA,aAAa,EAAE;AAFF,GAVgB;AAc/BhB,EAAAA,IAAI,EAAE;AACJU,IAAAA,YAAY,EAAE,CADV;AAEJO,IAAAA,KAAK,EAAE,MAFH;AAGJC,IAAAA,MAAM,EAAE,EAHJ;AAIJC,IAAAA,eAAe,EAAE,SAJb;AAKJC,IAAAA,YAAY,EAAE;AALV;AAdyB,CAAlB,CAAf;AAuBA,eAAe5B,cAAf","sourcesContent":["import React, { PureComponent } from 'react';\nimport { Text, View, ScrollView, StyleSheet } from 'react-native';\nimport _ from 'lodash';\nimport { TEXT_BLUEGREY } from '../colours';\n\nclass EmptyStateMain extends PureComponent {\n renderPlaceHolder(index, opacity = 1) {\n const barCount = _.isUndefined(this.props.barCount) ? 3 : this.props.barCount;\n if (barCount <= index) {\n return null;\n }\n return <View style={[styles.item, { opacity }]} />;\n }\n\n render() {\n return (\n <View style={[styles.container, this.props.style]}>\n {!this.props.hideTitle && <Text style={styles.titleText}>{this.props.title || 'Nothing to see here'}</Text>}\n {this.props.content}\n <ScrollView style={styles.itemContainer}>\n {this.renderPlaceHolder(0, 0.8)}\n {this.renderPlaceHolder(1, 0.6)}\n {this.renderPlaceHolder(2, 0.4)}\n </ScrollView>\n </View>\n );\n }\n}\n\nconst styles = StyleSheet.create({\n container: {\n borderRadius: 5,\n paddingVertical: 5,\n },\n titleText: {\n fontFamily: 'qs-bold',\n fontSize: 16,\n color: TEXT_BLUEGREY,\n },\n itemContainer: {\n marginTop: 20,\n flexDirection: 'column',\n },\n item: {\n borderRadius: 4,\n width: '100%',\n height: 32,\n backgroundColor: '#e6ebef',\n marginBottom: 17,\n },\n});\n\nexport default EmptyStateMain;\n"]}
|
package/package.json
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React, { PureComponent } from 'react';
|
|
2
2
|
import { Text, View } from 'react-native';
|
|
3
|
+
import _ from 'lodash';
|
|
3
4
|
import { connect } from 'react-redux';
|
|
4
5
|
import { getMainBrandingColourFromState, TEXT_DARK } from '../colours';
|
|
5
6
|
import { Spinner } from './Spinner';
|
|
@@ -15,11 +16,17 @@ class ConfirmPopup extends PureComponent {
|
|
|
15
16
|
style={[styles.popup, this.props.headerContent && { paddingTop: 16 }]}
|
|
16
17
|
>
|
|
17
18
|
{this.props.headerContent && <View style={{ width: 350, marginBottom: 16 }}>{this.props.headerContent}</View>}
|
|
18
|
-
|
|
19
|
+
{!_.isEmpty(this.props.text) && (
|
|
20
|
+
<Text style={[styles.text, this.props.textAlignLeft && styles.textAlignLeft]}>{this.props.text}</Text>
|
|
21
|
+
)}
|
|
22
|
+
{!_.isEmpty(this.props.subtext) && (
|
|
23
|
+
<Text style={[styles.subtext, this.props.textAlignLeft && styles.textAlignLeft]}>{this.props.subtext}</Text>
|
|
24
|
+
)}
|
|
19
25
|
{this.props.extraContent && <View style={{ width: 350, marginTop: 16 }}>{this.props.extraContent}</View>}
|
|
20
|
-
|
|
26
|
+
{this.props.children}
|
|
27
|
+
<View style={[styles.buttonsContainer, this.props.verticalButtons && styles.verticalButtons]}>
|
|
21
28
|
{this.props.buttonsLoading && (
|
|
22
|
-
<View>
|
|
29
|
+
<View style={styles.loadingContainer}>
|
|
23
30
|
<Spinner />
|
|
24
31
|
</View>
|
|
25
32
|
)}
|
|
@@ -27,15 +34,25 @@ class ConfirmPopup extends PureComponent {
|
|
|
27
34
|
<InlineButton
|
|
28
35
|
onPress={this.props.onCancel}
|
|
29
36
|
color="#fff"
|
|
30
|
-
style={[
|
|
37
|
+
style={[
|
|
38
|
+
styles.button,
|
|
39
|
+
styles.noButton,
|
|
40
|
+
this.props.verticalButtons && styles.buttonVertical,
|
|
41
|
+
{ borderColor: this.props.colourBrandingMain },
|
|
42
|
+
]}
|
|
31
43
|
textStyle={{ color: this.props.colourBrandingMain }}
|
|
32
44
|
large
|
|
33
45
|
>
|
|
34
46
|
{this.props.noText || 'No'}
|
|
35
47
|
</InlineButton>
|
|
36
48
|
)}
|
|
37
|
-
{!this.props.buttonsLoading && (
|
|
38
|
-
<InlineButton
|
|
49
|
+
{!this.props.hideYes && !this.props.buttonsLoading && (
|
|
50
|
+
<InlineButton
|
|
51
|
+
onPress={this.props.onConfirm}
|
|
52
|
+
color={this.props.colourBrandingMain}
|
|
53
|
+
style={[styles.button, this.props.verticalButtons && styles.buttonVertical]}
|
|
54
|
+
large
|
|
55
|
+
>
|
|
39
56
|
{this.props.yesText || 'Yes'}
|
|
40
57
|
</InlineButton>
|
|
41
58
|
)}
|
|
@@ -47,7 +64,7 @@ class ConfirmPopup extends PureComponent {
|
|
|
47
64
|
|
|
48
65
|
const styles = {
|
|
49
66
|
popup: {
|
|
50
|
-
padding:
|
|
67
|
+
padding: 24,
|
|
51
68
|
margin: 16,
|
|
52
69
|
maxWidth: 350,
|
|
53
70
|
},
|
|
@@ -57,10 +74,24 @@ const styles = {
|
|
|
57
74
|
color: TEXT_DARK,
|
|
58
75
|
textAlign: 'center',
|
|
59
76
|
},
|
|
77
|
+
subtext: {
|
|
78
|
+
fontFamily: 'sf-regular',
|
|
79
|
+
fontSize: 17,
|
|
80
|
+
color: TEXT_DARK,
|
|
81
|
+
textAlign: 'center',
|
|
82
|
+
},
|
|
83
|
+
textAlignLeft: {
|
|
84
|
+
textAlign: 'left',
|
|
85
|
+
},
|
|
60
86
|
buttonsContainer: {
|
|
61
87
|
flexDirection: 'row',
|
|
62
88
|
marginTop: 24,
|
|
63
89
|
},
|
|
90
|
+
loadingContainer: {
|
|
91
|
+
height: 40,
|
|
92
|
+
justifyContent: 'center',
|
|
93
|
+
alignItems: 'center',
|
|
94
|
+
},
|
|
64
95
|
button: {
|
|
65
96
|
width: 120,
|
|
66
97
|
paddingHorizontal: 2,
|
|
@@ -69,6 +100,15 @@ const styles = {
|
|
|
69
100
|
borderWidth: 1,
|
|
70
101
|
marginRight: 16,
|
|
71
102
|
},
|
|
103
|
+
buttonVertical: {
|
|
104
|
+
width: '100%',
|
|
105
|
+
marginTop: 16,
|
|
106
|
+
marginRight: 0,
|
|
107
|
+
paddingHorizontal: 8,
|
|
108
|
+
},
|
|
109
|
+
verticalButtons: {
|
|
110
|
+
flexDirection: 'column-reverse',
|
|
111
|
+
},
|
|
72
112
|
};
|
|
73
113
|
|
|
74
114
|
const mapStateToProps = state => {
|
|
@@ -1,20 +1,26 @@
|
|
|
1
1
|
import React, { PureComponent } from 'react';
|
|
2
2
|
import { Text, View, ScrollView, StyleSheet } from 'react-native';
|
|
3
|
+
import _ from 'lodash';
|
|
3
4
|
import { TEXT_BLUEGREY } from '../colours';
|
|
4
5
|
|
|
5
6
|
class EmptyStateMain extends PureComponent {
|
|
6
|
-
renderPlaceHolder(opacity = 1) {
|
|
7
|
+
renderPlaceHolder(index, opacity = 1) {
|
|
8
|
+
const barCount = _.isUndefined(this.props.barCount) ? 3 : this.props.barCount;
|
|
9
|
+
if (barCount <= index) {
|
|
10
|
+
return null;
|
|
11
|
+
}
|
|
7
12
|
return <View style={[styles.item, { opacity }]} />;
|
|
8
13
|
}
|
|
9
14
|
|
|
10
15
|
render() {
|
|
11
16
|
return (
|
|
12
17
|
<View style={[styles.container, this.props.style]}>
|
|
13
|
-
<Text style={styles.titleText}>{this.props.title || 'Nothing to see here'}</Text>
|
|
18
|
+
{!this.props.hideTitle && <Text style={styles.titleText}>{this.props.title || 'Nothing to see here'}</Text>}
|
|
19
|
+
{this.props.content}
|
|
14
20
|
<ScrollView style={styles.itemContainer}>
|
|
15
|
-
{this.renderPlaceHolder(0.8)}
|
|
16
|
-
{this.renderPlaceHolder(0.6)}
|
|
17
|
-
{this.renderPlaceHolder(0.4)}
|
|
21
|
+
{this.renderPlaceHolder(0, 0.8)}
|
|
22
|
+
{this.renderPlaceHolder(1, 0.6)}
|
|
23
|
+
{this.renderPlaceHolder(2, 0.4)}
|
|
18
24
|
</ScrollView>
|
|
19
25
|
</View>
|
|
20
26
|
);
|