Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add deposits container. #16

Merged
merged 2 commits into from Jul 23, 2018
Merged
Changes from all commits
Commits
File filter...
Filter file types
Jump to…
Jump to file
Failed to load files.

Always

Just for now

@@ -7,6 +7,7 @@ import { Transaction } from '../Types'

interface Props {
send: (amount: string) => Promise<Transaction>
didSend: () => void
}

interface State {
@@ -37,14 +38,16 @@ class TransferForm extends React.Component<Props, State> {
sending: false
})

this.props.didSend()

return transaction
}

render() {
const { amount, sending } = this.state

return (
<Container>
<Container style={{backgroundColor: '#F5FCFF'}}>
<Content scrollEnabled={false}>
<Form>
<Item floatingLabel>
@@ -0,0 +1,88 @@
import * as React from 'react'
import { View } from 'react-native'

import { NavigationScreenProps } from 'react-navigation'
import { Body, Button, Container, Content, Header, Icon, Left, Right, Text, Title } from 'native-base'
import { styles as s } from 'react-native-style-tachyons'
import layoutStyles from '../styles/layout'
import DismissableStackNavigator from './DismissableStackNavigator'
import { Transaction } from '../Types'
import TransferForm from '../components/TransferForm'
import CreditDebitMutation, { CREDIT_MUTATION } from '../mutations/CreditDebit'
import CurrentUserQuery, { GET_CURRENT_USER_QUERY } from '../queries/CurrentUser'

export class DepositScreen extends React.Component<NavigationScreenProps> {
async deposit(mutation, username: string, amount: string): Promise<Transaction> {
const { data } = await mutation({
variables: {
username,
amount
}
})

return data.credit
}

didSend(): void {
this.props.navigation.navigate('Home')
}

render() {
const { navigation } = this.props

const userSelected = () => navigation.navigate('PaymentDetails')

return (
<CurrentUserQuery query={GET_CURRENT_USER_QUERY}>
{({ loading, data }) => {
if (loading) {
return <Loading />
}

const { me } = data
return (
<Container style={{backgroundColor: '#F5FCFF'}}>
<Header style={layoutStyles.header}>
<Left>
<Button
transparent
onPress={() => this.props.screenProps.dismiss()}>
<Icon name='close' />
</Button>
</Left>
<Body>
<Title>Deposit</Title>
</Body>
<Right />
</Header>
<Content scrollEnabled={false}>
<CreditDebitMutation mutation={CREDIT_MUTATION}>
{(mutation, { data }) => {
return (
<TransferForm send={this.deposit.bind(this, mutation, me.username)} didSend={this.didSend.bind(this)} />
)
}}
</CreditDebitMutation>
</Content>
</Container>
)
}}
</CurrentUserQuery>
)
}
}

export default DismissableStackNavigator(
{
Deposit: {
screen: DepositScreen
}
},
{
initialRouteName: 'Deposit',
headerMode: 'none',
cardStyle: {
backgroundColor: '#F5FCFF'
}
}
)
@@ -19,32 +19,41 @@ export default class Drawer extends React.Component<NavigationScreenProps> {
render() {
return (
<Container style={{backgroundColor: '#F5FCFF'}}>
<Header style={{backgroundColor: '#F5FCFF'}} />
<Content>
<List>
<ListItem>
<Button
transparent
onPress={() => alert('implement me')}>
>
<Icon name="ios-qr-scanner" />
<Text>Your QR Code</Text>
</Button>
</ListItem>
<ListItem>
<ApolloConsumer>
{cache => (
<Button
transparent
onPress={() => { this.logout(cache) }}>
<Icon name="log-out" />
<Text>Log out</Text>
</Button>
)}
</ApolloConsumer>
</ListItem>
</List>
</Content>
<Header style={{backgroundColor: '#F5FCFF'}} />
<Content>
<List>
<ListItem>
<Button
transparent
onPress={() => alert('implement me')}>
>
<Icon name='ios-qr-scanner' />
<Text>Your QR Code</Text>
</Button>
</ListItem>
<ListItem>
<Button
transparent
onPress={() => this.props.navigation.navigate('Deposit')}>
>
<Icon name='ios-send' />
<Text>Deposit money</Text>
</Button>
</ListItem>
<ListItem>
<ApolloConsumer>
{cache => (
<Button
transparent
onPress={() => { this.logout(cache) }}>
<Icon name='log-out' />
<Text>Log out</Text>
</Button>
)}
</ApolloConsumer>
</ListItem>
</List>
</Content>
</Container>
)
}
@@ -9,6 +9,7 @@ import { InMemoryCache } from 'apollo-cache-inmemory'
import { onError } from 'apollo-link-error'
import { withClientState } from 'apollo-link-state'

import DepositStack from './Deposit'
import Drawer from './Drawer'
import HomeScreen from './Home'
import { AuthLoadingScreen, SignInScreen } from './SignInScreen'
@@ -30,6 +31,9 @@ const HomeStack = createStackNavigator(
},
NewPayment: {
screen: NewPaymentStack
},
Deposit: {
screen: DepositStack
}
},
{
@@ -0,0 +1,21 @@
import { Mutation } from 'react-apollo'
import gql from 'graphql-tag'
import { Transaction } from '../Types'

interface Data {
deposit: Transaction
}

interface Variables {
amount: string
username: string
}

export const CREDIT_MUTATION = gql`
mutation credit($amount: String!, $username: String!) {
credit(amount: $amount, username: $username) {
id
}
}
`
export default class CreditDebitMutation extends Mutation<Data, Variables> {}
ProTip! Use n and p to navigate between commits in a pull request.