Add server change saga (#34)
* Reduce test lines of code * removed useless packages * pkg * add server saga * removed taginput taginput is not ready =/ * ~fix navigation~ * code duplicated * code duplicated * Delete tags.js * Delete TagInput.js
This commit is contained in:
Guilherme Gazzo
Gabriel Delavald
parent
08bd566d9e
commit
2c73857186
|
|
@ -231,15 +231,16 @@ exports[`render unread +999 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#3F51B5",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -249,29 +250,18 @@ exports[`render unread +999 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
NA
|
||||
</Text>
|
||||
<View
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/name",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
@ -350,15 +340,16 @@ exports[`render unread 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#3F51B5",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -368,29 +359,18 @@ exports[`render unread 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
NA
|
||||
</Text>
|
||||
<View
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/name",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
@ -469,15 +449,16 @@ exports[`renders correctly 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#3F51B5",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -487,29 +468,18 @@ exports[`renders correctly 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
NA
|
||||
</Text>
|
||||
<View
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/name",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,160 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Storyshots Avatar avatar 1`] = `
|
||||
<RCTScrollView>
|
||||
<View>
|
||||
<View
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#3F51B5",
|
||||
"borderRadius": 5,
|
||||
"height": 25,
|
||||
"width": 25,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
<Text
|
||||
accessible={true}
|
||||
allowFontScaling={true}
|
||||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 12.5,
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
TE
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#9C27B0",
|
||||
"borderRadius": 5,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
<Text
|
||||
accessible={true}
|
||||
allowFontScaling={true}
|
||||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
AA
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#9C27B0",
|
||||
"borderRadius": 5,
|
||||
"height": 30,
|
||||
"width": 30,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
<Text
|
||||
accessible={true}
|
||||
allowFontScaling={true}
|
||||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 15,
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
BB
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#3F51B5",
|
||||
"borderRadius": 2,
|
||||
"height": 25,
|
||||
"width": 25,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
<Text
|
||||
accessible={true}
|
||||
allowFontScaling={true}
|
||||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 12.5,
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
TE
|
||||
</Text>
|
||||
</View>
|
||||
</View>
|
||||
</RCTScrollView>
|
||||
`;
|
||||
|
||||
exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||
<RCTScrollView>
|
||||
<View>
|
||||
|
|
@ -37,15 +192,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#8BC34A",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -55,10 +211,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
RC
|
||||
|
|
@ -70,12 +230,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -132,15 +295,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#8BC34A",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -150,10 +314,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
RC
|
||||
|
|
@ -165,12 +333,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -227,15 +398,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#8BC34A",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -245,10 +417,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
RC
|
||||
|
|
@ -260,12 +436,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -343,15 +522,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#795548",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -361,10 +541,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
LC
|
||||
|
|
@ -376,12 +560,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -459,15 +646,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#795548",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -477,10 +665,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
LC
|
||||
|
|
@ -492,12 +684,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -575,15 +770,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#795548",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -593,10 +789,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
LC
|
||||
|
|
@ -608,12 +808,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -691,15 +894,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#795548",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -709,10 +913,14 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
LC
|
||||
|
|
@ -724,12 +932,15 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
}
|
||||
}
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
},
|
||||
Object {
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
|
|
@ -807,15 +1018,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#E91E63",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -825,29 +1037,18 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
W
|
||||
</Text>
|
||||
<CachedImage
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/W",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
@ -902,15 +1103,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#9C27B0",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -920,29 +1122,18 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
WW
|
||||
</Text>
|
||||
<CachedImage
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/WW",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
@ -997,15 +1188,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
Array [
|
||||
Object {
|
||||
"alignItems": "center",
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"justifyContent": "center",
|
||||
"overflow": "hidden",
|
||||
"width": 40,
|
||||
},
|
||||
Object {
|
||||
"backgroundColor": "#F44336",
|
||||
"backgroundColor": undefined,
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"width": 40,
|
||||
},
|
||||
undefined,
|
||||
]
|
||||
}
|
||||
>
|
||||
|
|
@ -1015,29 +1207,18 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
|||
disabled={false}
|
||||
ellipsizeMode="tail"
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#ffffff",
|
||||
},
|
||||
Object {
|
||||
"fontSize": 20,
|
||||
}
|
||||
},
|
||||
]
|
||||
}
|
||||
>
|
||||
|
||||
</Text>
|
||||
<CachedImage
|
||||
source={
|
||||
Object {
|
||||
"uri": "undefined/avatar/",
|
||||
}
|
||||
}
|
||||
style={
|
||||
Object {
|
||||
"borderRadius": 20,
|
||||
"height": 40,
|
||||
"position": "absolute",
|
||||
"width": 40,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<Text
|
||||
accessible={true}
|
||||
|
|
|
|||
|
|
@ -12,10 +12,11 @@ function createRequestTypes(base, types = defaultTypes) {
|
|||
// Login events
|
||||
export const LOGIN = createRequestTypes('LOGIN', [...defaultTypes, 'SET_TOKEN', 'SUBMIT']);
|
||||
export const ROOMS = createRequestTypes('ROOMS');
|
||||
export const APP = createRequestTypes('APP', ['READY']);
|
||||
export const APP = createRequestTypes('APP', ['READY', 'INIT']);
|
||||
export const MESSAGES = createRequestTypes('MESSAGES');
|
||||
export const CREATE_CHANNEL = createRequestTypes('CREATE_CHANNEL', [...defaultTypes, 'REQUEST_USERS', 'SUCCESS_USERS', 'FAILURE_USERS', 'SET_USERS']);
|
||||
export const NAVIGATION = createRequestTypes('NAVIGATION', ['SET']);
|
||||
export const SERVER = createRequestTypes('SERVER', ['SELECT', 'CHANGED']);
|
||||
export const SERVER = createRequestTypes('SERVER', [...defaultTypes, 'SELECT', 'CHANGED', 'ADD']);
|
||||
export const METEOR = createRequestTypes('METEOR_CONNECT', [...defaultTypes, 'DISCONNECT']);
|
||||
export const LOGOUT = 'LOGOUT'; // logout is always success
|
||||
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@ export function connectFailure(err) {
|
|||
}
|
||||
|
||||
export function disconnect(err) {
|
||||
console.log('types.METEOR.DISCONNECT');
|
||||
return {
|
||||
type: types.METEOR.DISCONNECT,
|
||||
err
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
import * as types from './actionsTypes';
|
||||
|
||||
export function createChannelRequest(data) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.REQUEST,
|
||||
data
|
||||
};
|
||||
}
|
||||
|
||||
export function createChannelSuccess(data) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.SUCCESS,
|
||||
data
|
||||
};
|
||||
}
|
||||
|
||||
export function createChannelFailure(err) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.FAILURE,
|
||||
err
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
export function createChannelRequestUsers(data) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.REQUEST_USERS,
|
||||
data
|
||||
};
|
||||
}
|
||||
|
||||
export function createChannelSetUsers(data) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.SET_USERS,
|
||||
data
|
||||
};
|
||||
}
|
||||
|
||||
export function createChannelSuccessUsers(data) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.SUCCESS_USERS,
|
||||
data
|
||||
};
|
||||
}
|
||||
|
||||
export function createChannelFailureUsers(err) {
|
||||
return {
|
||||
type: types.CREATE_CHANNEL.FAILURE_USERS,
|
||||
err
|
||||
};
|
||||
}
|
||||
|
|
@ -6,6 +6,12 @@ export function appReady() {
|
|||
type: APP.READY
|
||||
};
|
||||
}
|
||||
|
||||
export function appInit() {
|
||||
return {
|
||||
type: APP.INIT
|
||||
};
|
||||
}
|
||||
export function setCurrentServer(server) {
|
||||
return {
|
||||
type: types.SET_CURRENT_SERVER,
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ export function loginFailure(err) {
|
|||
};
|
||||
}
|
||||
|
||||
export function setToken(user) {
|
||||
export function setToken(user = {}) {
|
||||
return {
|
||||
type: types.LOGIN.SET_TOKEN,
|
||||
token: user.token,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import * as types from './actionsTypes';
|
||||
|
||||
export function messagesRequest({ rid }) {
|
||||
console.log(types.MESSAGES.REQUEST, rid);
|
||||
return {
|
||||
type: types.MESSAGES.REQUEST,
|
||||
rid
|
||||
|
|
|
|||
|
|
@ -6,6 +6,35 @@ export function setServer(server) {
|
|||
server
|
||||
};
|
||||
}
|
||||
export function serverRequest(server) {
|
||||
return {
|
||||
type: SERVER.REQUEST,
|
||||
server
|
||||
};
|
||||
}
|
||||
|
||||
export function addServer(server) {
|
||||
return {
|
||||
type: SERVER.ADD,
|
||||
server
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
export function serverSuccess() {
|
||||
return {
|
||||
type: SERVER.SUCCESS
|
||||
};
|
||||
}
|
||||
|
||||
export function serverFailure(err) {
|
||||
return {
|
||||
type: SERVER.FAILURE,
|
||||
err
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
export function changedServer(server) {
|
||||
return {
|
||||
type: SERVER.CHANGED,
|
||||
|
|
|
|||
|
|
@ -1,12 +1,10 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { View, Text, StyleSheet } from 'react-native';
|
||||
import { CachedImage } from 'react-native-img-cache';
|
||||
import { emojify } from 'react-emojione';
|
||||
import Markdown from 'react-native-easy-markdown';
|
||||
import moment from 'moment';
|
||||
|
||||
import avatarInitialsAndColor from '../utils/avatarInitialsAndColor';
|
||||
import Avatar from './avatar';
|
||||
import Card from './message/card';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
|
|
@ -20,26 +18,6 @@ const styles = StyleSheet.create({
|
|||
flexDirection: 'row',
|
||||
transform: [{ scaleY: -1 }]
|
||||
},
|
||||
avatarContainer: {
|
||||
backgroundColor: '#eee',
|
||||
width: 40,
|
||||
height: 40,
|
||||
marginRight: 10,
|
||||
borderRadius: 5
|
||||
},
|
||||
avatar: {
|
||||
width: 40,
|
||||
height: 40,
|
||||
borderRadius: 5,
|
||||
position: 'absolute'
|
||||
},
|
||||
avatarInitials: {
|
||||
margin: 2,
|
||||
textAlign: 'center',
|
||||
lineHeight: 36,
|
||||
fontSize: 22,
|
||||
color: '#ffffff'
|
||||
},
|
||||
texts: {
|
||||
flex: 1
|
||||
},
|
||||
|
|
@ -87,33 +65,17 @@ export default class Message extends React.PureComponent {
|
|||
|
||||
const username = item.alias || item.u.username;
|
||||
|
||||
let { initials, color } = avatarInitialsAndColor(username);
|
||||
|
||||
const avatar = item.avatar || `${ this.props.baseUrl }/avatar/${ item.u.username }`;
|
||||
if (item.avatar) {
|
||||
initials = '';
|
||||
color = 'transparent';
|
||||
}
|
||||
|
||||
let aliasUsername;
|
||||
if (item.alias) {
|
||||
aliasUsername = <Text style={styles.alias}>@{item.u.username}</Text>;
|
||||
}
|
||||
|
||||
const time = moment(item.ts).format(this.props.Message_TimeFormat);
|
||||
|
||||
return (
|
||||
<View style={[styles.message, extraStyle]}>
|
||||
<View style={[styles.avatarContainer, { backgroundColor: color }]}>
|
||||
<Text style={styles.avatarInitials}>{initials}</Text>
|
||||
<CachedImage style={styles.avatar} source={{ uri: avatar }} />
|
||||
</View>
|
||||
<Avatar style={{ marginRight: 10 }} text={item.avatar ? '' : username} size={40} baseUrl={this.props.baseUrl} avatar={item.avatar} />
|
||||
<View style={[styles.content]}>
|
||||
<View style={styles.usernameView}>
|
||||
<Text onPress={this._onPress} style={styles.username}>
|
||||
{username}
|
||||
</Text>
|
||||
{aliasUsername}<Text style={styles.time}>{time}</Text>
|
||||
{item.alias && <Text style={styles.alias}>@{item.u.username}</Text>}<Text style={styles.time}>{time}</Text>
|
||||
</View>
|
||||
{this.attachments()}
|
||||
<Markdown>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,8 @@
|
|||
import React from 'react';
|
||||
import { CachedImage } from 'react-native-img-cache';
|
||||
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
|
||||
import PropTypes from 'prop-types';
|
||||
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
|
||||
|
||||
import Avatar from './avatar';
|
||||
import avatarInitialsAndColor from '../utils/avatarInitialsAndColor';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
|
|
@ -81,12 +80,8 @@ export default class RoomItem extends React.PureComponent {
|
|||
}
|
||||
|
||||
if (type === 'd') {
|
||||
const { initials, color } = avatarInitialsAndColor(name);
|
||||
return (
|
||||
<View style={[styles.iconContainer, { backgroundColor: color }]}>
|
||||
<Text style={styles.avatarInitials}>{initials}</Text>
|
||||
<CachedImage style={styles.avatar} source={{ uri: `${ baseUrl }/avatar/${ name }` }} />
|
||||
</View>
|
||||
<Avatar text={name} baseUrl={baseUrl} size={40} borderRadius={20} />
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { StyleSheet, Text, View } from 'react-native';
|
||||
import { CachedImage } from 'react-native-img-cache';
|
||||
import avatarInitialsAndColor from '../utils/avatarInitialsAndColor';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
iconContainer: {
|
||||
overflow: 'hidden',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center'
|
||||
},
|
||||
avatar: {
|
||||
position: 'absolute'
|
||||
},
|
||||
avatarInitials: {
|
||||
color: '#ffffff'
|
||||
} });
|
||||
|
||||
class Avatar extends React.PureComponent {
|
||||
render() {
|
||||
const { text = '', size = 25, baseUrl = this.props.baseUrl,
|
||||
borderRadius = 5, style, avatar } = this.props;
|
||||
const { initials, color } = avatarInitialsAndColor(`${ text }`);
|
||||
return (
|
||||
<View style={[styles.iconContainer, {
|
||||
backgroundColor: color,
|
||||
width: size,
|
||||
height: size,
|
||||
borderRadius
|
||||
}, style]}
|
||||
>
|
||||
<Text style={[styles.avatarInitials, { fontSize: size / 2 }]}>{initials}</Text>
|
||||
{ (avatar || baseUrl) && <CachedImage
|
||||
style={[styles.avatar, { width: size,
|
||||
height: size }]}
|
||||
source={{ uri: avatar || `${ baseUrl }/avatar/${ text }` }}
|
||||
/>}
|
||||
</View>);
|
||||
}
|
||||
}
|
||||
|
||||
Avatar.propTypes = {
|
||||
style: PropTypes.object,
|
||||
baseUrl: PropTypes.string,
|
||||
text: PropTypes.string.isRequired,
|
||||
avatar: PropTypes.string,
|
||||
size: PropTypes.number,
|
||||
borderRadius: PropTypes.number
|
||||
};
|
||||
export default Avatar;
|
||||
39
app/index.js
39
app/index.js
|
|
@ -1,33 +1,38 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { View, Image } from 'react-native';
|
||||
import { connect } from 'react-redux';
|
||||
import { Text } from 'react-native';
|
||||
import * as Animatable from 'react-native-animatable';
|
||||
import setNavigator from './actions/navigator';
|
||||
import { appInit } from './actions';
|
||||
import LoginView from './views/login';
|
||||
import ListServerView from './views/serverList';
|
||||
|
||||
|
||||
import styles from './views/Styles';
|
||||
|
||||
import store from './lib/createStore';
|
||||
|
||||
export const authenticated = WrappedComponent => class _p extends React.PureComponent {
|
||||
constructor() {
|
||||
super();
|
||||
this.login = store.getState().login;
|
||||
console.log('this.login.token', this.login.token);
|
||||
if (!this.login.token || this.login.failure) {
|
||||
return store.getState().navigator.resetTo({
|
||||
screen: 'Login'
|
||||
screen: 'Login',
|
||||
animated: false
|
||||
});
|
||||
}
|
||||
}
|
||||
render() {
|
||||
// Wraps the input component in a container, without mutating it. Good!
|
||||
return <WrappedComponent {...this.props} />;
|
||||
return ((this.login.isAuthenticated || this.login.user) && <WrappedComponent {...this.props} />);
|
||||
}
|
||||
};
|
||||
//
|
||||
export class PublicScreen extends React.PureComponent {
|
||||
render() {
|
||||
return !this.login.isAuthenticated || !this.login.user ? null : (<ListServerView {...this.props} />);
|
||||
return ((this.login.isAuthenticated || this.login.user) && <ListServerView {...this.props} />);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -43,21 +48,35 @@ export class PrivateScreen extends React.PureComponent {
|
|||
@connect(() => ({
|
||||
// logged: state.login.isAuthenticated
|
||||
}), dispatch => ({
|
||||
setNavigator: navigator => dispatch(setNavigator(navigator))
|
||||
setNavigator: navigator => dispatch(setNavigator(navigator)),
|
||||
appInit: () => dispatch(appInit())
|
||||
}))
|
||||
export const HomeScreen = class extends React.PureComponent {
|
||||
static propTypes = {
|
||||
appInit: PropTypes.func.isRequired,
|
||||
setNavigator: PropTypes.func.isRequired,
|
||||
navigator: PropTypes.object.isRequired
|
||||
}
|
||||
static navigatorStyle = {
|
||||
navBarHidden: true,
|
||||
|
||||
rightButtons: [{
|
||||
id: 'close',
|
||||
title: 'Cancel'
|
||||
}]
|
||||
};
|
||||
componentWillMount() {
|
||||
this.props.setNavigator(this.props.navigator);
|
||||
this.props.navigator.resetTo({
|
||||
screen: 'public'
|
||||
});
|
||||
this.props.appInit();
|
||||
//
|
||||
// this.props.navigator.setDrawerEnabled({
|
||||
// side: 'left', // the side of the drawer since you can have two, 'left' / 'right'
|
||||
// enabled: false // should the drawer be enabled or disabled (locked closed)
|
||||
// });
|
||||
}
|
||||
render() {
|
||||
return (<Text>oieee</Text>);
|
||||
return (<View style={styles.logoContainer}><Animatable.Text animation='pulse' easing='ease-out' iterationCount='infinite' style={{ textAlign: 'center' }}>
|
||||
<Image style={styles.logo} source={require('./images/logo.png')} />
|
||||
</Animatable.Text></View>);
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -36,7 +36,15 @@ const RocketChat = {
|
|||
console.warn(`AsyncStorage error: ${ error.message }`);
|
||||
}
|
||||
},
|
||||
|
||||
async testServer(url) {
|
||||
if (/^(https?:\/\/)?(((\w|[0-9])+(\.(\w|[0-9-_])+)+)|localhost)(:\d+)?$/.test(url)) {
|
||||
const response = await fetch(url, { method: 'HEAD' });
|
||||
if (response.status === 200 && response.headers.get('x-instance-id') != null && response.headers.get('x-instance-id').length) {
|
||||
return url;
|
||||
}
|
||||
}
|
||||
throw new Error({ error: 'invalid server' });
|
||||
},
|
||||
connect(_url) {
|
||||
return new Promise((resolve) => {
|
||||
const url = `${ _url }/websocket`;
|
||||
|
|
@ -61,7 +69,7 @@ const RocketChat = {
|
|||
const setting = {
|
||||
_id: item._id
|
||||
};
|
||||
setting._server = { id: reduxStore.getState().server };
|
||||
setting._server = { id: reduxStore.getState().server.server };
|
||||
if (settingsType[item.type]) {
|
||||
setting[settingsType[item.type]] = item.value;
|
||||
realm.create('settings', setting, true);
|
||||
|
|
@ -78,7 +86,7 @@ const RocketChat = {
|
|||
realm.write(() => {
|
||||
const message = ddbMessage.fields.args[0];
|
||||
message.temp = false;
|
||||
message._server = { id: reduxStore.getState().server };
|
||||
message._server = { id: reduxStore.getState().server.server };
|
||||
realm.create('messages', message, true);
|
||||
});
|
||||
}
|
||||
|
|
@ -86,7 +94,7 @@ const RocketChat = {
|
|||
if (ddbMessage.collection === 'stream-notify-user') {
|
||||
realm.write(() => {
|
||||
const data = ddbMessage.fields.args[1];
|
||||
data._server = { id: reduxStore.getState().server };
|
||||
data._server = { id: reduxStore.getState().server.server };
|
||||
realm.create('subscriptions', data, true);
|
||||
});
|
||||
}
|
||||
|
|
@ -97,13 +105,11 @@ const RocketChat = {
|
|||
},
|
||||
|
||||
login(params, callback) {
|
||||
console.log('login(params, callback)');
|
||||
return new Promise((resolve, reject) => {
|
||||
Meteor._startLoggingIn();
|
||||
return Meteor.call('login', params, (err, result) => {
|
||||
Meteor._endLoggingIn();
|
||||
Meteor._handleLoginCallback(err, result);
|
||||
console.log('login(params, callback)asdas', err, result);
|
||||
if (err) {
|
||||
reject(err);
|
||||
} else {
|
||||
|
|
@ -172,7 +178,7 @@ const RocketChat = {
|
|||
// if (typeof item.value === 'string') {
|
||||
// subscription.value = item.value;
|
||||
// }
|
||||
subscription._server = { id: reduxStore.getState().server };
|
||||
subscription._server = { id: reduxStore.getState().server.server };
|
||||
// write('subscriptions', subscription);
|
||||
realm.create('subscriptions', subscription, true);
|
||||
});
|
||||
|
|
@ -196,7 +202,7 @@ const RocketChat = {
|
|||
realm.write(() => {
|
||||
data.messages.forEach((message) => {
|
||||
message.temp = false;
|
||||
message._server = { id: reduxStore.getState().server };
|
||||
message._server = { id: reduxStore.getState().server.server };
|
||||
// write('messages', message);
|
||||
realm.create('messages', message, true);
|
||||
});
|
||||
|
|
@ -226,7 +232,7 @@ const RocketChat = {
|
|||
ts: new Date(),
|
||||
_updatedAt: new Date(),
|
||||
temp: true,
|
||||
_server: { id: reduxStore.getState().server },
|
||||
_server: { id: reduxStore.getState().server.server },
|
||||
u: {
|
||||
_id: reduxStore.getState().login.user.id || '1',
|
||||
username: reduxStore.getState().login.user.id
|
||||
|
|
@ -370,7 +376,6 @@ const RocketChat = {
|
|||
return subscription;
|
||||
});
|
||||
// Meteor.subscribe('stream-notify-user', `${ Meteor.userId() }/rooms-changed`, false);
|
||||
console.log('getRooms resolved', reduxStore.getState().server, data);
|
||||
realm.write(() => {
|
||||
data.forEach((subscription) => {
|
||||
// const subscription = {
|
||||
|
|
@ -379,7 +384,7 @@ const RocketChat = {
|
|||
// if (typeof item.value === 'string') {
|
||||
// subscription.value = item.value;
|
||||
// }
|
||||
subscription._server = { id: reduxStore.getState().server };
|
||||
subscription._server = { id: reduxStore.getState().server.server };
|
||||
// write('subscriptions', subscription);
|
||||
realm.create('subscriptions', subscription, true);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
import { CREATE_CHANNEL } from '../actions/actionsTypes';
|
||||
|
||||
const initialState = {
|
||||
isFetching: false,
|
||||
failure: false
|
||||
};
|
||||
|
||||
export default function messages(state = initialState, action) {
|
||||
switch (action.type) {
|
||||
case CREATE_CHANNEL.REQUEST:
|
||||
return { ...state,
|
||||
error: undefined,
|
||||
failure: false,
|
||||
isFetching: true
|
||||
};
|
||||
case CREATE_CHANNEL.SUCCESS:
|
||||
return { ...state,
|
||||
isFetching: false,
|
||||
failure: false,
|
||||
result: action.data
|
||||
};
|
||||
case CREATE_CHANNEL.FAILURE:
|
||||
return { ...state,
|
||||
isFetching: false,
|
||||
failure: true,
|
||||
error: action.err
|
||||
};
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,8 +5,9 @@ import meteor from './connect';
|
|||
import messages from './messages';
|
||||
import server from './server';
|
||||
import navigator from './navigator';
|
||||
import createChannel from './createChannel';
|
||||
|
||||
|
||||
export default combineReducers({
|
||||
settings, login, meteor, messages, server, navigator
|
||||
settings, login, meteor, messages, server, navigator, createChannel
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,9 +1,36 @@
|
|||
import { SERVER } from '../actions/actionsTypes';
|
||||
|
||||
export default function server(state = '', action) {
|
||||
const initialState = {
|
||||
connecting: false,
|
||||
connected: false,
|
||||
errorMessage: '',
|
||||
failure: false,
|
||||
server: ''
|
||||
};
|
||||
|
||||
|
||||
export default function server(state = initialState, action) {
|
||||
switch (action.type) {
|
||||
case SERVER.REQUEST:
|
||||
return { ...state,
|
||||
connecting: true,
|
||||
failure: false
|
||||
};
|
||||
case SERVER.SUCCESS:
|
||||
return { ...state,
|
||||
connecting: false,
|
||||
connected: true,
|
||||
failure: false
|
||||
};
|
||||
case SERVER.FAILURE:
|
||||
return { ...state,
|
||||
connecting: false,
|
||||
connected: false,
|
||||
failure: true,
|
||||
errorMessage: action.err
|
||||
};
|
||||
case SERVER.SELECT:
|
||||
return action.server;
|
||||
return { ...state, server: action.server };
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,39 +0,0 @@
|
|||
import React from 'react';
|
||||
import {
|
||||
Scene,
|
||||
Router
|
||||
// Actions,
|
||||
// Reducer,
|
||||
// ActionConst,
|
||||
// Tabs,
|
||||
// Modal,
|
||||
// Drawer,
|
||||
// Stack,
|
||||
// Lightbox
|
||||
} from 'react-native-router-flux';
|
||||
// import { Navigation } from 'react-native-navigation';
|
||||
import { Provider } from 'react-redux';
|
||||
|
||||
import LoginView from '../views/login';
|
||||
import NewServerView from '../views/serverNew';
|
||||
import ListServerView from '../views/serverList';
|
||||
import RoomsListView from '../views/roomsList';
|
||||
import RoomView from '../views/room';
|
||||
// import PhotoView from '../views/Photo';
|
||||
// import CreateChannel from '../views/CreateChannel';
|
||||
import store from '../lib/createStore';
|
||||
|
||||
export default () => (
|
||||
<Provider store={store}>
|
||||
<Router>
|
||||
<Scene key='root'>
|
||||
<Scene key='listServer' component={ListServerView} title='Servers' />
|
||||
<Scene key='newServer' component={NewServerView} title='New Server' />
|
||||
<Scene key='login' component={LoginView} title='Login' />
|
||||
<Scene key='roomList' component={RoomsListView} />
|
||||
<Scene key='room' component={RoomView} initial />
|
||||
</Scene>
|
||||
</Router>
|
||||
</Provider>
|
||||
);
|
||||
// <Scene key='register' component={Register} title='Register' />
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
import { take, put, call, fork, takeLatest, select } from 'redux-saga/effects';
|
||||
import { put, call, takeLatest, select } from 'redux-saga/effects';
|
||||
import { METEOR } from '../actions/actionsTypes';
|
||||
import RocketChat from '../lib/rocketchat';
|
||||
|
||||
import { connectSuccess, connectFailure } from '../actions/connect';
|
||||
|
||||
const getServer = ({ server }) => server;
|
||||
const getServer = ({ server }) => server.server;
|
||||
|
||||
|
||||
const connect = url => RocketChat.connect(url);
|
||||
|
|
@ -17,14 +17,11 @@ const test = function* test() {
|
|||
yield put(connectFailure(err.status));
|
||||
}
|
||||
};
|
||||
const watchConnect = function* watchConnect() {
|
||||
yield takeLatest(METEOR.REQUEST, test);
|
||||
while (true) {
|
||||
yield take(METEOR.DISCONNECT);
|
||||
}
|
||||
};
|
||||
// const watchConnect = function* watchConnect() {
|
||||
// };
|
||||
const root = function* root() {
|
||||
yield fork(watchConnect);
|
||||
yield takeLatest(METEOR.REQUEST, test);
|
||||
// yield fork(watchConnect);
|
||||
// yield fork(auto);
|
||||
};
|
||||
export default root;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,34 @@
|
|||
import { delay } from 'redux-saga';
|
||||
import { select, put, call, fork, take } from 'redux-saga/effects';
|
||||
import { CREATE_CHANNEL, LOGIN } from '../actions/actionsTypes';
|
||||
import { createChannelSuccess, createChannelFailure } from '../actions/createChannel';
|
||||
import RocketChat from '../lib/rocketchat';
|
||||
|
||||
|
||||
const create = function* create(data) {
|
||||
return yield RocketChat.createChannel(data);
|
||||
};
|
||||
|
||||
const get = function* get() {
|
||||
while (true) {
|
||||
try {
|
||||
const { data } = yield take(CREATE_CHANNEL.REQUEST);
|
||||
const auth = yield select(state => state.login.isAuthenticated);
|
||||
if (!auth) {
|
||||
yield take(LOGIN.SUCCESS);
|
||||
}
|
||||
const result = yield call(create, data);
|
||||
yield put(createChannelSuccess(result));
|
||||
select(({ navigator }) => navigator).dismissModal({
|
||||
animationType: 'slide-down'
|
||||
});
|
||||
} catch (err) {
|
||||
yield delay(2000);
|
||||
yield put(createChannelFailure(err));
|
||||
}
|
||||
}
|
||||
};
|
||||
const getData = function* getData() {
|
||||
yield fork(get);
|
||||
};
|
||||
export default getData;
|
||||
|
|
@ -6,11 +6,13 @@ import connect from './connect';
|
|||
import rooms from './rooms';
|
||||
import messages from './messages';
|
||||
import selectServer from './selectServer';
|
||||
import createChannel from './createChannel';
|
||||
import init from './init';
|
||||
|
||||
const root = function* root() {
|
||||
yield fork(init);
|
||||
yield take(types.APP.READY);
|
||||
yield fork(createChannel);
|
||||
yield fork(hello);
|
||||
yield fork(rooms);
|
||||
yield fork(login);
|
||||
|
|
|
|||
|
|
@ -1,13 +1,23 @@
|
|||
import { AsyncStorage } from 'react-native';
|
||||
import { call, put } from 'redux-saga/effects';
|
||||
import { call, put, select, take } from 'redux-saga/effects';
|
||||
import * as actions from '../actions';
|
||||
import { setServer } from '../actions/server';
|
||||
import { APP } from '../actions/actionsTypes';
|
||||
|
||||
const restore = function* restore() {
|
||||
try {
|
||||
yield take(APP.INIT);
|
||||
const { navigator } = yield select(state => state);
|
||||
const currentServer = yield call([AsyncStorage, 'getItem'], 'currentServer');
|
||||
yield put(actions.appReady({}));
|
||||
if (currentServer) { yield put(setServer(currentServer)); }
|
||||
if (currentServer) {
|
||||
yield put(setServer(currentServer));
|
||||
} else {
|
||||
navigator.resetTo({
|
||||
screen: 'ListServer',
|
||||
animated: false
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import { AsyncStorage } from 'react-native';
|
||||
import { take, put, call, takeEvery, fork, select, all, race } from 'redux-saga/effects';
|
||||
import * as types from '../actions/actionsTypes';
|
||||
import { loginRequest, loginSuccess, loginFailure, setToken } from '../actions/login';
|
||||
import { loginRequest, loginSuccess, loginFailure, setToken, logout } from '../actions/login';
|
||||
import RocketChat from '../lib/rocketchat';
|
||||
|
||||
const TOKEN_KEY = 'reactnativemeteor_usertoken';
|
||||
const getUser = state => state.login;
|
||||
const getServer = state => state.server;
|
||||
const getServer = state => state.server.server;
|
||||
const loginCall = args => (args.resume ? RocketChat.login(args) : RocketChat.loginWithPassword(args));
|
||||
|
||||
const getToken = function* getToken() {
|
||||
|
|
@ -20,6 +20,8 @@ const getToken = function* getToken() {
|
|||
} catch (e) {
|
||||
console.log('getTokenerr', e);
|
||||
}
|
||||
} else {
|
||||
yield put(setToken());
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -27,10 +29,9 @@ const handleLoginWhenServerChanges = function* handleLoginWhenServerChanges() {
|
|||
// do {
|
||||
try {
|
||||
yield take(types.METEOR.SUCCESS);
|
||||
yield call(getToken);
|
||||
const { navigator } = yield select(state => state);
|
||||
navigator.resetTo({
|
||||
screen: 'Rooms'
|
||||
});
|
||||
|
||||
const user = yield select(getUser);
|
||||
if (user.token) {
|
||||
yield put(loginRequest({ resume: user.token }));
|
||||
|
|
@ -47,6 +48,9 @@ const handleLoginWhenServerChanges = function* handleLoginWhenServerChanges() {
|
|||
// });
|
||||
// }
|
||||
}
|
||||
navigator.resetTo({
|
||||
screen: 'Rooms'
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
|
|
@ -66,10 +70,13 @@ const handleLoginRequest = function* handleLoginRequest() {
|
|||
const response = yield call(loginCall, credentials);
|
||||
yield put(loginSuccess(response));
|
||||
} catch (err) {
|
||||
// console.log('login failed');
|
||||
if (err.error === 403) {
|
||||
yield put(logout());
|
||||
} else {
|
||||
yield put(loginFailure(err));
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const handleLoginSubmit = function* handleLoginSubmit() {
|
||||
|
|
@ -93,7 +100,6 @@ const handleLoginSubmit = function* handleLoginSubmit() {
|
|||
};
|
||||
|
||||
const root = function* root() {
|
||||
yield takeEvery(types.SERVER.CHANGED, getToken);
|
||||
yield takeEvery(types.SERVER.CHANGED, handleLoginWhenServerChanges);
|
||||
yield fork(handleLoginRequest);
|
||||
yield takeEvery(types.LOGIN.SUCCESS, saveToken);
|
||||
|
|
|
|||
|
|
@ -1,17 +1,60 @@
|
|||
import { put, takeEvery, call } from 'redux-saga/effects';
|
||||
import { put, takeEvery, call, takeLatest, race, take } from 'redux-saga/effects';
|
||||
import { delay } from 'redux-saga';
|
||||
import { AsyncStorage } from 'react-native';
|
||||
import { Navigation } from 'react-native-navigation';
|
||||
import { SERVER } from '../actions/actionsTypes';
|
||||
import { connectRequest, disconnect } from '../actions/connect';
|
||||
import { changedServer } from '../actions/server';
|
||||
import { changedServer, serverSuccess, serverFailure, serverRequest } from '../actions/server';
|
||||
import RocketChat from '../lib/rocketchat';
|
||||
import realm from '../lib/realm';
|
||||
|
||||
const validate = function* validate(server) {
|
||||
return yield RocketChat.testServer(server);
|
||||
};
|
||||
|
||||
const selectServer = function* selectServer({ server }) {
|
||||
yield put(disconnect());
|
||||
yield put(changedServer(server));
|
||||
yield console.log('SERVER->', server);
|
||||
yield call([AsyncStorage, 'setItem'], 'currentServer', server);
|
||||
yield put(connectRequest(server));
|
||||
yield Navigation.dismissModal({
|
||||
animationType: 'slide-down'
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
const validateServer = function* validateServer({ server }) {
|
||||
try {
|
||||
yield delay(1000);
|
||||
yield call(validate, server);
|
||||
yield put(serverSuccess());
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
yield put(serverFailure(e));
|
||||
}
|
||||
};
|
||||
|
||||
const addServer = function* addServer({ server }) {
|
||||
yield call(serverRequest, server);
|
||||
|
||||
const { error } = race({
|
||||
error: take(SERVER.FAILURE),
|
||||
success: take(SERVER.SUCCESS)
|
||||
});
|
||||
if (!error) {
|
||||
realm.write(() => {
|
||||
realm.create('servers', { id: server, current: false }, true);
|
||||
});
|
||||
Navigation.dismissModal({
|
||||
animationType: 'slide-down'
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const root = function* root() {
|
||||
yield takeLatest(SERVER.REQUEST, validateServer);
|
||||
yield takeEvery(SERVER.SELECT, selectServer);
|
||||
yield takeEvery(SERVER.ADD, addServer);
|
||||
};
|
||||
export default root;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,12 @@
|
|||
import { AVATAR_COLORS } from '../constants/colors';
|
||||
|
||||
export default function(username = '') {
|
||||
if (username === '') {
|
||||
return {
|
||||
initials: '',
|
||||
colors: 'transparent'
|
||||
};
|
||||
}
|
||||
const position = username.length % AVATAR_COLORS.length;
|
||||
|
||||
const color = AVATAR_COLORS[position];
|
||||
|
|
|
|||
|
|
@ -1,81 +1,59 @@
|
|||
import ActionButton from 'react-native-action-button';
|
||||
import Icon from 'react-native-vector-icons/Ionicons';
|
||||
|
||||
import React from 'react';
|
||||
// import PropTypes from 'prop-types';
|
||||
import { TextInput, StyleSheet, View, Text, Switch } from 'react-native';
|
||||
import RocketChat from '../lib/rocketchat';
|
||||
import { connect } from 'react-redux';
|
||||
import PropTypes from 'prop-types';
|
||||
import { TextInput, View, Text, Switch, TouchableOpacity, ScrollView } from 'react-native';
|
||||
import { createChannelRequest } from '../actions/createChannel';
|
||||
import styles from './Styles';
|
||||
import KeyboardView from '../components/KeyboardView';
|
||||
|
||||
// import KeyboardView from '../components/KeyboardView';
|
||||
@connect(state => ({
|
||||
result: state.createChannel
|
||||
}), dispatch => ({
|
||||
createChannel: data => dispatch(createChannelRequest(data))
|
||||
}))
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
view: {
|
||||
flex: 1,
|
||||
flexDirection: 'column',
|
||||
padding: 24
|
||||
},
|
||||
input: {
|
||||
// height: 50,
|
||||
fontSize: 20,
|
||||
borderColor: '#ffffff',
|
||||
padding: 5,
|
||||
borderWidth: 0,
|
||||
backgroundColor: 'white'
|
||||
},
|
||||
field: {
|
||||
flex: 1,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center'
|
||||
},
|
||||
field_label: {
|
||||
flexGrow: 1
|
||||
},
|
||||
field_input: {
|
||||
flexGrow: 1,
|
||||
fontSize: 20,
|
||||
borderColor: '#ffffff',
|
||||
padding: 5,
|
||||
borderWidth: 0,
|
||||
backgroundColor: 'white'
|
||||
},
|
||||
actionButtonIcon: {
|
||||
fontSize: 20,
|
||||
height: 22,
|
||||
color: 'white'
|
||||
}
|
||||
});
|
||||
const mainIcon = <Icon name='md-checkmark' style={styles.actionButtonIcon} />;
|
||||
export default class CreateChannelView extends React.Component {
|
||||
// static propTypes = {
|
||||
// navigation: PropTypes.object.isRequired
|
||||
// }
|
||||
|
||||
static navigationOptions = () => ({
|
||||
title: 'Create Channel'
|
||||
title: 'Create a New Channel'
|
||||
});
|
||||
static propTypes = {
|
||||
createChannel: PropTypes.func.isRequired,
|
||||
result: PropTypes.object.isRequired,
|
||||
navigator: PropTypes.object.isRequired
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
this.default = {
|
||||
channelName: '',
|
||||
type: true
|
||||
};
|
||||
this.state = this.default;
|
||||
this.props.navigator.setTitle({
|
||||
title: 'Create Channel'
|
||||
});
|
||||
// this.props.navigator.setSubTitle({
|
||||
// subtitle: 'Channels are where your team communicate.'
|
||||
// });
|
||||
}
|
||||
submit() {
|
||||
if (!this.state.channelName.trim() || this.props.result.isFetching) {
|
||||
return;
|
||||
}
|
||||
const { channelName, users = [], type = true } = this.state;
|
||||
RocketChat.createChannel({ name: channelName, users, type }).then(res => Promise.reject(res));
|
||||
|
||||
// { username: this.state.username }, this.state.password, () => {
|
||||
// this.props.navigation.dispatch({ type: 'Navigation/BACK' });
|
||||
// });
|
||||
this.props.createChannel({ name: channelName, users, type });
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={styles.view}>
|
||||
<View style={styles.field}>
|
||||
<KeyboardView style={[styles.view_white, { flex: 0, justifyContent: 'flex-start' }]}>
|
||||
<ScrollView>
|
||||
<View style={styles.formContainer}>
|
||||
<Text style={styles.label_white}>Channel Name</Text>
|
||||
<TextInput
|
||||
style={styles.field_input}
|
||||
value={this.state.channelName}
|
||||
style={styles.input_white}
|
||||
onChangeText={channelName => this.setState({ channelName })}
|
||||
autoCorrect={false}
|
||||
returnKeyType='done'
|
||||
|
|
@ -84,18 +62,22 @@ export default class CreateChannelView extends React.Component {
|
|||
// onSubmitEditing={() => this.textInput.focus()}
|
||||
placeholder='Type the channel name here'
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.field}>
|
||||
<Text style={styles.field_label}>{this.state.type ? 'Public' : 'Private'}</Text>
|
||||
{(this.props.result.failure && this.props.result.error.error === 'error-duplicate-channel-name') ? <Text style={[styles.label_white, { color: 'red', flexGrow: 1, paddingHorizontal: 0, marginBottom: 20 }]}>{this.props.result.error.reason}</Text> : null}
|
||||
<View style={[styles.view_white, { flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', paddingHorizontal: 0 }]}>
|
||||
<Switch
|
||||
style={styles.field_input}
|
||||
style={[{ flexGrow: 0, flexShrink: 1 }]}
|
||||
value={this.state.type}
|
||||
onValueChange={type => this.setState({ type })}
|
||||
/>
|
||||
<Text style={[styles.label_white, { flexGrow: 1, paddingHorizontal: 10 }]}>{this.state.type ? 'Public' : 'Private'}</Text>
|
||||
</View>
|
||||
{this.state.channelName.length > 0 ?
|
||||
<ActionButton buttonColor='green' icon={mainIcon} onPress={() => this.submit()} /> : null }
|
||||
<Text style={[styles.label_white, { color: '#9ea2a8', flexGrow: 1, paddingHorizontal: 0, marginBottom: 20 }]}>{this.state.type ? 'Everyone can access this channel' : 'Just invited people can access this channel'}</Text>
|
||||
<TouchableOpacity onPress={() => this.submit()} style={[styles.buttonContainer_white, { backgroundColor: (this.state.channelName.length === 0 || this.props.result.isFetching) ? '#e1e5e8' : '#1d74f5' }]}>
|
||||
<Text style={styles.button_white}> { this.props.result.isFetching ? 'LOADING' : 'CREATE' }!</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</KeyboardView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,105 @@
|
|||
import { StyleSheet } from 'react-native';
|
||||
|
||||
export default StyleSheet.create({
|
||||
view: {
|
||||
flex: 1,
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
padding: 20,
|
||||
alignItems: 'stretch',
|
||||
backgroundColor: '#2f343d'
|
||||
},
|
||||
view_white: {
|
||||
flex: 1,
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
padding: 20,
|
||||
alignItems: 'stretch',
|
||||
backgroundColor: '#fff'
|
||||
},
|
||||
logoContainer: {
|
||||
flex: 1,
|
||||
alignItems: 'center',
|
||||
flexGrow: 1,
|
||||
justifyContent: 'center'
|
||||
},
|
||||
logo: {
|
||||
width: 150,
|
||||
// backgroundColor: 'red'
|
||||
// height: 150,
|
||||
resizeMode: 'contain'
|
||||
},
|
||||
formContainer: {
|
||||
// marginBottom: 20
|
||||
},
|
||||
label: {
|
||||
lineHeight: 40,
|
||||
height: 40,
|
||||
fontSize: 16,
|
||||
marginBottom: 5,
|
||||
color: 'white'
|
||||
},
|
||||
label_white: {
|
||||
lineHeight: 40,
|
||||
height: 40,
|
||||
fontSize: 16,
|
||||
marginBottom: 5,
|
||||
color: '#2f343d'
|
||||
},
|
||||
input: {
|
||||
height: 45,
|
||||
marginBottom: 20,
|
||||
borderRadius: 2,
|
||||
// padding: 14,
|
||||
paddingHorizontal: 10,
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'rgba(255,255,255,.2)',
|
||||
borderColor: '#e1e5e8',
|
||||
color: 'white'
|
||||
},
|
||||
input_white: {
|
||||
height: 45,
|
||||
marginBottom: 20,
|
||||
borderRadius: 2,
|
||||
// padding: 14,
|
||||
paddingHorizontal: 10,
|
||||
borderWidth: 2,
|
||||
backgroundColor: 'white',
|
||||
borderColor: 'rgba(0,0,0,.15)',
|
||||
color: 'black'
|
||||
},
|
||||
buttonContainer: {
|
||||
paddingVertical: 15,
|
||||
backgroundColor: '#414852',
|
||||
marginBottom: 20
|
||||
},
|
||||
buttonContainer_white: {
|
||||
paddingVertical: 15,
|
||||
backgroundColor: '#1d74f5',
|
||||
marginBottom: 20
|
||||
},
|
||||
button: {
|
||||
textAlign: 'center',
|
||||
color: 'white',
|
||||
borderRadius: 2,
|
||||
fontWeight: '700'
|
||||
},
|
||||
button_white: {
|
||||
textAlign: 'center',
|
||||
color: 'white',
|
||||
borderRadius: 2,
|
||||
fontWeight: '700'
|
||||
},
|
||||
error: {
|
||||
textAlign: 'center',
|
||||
color: 'red',
|
||||
paddingTop: 5
|
||||
},
|
||||
loading: {
|
||||
flex: 1,
|
||||
position: 'absolute',
|
||||
backgroundColor: 'rgba(255,255,255,.2)',
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
});
|
||||
|
|
@ -3,7 +3,7 @@ import React from 'react';
|
|||
import Spinner from 'react-native-loading-spinner-overlay';
|
||||
|
||||
import PropTypes from 'prop-types';
|
||||
import { Keyboard, Text, TextInput, StyleSheet, View, Image, TouchableOpacity } from 'react-native';
|
||||
import { Keyboard, Text, TextInput, View, Image, TouchableOpacity } from 'react-native';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
// import * as actions from '../actions';
|
||||
|
|
@ -11,63 +11,7 @@ import * as loginActions from '../actions/login';
|
|||
import KeyboardView from '../components/KeyboardView';
|
||||
// import { Keyboard } from 'react-native'
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
view: {
|
||||
flex: 1,
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
padding: 20,
|
||||
alignItems: 'stretch',
|
||||
backgroundColor: '#2f343d'
|
||||
},
|
||||
logoContainer: {
|
||||
flex: 1,
|
||||
alignItems: 'center',
|
||||
flexGrow: 1,
|
||||
justifyContent: 'center'
|
||||
},
|
||||
logo: {
|
||||
width: 150,
|
||||
// backgroundColor: 'red'
|
||||
// height: 150,
|
||||
resizeMode: 'contain'
|
||||
},
|
||||
formContainer: {
|
||||
// marginBottom: 20
|
||||
},
|
||||
input: {
|
||||
height: 40,
|
||||
marginBottom: 20,
|
||||
borderRadius: 2,
|
||||
paddingHorizontal: 10,
|
||||
borderWidth: 0,
|
||||
backgroundColor: 'rgba(255,255,255,.2)',
|
||||
color: 'white'
|
||||
},
|
||||
buttonContainer: {
|
||||
paddingVertical: 15,
|
||||
backgroundColor: '#414852',
|
||||
marginBottom: 20
|
||||
},
|
||||
button: {
|
||||
textAlign: 'center',
|
||||
color: 'white',
|
||||
borderRadius: 2,
|
||||
fontWeight: '700'
|
||||
},
|
||||
error: {
|
||||
textAlign: 'center',
|
||||
color: 'red',
|
||||
paddingTop: 5
|
||||
},
|
||||
loading: {
|
||||
flex: 1,
|
||||
position: 'absolute',
|
||||
backgroundColor: 'rgba(255,255,255,.2)',
|
||||
left: 0,
|
||||
top: 0
|
||||
}
|
||||
});
|
||||
import styles from './Styles';
|
||||
|
||||
class LoginView extends React.Component {
|
||||
static propTypes = {
|
||||
|
|
@ -90,16 +34,33 @@ class LoginView extends React.Component {
|
|||
username: '',
|
||||
password: ''
|
||||
};
|
||||
|
||||
this.props.navigator.setTitle({
|
||||
}
|
||||
componentWillReceiveProps() {
|
||||
const { navigator } = this.props;
|
||||
navigator.setTitle({
|
||||
title: 'Login'
|
||||
});
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
this.props.navigator.setSubTitle({
|
||||
subtitle: nextProps.server
|
||||
navigator.setSubTitle({
|
||||
subtitle: this.props.server
|
||||
});
|
||||
navigator.setButtons({
|
||||
rightButtons: [{
|
||||
id: 'close',
|
||||
title: 'Cancel'
|
||||
}]
|
||||
});
|
||||
this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
|
||||
}
|
||||
onNavigatorEvent = (event) => {
|
||||
if (event.type === 'NavBarButtonPress') {
|
||||
if (event.id === 'close') {
|
||||
this.props.navigator.resetTo({
|
||||
screen: 'ListServer',
|
||||
animated: false
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
submit = () => {
|
||||
const { username, password, code } = this.state;
|
||||
|
|
@ -175,7 +136,7 @@ class LoginView extends React.Component {
|
|||
function mapStateToProps(state) {
|
||||
// console.log(Object.keys(state));
|
||||
return {
|
||||
server: state.server,
|
||||
server: state.server.server,
|
||||
Accounts_EmailOrUsernamePlaceholder: state.settings.Accounts_EmailOrUsernamePlaceholder,
|
||||
Accounts_PasswordPlaceholder: state.settings.Accounts_PasswordPlaceholder,
|
||||
login: state.login
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ const styles = StyleSheet.create({
|
|||
|
||||
|
||||
@connect(state => ({
|
||||
server: state.server,
|
||||
server: state.server.server,
|
||||
Site_Url: state.settings.Site_Url,
|
||||
Message_TimeFormat: state.settings.Message_TimeFormat,
|
||||
loading: state.messages.isFetching
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { Navigation } from 'react-native-navigation';
|
|||
import { ListView } from 'realm/react-native';
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import Icon from 'react-native-vector-icons/Ionicons';
|
||||
import { View, StyleSheet, TextInput, Platform } from 'react-native';
|
||||
import { connect } from 'react-redux';
|
||||
import * as actions from '../actions';
|
||||
|
|
@ -55,10 +56,10 @@ const styles = StyleSheet.create({
|
|||
|
||||
const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
|
||||
@connect(state => ({
|
||||
server: state.server,
|
||||
server: state.server.server,
|
||||
login: state.login,
|
||||
Site_Url: state.settings.Site_Url,
|
||||
canShowList: state.login.token.length || state.login.user.token
|
||||
canShowList: state.login.token || state.login.user.token
|
||||
}), dispatch => ({
|
||||
login: () => dispatch(actions.login()),
|
||||
connect: () => dispatch(server.connectRequest())
|
||||
|
|
@ -219,7 +220,16 @@ export default class RoomsListView extends React.Component {
|
|||
navigateToRoom({ sid: id });
|
||||
clearSearch();
|
||||
}
|
||||
|
||||
_createChannel = () => {
|
||||
Navigation.showModal({
|
||||
screen: 'CreateChannel',
|
||||
title: 'Create a New Channel',
|
||||
passProps: {},
|
||||
navigatorStyle: {},
|
||||
navigatorButtons: {},
|
||||
animationType: 'slide-up'
|
||||
});
|
||||
}
|
||||
renderSearchBar = () => (
|
||||
<View style={styles.searchBoxView}>
|
||||
<TextInput
|
||||
|
|
@ -256,7 +266,11 @@ export default class RoomsListView extends React.Component {
|
|||
/>
|
||||
)
|
||||
renderCreateButtons = () => (
|
||||
<ActionButton buttonColor='rgba(231,76,60,1)' />);
|
||||
<ActionButton buttonColor='rgba(231,76,60,1)'>
|
||||
<ActionButton.Item buttonColor='#9b59b6' title='Create Channel' onPress={() => { this._createChannel(); }} >
|
||||
<Icon name='md-chatbubbles' style={styles.actionButtonIcon} />
|
||||
</ActionButton.Item>
|
||||
</ActionButton>);
|
||||
render= () => (
|
||||
<View style={styles.container}>
|
||||
<Banner />
|
||||
|
|
|
|||
|
|
@ -65,13 +65,15 @@ const zeroconf = new Zeroconf();
|
|||
|
||||
|
||||
@connect(state => ({
|
||||
server: state.server
|
||||
server: state.server.server,
|
||||
login: state.login
|
||||
}), dispatch => ({
|
||||
selectServer: server => dispatch(setServer(server))
|
||||
}))
|
||||
export default class ListServerView extends React.Component {
|
||||
static propTypes = {
|
||||
navigator: PropTypes.object.isRequired,
|
||||
login: PropTypes.object.isRequired,
|
||||
selectServer: PropTypes.func.isRequired,
|
||||
actions: PropTypes.object,
|
||||
server: PropTypes.string
|
||||
|
|
@ -92,7 +94,7 @@ export default class ListServerView extends React.Component {
|
|||
id: 'add',
|
||||
title: 'Add'
|
||||
}],
|
||||
leftButtons: props.server && Platform.select({
|
||||
leftButtons: props.login.isAuthenticated && props.server && Platform.select({
|
||||
ios: [{
|
||||
id: 'close',
|
||||
title: 'Close'
|
||||
|
|
|
|||
|
|
@ -2,9 +2,8 @@ import React from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import { Navigation } from 'react-native-navigation';
|
||||
import { Text, TextInput, View, StyleSheet } from 'react-native';
|
||||
import _ from 'underscore';
|
||||
import realm from '../lib/realm';
|
||||
|
||||
import { connect } from 'react-redux';
|
||||
import { serverRequest, addServer } from '../actions/server';
|
||||
import KeyboardView from '../components/KeyboardView';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
|
|
@ -47,10 +46,20 @@ const styles = StyleSheet.create({
|
|||
flexGrow: 1
|
||||
}
|
||||
});
|
||||
|
||||
@connect(state => ({
|
||||
validInstance: !state.server.failure,
|
||||
validating: state.server.connecting
|
||||
}), dispatch => ({
|
||||
validateServer: url => dispatch(serverRequest(url)),
|
||||
addServer: url => dispatch(addServer(url))
|
||||
}))
|
||||
export default class NewServerView extends React.Component {
|
||||
static propTypes = {
|
||||
navigator: PropTypes.object.isRequired
|
||||
navigator: PropTypes.object.isRequired,
|
||||
validateServer: PropTypes.func.isRequired,
|
||||
addServer: PropTypes.func.isRequired,
|
||||
validating: PropTypes.bool.isRequired,
|
||||
validInstance: PropTypes.bool.isRequired
|
||||
}
|
||||
|
||||
static navigationOptions = () => ({
|
||||
|
|
@ -66,37 +75,11 @@ export default class NewServerView extends React.Component {
|
|||
};
|
||||
|
||||
this.submit = () => {
|
||||
let url = this.state.text.trim();
|
||||
if (!url) {
|
||||
url = this.state.defaultServer;
|
||||
} else {
|
||||
url = this.completeUrl(this.state.text);
|
||||
}
|
||||
|
||||
this.setState({
|
||||
editable: false
|
||||
});
|
||||
|
||||
this.inputElement.blur();
|
||||
this.validateServer(url).then(() => {
|
||||
realm.write(() => {
|
||||
realm.create('servers', { id: url, current: false }, true);
|
||||
});
|
||||
Navigation.dismissModal({
|
||||
animationType: 'slide-down'
|
||||
});
|
||||
}).catch(() => {
|
||||
this.setState({
|
||||
editable: true
|
||||
});
|
||||
this.inputElement.focus();
|
||||
});
|
||||
this.props.addServer(this.completeUrl(this.state.text.trim() || this.state.defaultServer));
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this._mounted = true;
|
||||
|
||||
this.props.navigator.setTitle({
|
||||
title: 'New server'
|
||||
});
|
||||
|
|
@ -111,11 +94,6 @@ export default class NewServerView extends React.Component {
|
|||
|
||||
this.props.navigator.setOnNavigatorEvent(this.onNavigatorEvent.bind(this));
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this._mounted = false;
|
||||
}
|
||||
|
||||
onNavigatorEvent = (event) => {
|
||||
if (event.type === 'NavBarButtonPress') {
|
||||
if (event.id === 'close') {
|
||||
|
|
@ -128,62 +106,8 @@ export default class NewServerView extends React.Component {
|
|||
|
||||
onChangeText = (text) => {
|
||||
this.setState({ text });
|
||||
|
||||
this.validateServerDebounced(text);
|
||||
this.props.validateServer(this.completeUrl(text));
|
||||
}
|
||||
|
||||
validateServer = url => new Promise((resolve, reject) => {
|
||||
url = this.completeUrl(url);
|
||||
|
||||
this.setState({
|
||||
validating: false,
|
||||
url
|
||||
});
|
||||
|
||||
if (/^(https?:\/\/)?(((\w|[0-9])+(\.(\w|[0-9-_])+)+)|localhost)(:\d+)?$/.test(url)) {
|
||||
this.setState({
|
||||
validating: true
|
||||
});
|
||||
|
||||
fetch(url, { method: 'HEAD' })
|
||||
.then((response) => {
|
||||
if (!this._mounted) {
|
||||
return;
|
||||
}
|
||||
if (response.status === 200 && response.headers.get('x-instance-id') != null && response.headers.get('x-instance-id').length) {
|
||||
this.setState({
|
||||
validInstance: true,
|
||||
validating: false
|
||||
});
|
||||
resolve(url);
|
||||
} else {
|
||||
this.setState({
|
||||
validInstance: false,
|
||||
validating: false
|
||||
});
|
||||
reject(url);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
if (!this._mounted) {
|
||||
return;
|
||||
}
|
||||
this.setState({
|
||||
validInstance: false,
|
||||
validating: false
|
||||
});
|
||||
reject(url);
|
||||
});
|
||||
} else {
|
||||
this.setState({
|
||||
validInstance: undefined
|
||||
});
|
||||
reject(url);
|
||||
}
|
||||
})
|
||||
|
||||
validateServerDebounced = _.debounce(this.validateServer, 1000)
|
||||
|
||||
completeUrl = (url) => {
|
||||
url = url.trim();
|
||||
|
||||
|
|
@ -203,7 +127,10 @@ export default class NewServerView extends React.Component {
|
|||
}
|
||||
|
||||
renderValidation = () => {
|
||||
if (this.state.validating) {
|
||||
if (!this.state.text.trim()) {
|
||||
return null;
|
||||
}
|
||||
if (this.props.validating) {
|
||||
return (
|
||||
<Text style={[styles.validateText, styles.validatingText]}>
|
||||
Validating {this.state.url} ...
|
||||
|
|
@ -211,22 +138,19 @@ export default class NewServerView extends React.Component {
|
|||
);
|
||||
}
|
||||
|
||||
if (this.state.validInstance) {
|
||||
if (this.props.validInstance) {
|
||||
return (
|
||||
<Text style={[styles.validateText, styles.validText]}>
|
||||
{this.state.url} is a valid Rocket.Chat instance
|
||||
</Text>
|
||||
);
|
||||
}
|
||||
|
||||
if (this.state.validInstance === false) {
|
||||
return (
|
||||
<Text style={[styles.validateText, styles.invalidText]}>
|
||||
{this.state.url} is not a valid Rocket.Chat instance
|
||||
</Text>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
12
package.json
12
package.json
|
|
@ -22,22 +22,16 @@
|
|||
"react-emojione": "^3.1.10",
|
||||
"react-native": "0.46.1",
|
||||
"react-native-action-button": "^2.7.2",
|
||||
"react-native-auto-grow-textinput": "^1.2.0",
|
||||
"react-native-autogrow-input": "^0.2.1",
|
||||
"react-native-autogrow-textinput": "^4.1.0",
|
||||
"react-native-animatable": "^1.2.3",
|
||||
"react-native-card-view": "0.0.3",
|
||||
"react-native-console-time-polyfill": "0.0.6",
|
||||
"react-native-easy-markdown": "git+https://github.com/lappalj4/react-native-easy-markdown.git",
|
||||
"react-native-fetch-blob": "^0.10.8",
|
||||
"react-native-form-generator": "^0.9.9",
|
||||
"react-native-image-picker": "^0.26.3",
|
||||
"react-native-image-picker": "^0.26.4",
|
||||
"react-native-img-cache": "^1.4.0",
|
||||
"react-native-loader": "^1.1.0",
|
||||
"react-native-loading-spinner-overlay": "^0.5.1",
|
||||
"react-native-loading-spinner-overlay": "^0.5.2",
|
||||
"react-native-meteor": "^1.1.0",
|
||||
"react-native-navigation": "^1.1.193",
|
||||
"react-native-optimized-flatlist": "^1.0.1",
|
||||
"react-native-router-flux": "^4.0.0-beta.18",
|
||||
"react-native-svg": "^5.4.1",
|
||||
"react-native-svg-image": "^1.1.4",
|
||||
"react-native-vector-icons": "^4.3.0",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
import React from 'react';
|
||||
import { ScrollView } from 'react-native';
|
||||
|
||||
import Avatar from '../../app/components/avatar';
|
||||
|
||||
export default (
|
||||
<ScrollView>
|
||||
<Avatar text={'test'} />
|
||||
<Avatar size={40} text={'aa'} />
|
||||
<Avatar size={30} text={'bb'} />
|
||||
<Avatar text={'test'} borderRadius={2} />
|
||||
</ScrollView>
|
||||
);
|
||||
|
|
@ -7,7 +7,9 @@ import { storiesOf } from '@storybook/react-native';
|
|||
// import { linkTo } from '@storybook/addon-links';
|
||||
|
||||
import DirectMessage from './Channels/DirectMessage';
|
||||
import Avatar from './Avatar';
|
||||
|
||||
storiesOf('Avatar', module).add('avatar', () => Avatar);
|
||||
storiesOf('Channel Cell', module).add('Direct Messages', () => DirectMessage);
|
||||
|
||||
// storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);
|
||||
|
|
|
|||
Loading…
Reference in New Issue