Merge pull request #103 from kaloudis/lost-changes

Restore lost changes

android/app/src/main/res/values/styles.xml

@@ -1,5 +1,5 @@
 <resources>
-    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
+    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <item name="colorPrimary">#000000</item>
         <item name="colorPrimaryDark">@color/black</item>
         <item name="colorAccent">@color/orange</item>

components/BalanceSlider.tsx

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { Slider } from 'react-native-elements';
+
+interface BalanceSliderProps {
+    localBalance: string | number;
+    remoteBalance: string | number;
+    list?: boolean;
+    theme?: string;
+}
+
+export default class BalanceSlider extends React.Component<BalanceSliderProps, {}> {
+    render() {
+        const { localBalance, remoteBalance, list, theme } = this.props;
+
+        const totalBalance = Number(localBalance || 0) + Number(remoteBalance || 0);
+
+        const ratio = Number(localBalance) / Number(totalBalance) || 0;
+
+        return (
+            <View style={list ? styles.sliderList : styles.slider}>
+                <Slider
+                    value={ratio}
+                    maximumTrackTintColor={"orange"}
+                    minimumTrackTintColor={theme === "dark" ? "#2b74b4" : "rgba(92, 99,216, 1)"}
+                    trackStyle={styles.trackStyle}
+                    thumbStyle={styles.thumbStyle}
+                />
+            </View>
+        );
+    }
+}
+
+const styles = StyleSheet.create({
+    slider: {
+        flex: 1,
+        marginLeft: 20,
+        marginRight: 20
+    },
+    sliderList: {
+        marginTop: -15,
+        marginLeft: 65,
+        marginRight: 20,
+        marginBottom: -5
+    },
+    trackStyle: {
+        backgroundColor: 'orange'
+    },
+    thumbStyle: {
+        width: 0,
+        height: 0
+    }
+});

components/CollapsedQR.tsx

@@ -0,0 +1,86 @@
+import * as React from 'react';
+import { StyleSheet, Text, View } from 'react-native';
+import { Button } from 'react-native-elements';
+import QRCode from 'react-native-qrcode';
+import CopyButton from './CopyButton';
+
+interface CollapsedQRProps {
+    theme: any;
+    value: string;
+    copyText?: string;
+}
+
+interface CollapsedQRState {
+    collapsed: boolean;
+}
+
+export default class CollapsedQR extends React.Component<CollapsedQRProps, CollapsedQRState> {
+    state = {
+        collapsed: true
+    }
+
+    toggleCollapse = () => {
+        this.setState({
+            collapsed: !this.state.collapsed
+        });
+    }
+
+    render() {
+        const { collapsed } = this.state;
+        const { theme, value, copyText } = this.props;
+
+        return (
+            <React.Fragment>
+                <Text style={theme === 'dark' ? styles.valueDark : styles.value}>{value}</Text>
+                {!collapsed && <View style={styles.qrPadding}>
+                    <QRCode
+                        value={value}
+                        size={200}
+                        fgColor='white'
+                    />
+                </View>}
+                <Button
+                    title={collapsed ? "Show QR" : "Hide QR"}
+                    icon={{
+                        name: "qrcode",
+                        type: "font-awesome",
+                        size: 25,
+                        color: '#fff'
+                    }}
+                    buttonStyle={{
+                        backgroundColor: "grey",
+                        borderRadius: 30,
+                    }}
+                    containerStyle={{
+                        paddingTop: collapsed ? 10 : 0,
+                        paddingBottom: 10
+                    }}
+                    onPress={() => this.toggleCollapse()}
+                />
+                <CopyButton
+                    copyValue={value}
+                    title={copyText || "Copy"}
+                />
+            </React.Fragment>
+        );
+    }
+}
+
+const styles = StyleSheet.create({
+    value: {
+        marginBottom: 15
+    },
+    valueDark: {
+        marginBottom: 15,
+        color: 'white'
+    },
+    qrPadding: {
+        width: 250,
+        height: 250,
+        backgroundColor: 'white',
+        alignItems: 'center',
+        alignSelf: 'center',
+        paddingTop: 25,
+        marginBottom: 10
+    }
+});

components/CopyButton.tsx

@@ -57,10 +57,17 @@ export default class CopyButton extends React.Component<CopyButtonProps, CopyBut
                     size: 25,
                     color: copied ? "black" : "white"
                 }}
-                backgroundColor={copied ? "white" : "black"}
-                color={copied ? "black" : "white"}
+                containerStyle={{
+                    marginBottom: 20
+                }}
+                buttonStyle={{
+                    backgroundColor: copied ? "white" : "black",
+                    borderRadius: 30
+                }}
+                titleStyle={{
+                    color: copied ? "black" : "white"
+                }}
                 onPress={() => this.copyToClipboard()}
-                borderRadius={30}
             />
         );
     }